@open-tender/store 0.1.9 → 0.1.280

package/dist/esm/components/MadeForNotes.d.ts

@@ -0,0 +1,13 @@
+import { KeypadProps, KeypadModalProps } from '@open-tender/ui';
+import React, { ReactNode } from 'react';
+declare const MadeForNotes: ({ subtitle, hasNotes, notes, setNotes, close, children, KeypadView, title }: {
+    subtitle: string;
+    hasNotes: boolean;
+    notes: string | null;
+    title: string;
+    setNotes: (notes: string) => void;
+    close: () => void;
+    children: (props: KeypadModalProps) => ReactNode;
+    KeypadView: (props: KeypadProps) => ReactNode;
+}) => React.ReactNode;
+export default MadeForNotes;

package/dist/esm/components/MadeForNotes.js

@@ -0,0 +1,24 @@
+import React, { useCallback, useMemo } from 'react';
+import { useAppSelector } from '../app/hooks';
+import { selectKioskConfig } from '../slices';
+import { default as KeypadContainer } from './Keypad';
+var MadeForNotes = function (_a) {
+    var subtitle = _a.subtitle, hasNotes = _a.hasNotes, notes = _a.notes, setNotes = _a.setNotes, close = _a.close, children = _a.children, KeypadView = _a.KeypadView, title = _a.title;
+    var _b = useAppSelector(selectKioskConfig), config = _b.keypadModal, modalContentConfig = _b.modalContent;
+    var handlers = { submit: close };
+    var keypadHandlers = useMemo(function () { return ({
+        change: setNotes
+    }); }, [setNotes]);
+    var renderKeypad = useCallback(function () { return (React.createElement(KeypadContainer, { type: "default", handlers: keypadHandlers, value: notes !== null && notes !== void 0 ? notes : '', children: KeypadView })); }, [keypadHandlers, notes, KeypadView]);
+    if (!config || !modalContentConfig || !hasNotes)
+        return null;
+    return children({
+        config: config,
+        modalContentConfig: modalContentConfig,
+        handlers: handlers,
+        subtitle: subtitle,
+        title: title,
+        renderKeypad: renderKeypad
+    });
+};
+export default MadeForNotes;

package/dist/esm/components/Main.d.ts

@@ -0,0 +1,7 @@
+import { MainProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const Main: ({ children, content }: {
+    children: (props: MainProps) => ReactNode;
+    content: ReactNode;
+}) => ReactNode;
+export default Main;

package/dist/esm/components/Main.js

@@ -0,0 +1,10 @@
+import { useAppSelector } from '../app/hooks';
+import { selectKioskConfig } from '../slices';
+var Main = function (_a) {
+    var children = _a.children, content = _a.content;
+    var config = useAppSelector(selectKioskConfig).main;
+    if (!config)
+        return null;
+    return children({ config: config, content: content });
+};
+export default Main;

package/dist/esm/components/MenuCategory.d.ts

@@ -0,0 +1,10 @@
+import { MenuCategory as MenuCategoryType } from '@open-tender/types';
+import { MenuCategoryProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const MenuCategory: ({ category, placeholder, navigate, children }: {
+    category: MenuCategoryType;
+    placeholder?: string;
+    navigate: (route: string) => void;
+    children: (props: MenuCategoryProps) => ReactNode;
+}) => ReactNode;
+export default MenuCategory;

package/dist/esm/components/MenuCategory.js

@@ -0,0 +1,18 @@
+import { useAppDispatch, useAppSelector } from '../app/hooks';
+import { useKioskImageUrl } from '../hooks';
+import { selectKioskConfig, setCurrentCategory } from '../slices';
+var MenuCategory = function (_a) {
+    var category = _a.category, placeholder = _a.placeholder, navigate = _a.navigate, children = _a.children;
+    var dispatch = useAppDispatch();
+    var config = useAppSelector(selectKioskConfig).menuCategory;
+    var imageUrl = useKioskImageUrl(category);
+    var browse = function () {
+        dispatch(setCurrentCategory(category));
+        navigate('/menu/category');
+    };
+    var handlers = { browse: browse };
+    if (!config)
+        return null;
+    return children({ config: config, handlers: handlers, category: category, imageUrl: imageUrl, placeholder: placeholder });
+};
+export default MenuCategory;

package/dist/esm/components/MenuOther.d.ts

@@ -0,0 +1,13 @@
+import { MenuItem } from '@open-tender/types';
+import { MenuOtherProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const MenuOther: ({ title, subtitle, showSubtitle, path, item, children, navigate }: {
+    title: string;
+    subtitle?: string | null;
+    showSubtitle?: boolean;
+    path: string;
+    item: MenuItem;
+    navigate: (route: string) => void;
+    children: (props: MenuOtherProps) => ReactNode;
+}) => ReactNode;
+export default MenuOther;

package/dist/esm/components/MenuOther.js

@@ -0,0 +1,25 @@
+import { useAppDispatch, useAppSelector } from '../app/hooks';
+import { selectKioskApi, selectKioskConfig, setCurrentCategory } from '../slices';
+var MenuOther = function (_a) {
+    var title = _a.title, subtitle = _a.subtitle, _b = _a.showSubtitle, showSubtitle = _b === void 0 ? true : _b, path = _a.path, item = _a.item, children = _a.children, navigate = _a.navigate;
+    var dispatch = useAppDispatch();
+    var apiUrl = useAppSelector(selectKioskApi);
+    var config = useAppSelector(selectKioskConfig).menuCategory;
+    var browse = function () {
+        dispatch(setCurrentCategory(null));
+        navigate(path);
+    };
+    var handlers = { browse: browse };
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        handlers: handlers,
+        title: title,
+        subtitle: subtitle,
+        showSubtitle: showSubtitle,
+        item: item,
+        apiUrl: apiUrl
+    });
+};
+export default MenuOther;

package/dist/esm/components/ModalContent.d.ts

@@ -0,0 +1,15 @@
+import { ModalContentProps, Styles } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const ModalContent: ({ title, subtitle, content, submit, submitText, cancel, cancelText, style, error, children }: {
+    title?: string;
+    subtitle?: string | null;
+    content: ReactNode;
+    submit?: () => void;
+    submitText?: string;
+    cancel?: () => void;
+    cancelText?: string;
+    style?: Styles;
+    error?: string;
+    children: (props: ModalContentProps) => ReactNode;
+}) => ReactNode;
+export default ModalContent;

package/dist/esm/components/ModalContent.js

@@ -0,0 +1,21 @@
+import { useAppSelector } from '../app/hooks';
+import { selectKioskConfig } from '../slices';
+var ModalContent = function (_a) {
+    var title = _a.title, subtitle = _a.subtitle, content = _a.content, submit = _a.submit, submitText = _a.submitText, cancel = _a.cancel, cancelText = _a.cancelText, style = _a.style, error = _a.error, children = _a.children;
+    var config = useAppSelector(selectKioskConfig).modalContent;
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        title: title,
+        subtitle: subtitle,
+        children: content,
+        submit: submit,
+        submitText: submitText,
+        cancel: cancel,
+        cancelText: cancelText,
+        style: style,
+        error: error
+    });
+};
+export default ModalContent;

package/dist/esm/components/ModalHeader.d.ts

@@ -0,0 +1,8 @@
+import { ModalHeaderProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const ModalHeader: ({ title, subtitle, children }: {
+    title: string;
+    subtitle?: string;
+    children: (props: ModalHeaderProps) => ReactNode;
+}) => ReactNode;
+export default ModalHeader;

package/dist/esm/components/ModalHeader.js

@@ -0,0 +1,10 @@
+import { useAppSelector } from '../app/hooks';
+import { selectKioskConfig } from '../slices';
+var ModalHeader = function (_a) {
+    var title = _a.title, subtitle = _a.subtitle, children = _a.children;
+    var config = useAppSelector(selectKioskConfig).modalHeader;
+    if (!config)
+        return null;
+    return children({ config: config, title: title, subtitle: subtitle });
+};
+export default ModalHeader;

package/dist/esm/components/Notifications.d.ts

@@ -0,0 +1,6 @@
+import { NotificationsProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const Notifications: ({ children }: {
+    children: (props: NotificationsProps) => ReactNode;
+}) => ReactNode;
+export default Notifications;

package/dist/esm/components/Notifications.js

@@ -0,0 +1,11 @@
+import { useAppSelector } from '../app/hooks';
+import { selectKioskConfig, selectNotifications } from '../slices';
+var Notifications = function (_a) {
+    var children = _a.children;
+    var config = useAppSelector(selectKioskConfig).notifications;
+    var messages = useAppSelector(selectNotifications);
+    if (!config)
+        return null;
+    return children({ config: config, messages: messages });
+};
+export default Notifications;

package/dist/esm/components/NutritionalInfo.d.ts

@@ -0,0 +1,11 @@
+import { NutritionalInfo as NutritionalInfoType } from '@open-tender/types';
+import { NutritionalInfoProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const NutritionalInfo: ({ title, subtitle, nutritionalInfo, close, children }: {
+    title: string;
+    subtitle?: string;
+    nutritionalInfo: NutritionalInfoType;
+    close: () => void;
+    children: (props: NutritionalInfoProps) => ReactNode;
+}) => ReactNode;
+export default NutritionalInfo;

package/dist/esm/components/NutritionalInfo.js

@@ -0,0 +1,18 @@
+import { useAppSelector } from '../app/hooks';
+import { selectKioskConfig } from '../slices';
+var NutritionalInfo = function (_a) {
+    var title = _a.title, subtitle = _a.subtitle, nutritionalInfo = _a.nutritionalInfo, close = _a.close, children = _a.children;
+    var _b = useAppSelector(selectKioskConfig), config = _b.nutritionalInfo, modalContentConfig = _b.modalContent;
+    var handlers = { close: close };
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        handlers: handlers,
+        title: title,
+        subtitle: subtitle,
+        nutritionalInfo: nutritionalInfo,
+        modalContentConfig: modalContentConfig
+    });
+};
+export default NutritionalInfo;

package/dist/esm/components/Option.d.ts

@@ -0,0 +1,16 @@
+import { CartItemOption, CartLevels } from '@open-tender/types';
+import { Handlers, OptionProps, ItemGroupsProps, ItemGroupProps, ItemOptionProps, SuccessMessageProps, ErrorMessageProps } from '@open-tender/ui';
+import React, { ReactNode } from 'react';
+declare const Option: ({ option, levels, handlers, close, children, ItemGroupsView, ItemGroupView, ItemOptionView, SuccessMessageView, ErrorMessageView }: {
+    option: CartItemOption | null;
+    levels: CartLevels | null;
+    handlers: Handlers;
+    close: () => void;
+    children: (props: OptionProps) => ReactNode;
+    ItemGroupsView: (props: ItemGroupsProps) => ReactNode;
+    ItemGroupView: (props: ItemGroupProps) => ReactNode;
+    ItemOptionView: (props: ItemOptionProps) => ReactNode;
+    SuccessMessageView: (props: SuccessMessageProps) => ReactNode;
+    ErrorMessageView: (props: ErrorMessageProps) => ReactNode;
+}) => React.ReactNode;
+export default Option;

package/dist/esm/components/Option.js

@@ -0,0 +1,34 @@
+import { __assign } from "tslib";
+import React, { useCallback, useMemo } from 'react';
+import { useAppSelector } from '../app/hooks';
+import { selectKioskConfig } from '../slices';
+import { default as ItemGroupsContainer } from './ItemGroups';
+var Option = function (_a) {
+    var option = _a.option, levels = _a.levels, handlers = _a.handlers, close = _a.close, children = _a.children, ItemGroupsView = _a.ItemGroupsView, ItemGroupView = _a.ItemGroupView, ItemOptionView = _a.ItemOptionView, SuccessMessageView = _a.SuccessMessageView, ErrorMessageView = _a.ErrorMessageView;
+    var _b = useAppSelector(selectKioskConfig), config = _b.option, modalContentConfig = _b.modalContent;
+    var handlersOption = useMemo(function () { return (__assign(__assign({}, handlers), { close: close })); }, [handlers, close]);
+    var renderItemGroups = useCallback(function (excludeSize) {
+        if (!option || !levels)
+            return React.createElement(React.Fragment, null);
+        return (React.createElement(ItemGroupsContainer, { levels: levels, handlers: handlersOption, groups: option.groups, excludeSize: excludeSize, children: ItemGroupsView, ItemGroupView: ItemGroupView, ItemOptionView: ItemOptionView, SuccessMessageView: SuccessMessageView, ErrorMessageView: ErrorMessageView }));
+    }, [
+        levels,
+        option,
+        handlersOption,
+        ItemGroupsView,
+        ItemGroupView,
+        ItemOptionView,
+        SuccessMessageView,
+        ErrorMessageView
+    ]);
+    if (!config || !option || !levels)
+        return null;
+    return children({
+        config: config,
+        handlers: handlersOption,
+        option: option,
+        modalContentConfig: modalContentConfig,
+        renderItemGroups: renderItemGroups
+    });
+};
+export default Option;

package/dist/esm/components/OrderCard.d.ts

@@ -0,0 +1,10 @@
+import { Order } from '@open-tender/types';
+import { ErrorMessageProps, OrderCardProps } from '@open-tender/ui';
+import React, { ReactNode } from 'react';
+declare const OrderCard: ({ order, goToCheckout, children, ErrorMessageView }: {
+    order: Order;
+    goToCheckout: () => void;
+    children: (props: OrderCardProps) => ReactNode;
+    ErrorMessageView: (props: ErrorMessageProps) => ReactNode;
+}) => React.ReactNode;
+export default OrderCard;

package/dist/esm/components/OrderCard.js

@@ -0,0 +1,55 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import { v4 as uuidv4 } from 'uuid';
+import { useAppDispatch, useAppSelector } from '../app/hooks';
+import { useOrder } from '../hooks';
+import { selectKioskConfig, selectOrder, reorder as reorderPastOrder, openModal, selectKioskApi, setOrderId } from '../slices';
+import { default as ErrorMessageContainer } from './ErrorMessage';
+var OrderCard = function (_a) {
+    var order = _a.order, goToCheckout = _a.goToCheckout, children = _a.children, ErrorMessageView = _a.ErrorMessageView;
+    var dispatch = useAppDispatch();
+    var apiUrl = useAppSelector(selectKioskApi);
+    var _b = useState(null), errMsg = _b[0], setErrMsg = _b[1];
+    var _c = useState(false), isReordering = _c[0], setIsReordering = _c[1];
+    var config = useAppSelector(selectKioskConfig).orderCard;
+    var _d = useAppSelector(selectOrder), loading = _d.loading, error = _d.error;
+    var isLoading = loading === 'pending';
+    var _e = useOrder(order), itemImages = _e.itemImages, itemNames = _e.itemNames, orderNo = _e.orderNo, title = _e.title, subtitle = _e.subtitle;
+    var view = function () {
+        dispatch(openModal({ type: 'ORDER_DETAILS', args: { order: order, goToCheckout: goToCheckout } }));
+    };
+    var reorder = function () {
+        setErrMsg(null);
+        setIsReordering(true);
+        dispatch(reorderPastOrder(order.cart));
+    };
+    var handlers = { view: view, reorder: reorder };
+    useEffect(function () {
+        if (isReordering && !isLoading) {
+            setIsReordering(false);
+            if (error) {
+                setErrMsg(error.detail);
+            }
+            else {
+                dispatch(setOrderId(uuidv4()));
+                goToCheckout();
+            }
+        }
+    }, [dispatch, isLoading, isReordering, error, goToCheckout]);
+    var renderErrorMessage = useCallback(function (errMsg) { return (React.createElement(ErrorMessageContainer, { content: errMsg, children: ErrorMessageView })); }, [ErrorMessageView]);
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        handlers: handlers,
+        isReordering: isReordering,
+        errMsg: errMsg,
+        subtitle: subtitle,
+        title: title,
+        orderNo: orderNo,
+        itemNames: itemNames,
+        itemImages: itemImages,
+        renderErrorMessage: renderErrorMessage,
+        apiUrl: apiUrl
+    });
+};
+export default OrderCard;

package/dist/esm/components/OrderDetails.d.ts

@@ -0,0 +1,12 @@
+import { Order } from '@open-tender/types';
+import { CheckTotalsProps, OrderDetailsItemProps, OrderDetailsProps } from '@open-tender/ui';
+import React, { ReactNode } from 'react';
+declare const OrderDetails: ({ order, close, goToCheckout, children, CheckTotalsView, OrderDetailsItemView }: {
+    order: Order;
+    close: () => void;
+    goToCheckout: () => void;
+    children: (props: OrderDetailsProps) => ReactNode;
+    CheckTotalsView: (props: CheckTotalsProps) => ReactNode;
+    OrderDetailsItemView: (props: OrderDetailsItemProps) => ReactNode;
+}) => React.ReactNode;
+export default OrderDetails;

package/dist/esm/components/OrderDetails.js

@@ -0,0 +1,55 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import { v4 as uuidv4 } from 'uuid';
+import { useAppDispatch, useAppSelector } from '../app/hooks';
+import { useOrder } from '../hooks';
+import { selectKioskConfig, reorder as reorderPastOrder, selectKioskApi, selectOrder, setOrderId } from '../slices';
+import { default as CheckTotalsContainer } from './CheckTotals';
+import { default as OrderDetailsItemContainer } from './OrderDetailsItem';
+var OrderDetails = function (_a) {
+    var order = _a.order, close = _a.close, goToCheckout = _a.goToCheckout, children = _a.children, CheckTotalsView = _a.CheckTotalsView, OrderDetailsItemView = _a.OrderDetailsItemView;
+    var dispatch = useAppDispatch();
+    var apiUrl = useAppSelector(selectKioskApi);
+    var _b = useState(null), errMsg = _b[0], setErrMsg = _b[1];
+    var _c = useState(false), isReordering = _c[0], setIsReordering = _c[1];
+    var _d = useOrder(order), subtitle = _d.title, title = _d.orderNo, requestedAt = _d.requestedAt;
+    var _e = useAppSelector(selectOrder), loading = _e.loading, error = _e.error;
+    var isLoading = loading === 'pending';
+    var _f = useAppSelector(selectKioskConfig), config = _f.orderDetails, modalContentConfig = _f.modalContent;
+    var reorder = function () {
+        setErrMsg(null);
+        setIsReordering(true);
+        dispatch(reorderPastOrder(order.cart));
+    };
+    var renderCheckTotals = useCallback(function () { return React.createElement(CheckTotalsContainer, { check: order, children: CheckTotalsView }); }, [order, CheckTotalsView]);
+    var renderOrderDetailsItem = useCallback(function (orderItem) { return (React.createElement(OrderDetailsItemContainer, { key: orderItem.id, orderItem: orderItem, children: OrderDetailsItemView })); }, [OrderDetailsItemView]);
+    useEffect(function () {
+        if (isReordering && !isLoading) {
+            setIsReordering(false);
+            if (error) {
+                setErrMsg(error.detail);
+            }
+            else {
+                dispatch(setOrderId(uuidv4()));
+                goToCheckout();
+                close();
+            }
+        }
+    }, [dispatch, isLoading, isReordering, error, goToCheckout, close]);
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        modalContentConfig: modalContentConfig,
+        renderCheckTotals: renderCheckTotals,
+        requestedAt: requestedAt,
+        order: order,
+        title: title,
+        subtitle: subtitle,
+        isReordering: isReordering,
+        errMsg: errMsg,
+        handlers: { reorder: reorder, close: close },
+        apiUrl: apiUrl,
+        renderOrderDetailsItem: renderOrderDetailsItem
+    });
+};
+export default OrderDetails;

package/dist/esm/components/OrderDetailsItem.d.ts

@@ -0,0 +1,8 @@
+import { OrderItem } from '@open-tender/types';
+import { OrderDetailsItemProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const OrderDetailsItem: ({ orderItem, children }: {
+    orderItem: OrderItem;
+    children: (props: OrderDetailsItemProps) => ReactNode;
+}) => ReactNode;
+export default OrderDetailsItem;

package/dist/esm/components/OrderDetailsItem.js

@@ -0,0 +1,11 @@
+import { useAppSelector } from '../app/hooks';
+import { selectKioskApi, selectKioskConfig } from '../slices';
+var OrderDetailsItem = function (_a) {
+    var orderItem = _a.orderItem, children = _a.children;
+    var apiUrl = useAppSelector(selectKioskApi);
+    var config = useAppSelector(selectKioskConfig).orderDetailsItem;
+    if (!config)
+        return null;
+    return children({ config: config, orderItem: orderItem, apiUrl: apiUrl });
+};
+export default OrderDetailsItem;

package/dist/esm/components/PointsReward.d.ts

@@ -0,0 +1,11 @@
+import { OrderItem } from '@open-tender/types';
+import { PointsRewardProps, QuantityProps } from '@open-tender/ui';
+import React, { ReactNode } from 'react';
+declare const PointsReward: ({ item, callback, children, QuantityView }: {
+    item: OrderItem;
+    callback?: () => void;
+    isLast?: boolean;
+    children: (props: PointsRewardProps) => ReactNode;
+    QuantityView: (props: QuantityProps) => ReactNode;
+}) => React.ReactNode;
+export default PointsReward;

package/dist/esm/components/PointsReward.js

@@ -0,0 +1,62 @@
+import { __spreadArray } from "tslib";
+import React from 'react';
+import { useAppDispatch, useAppSelector } from '../app/hooks';
+import { useCustomerRewards } from '../hooks';
+import { selectKioskApi, selectKioskConfig, selectPosCheckout, setPoints } from '../slices';
+import { default as QuantityContainer } from './Quantity';
+var PointsReward = function (_a) {
+    var _b;
+    var item = _a.item, callback = _a.callback, children = _a.children, QuantityView = _a.QuantityView;
+    var dispatch = useAppDispatch();
+    var apiUrl = useAppSelector(selectKioskApi);
+    var _c = useAppSelector(selectKioskConfig), config = _c.pointsReward, successMessageConfig = _c.successMessage;
+    var checkPoints = useAppSelector(selectPosCheckout).points;
+    var _d = useCustomerRewards(), points = _d.points, pointsRemaining = _d.pointsRemaining;
+    if (!item.points || item.points.index === undefined || !points)
+        return null;
+    var _e = item.points, index = _e.index, per = _e.per;
+    // const appliedIndices = checkPoints.map(i => i.index)
+    // const isApplied = appliedIndices.includes(index)
+    var itemPointsApplied = ((_b = checkPoints.find(function (i) { return i.index === index; })) === null || _b === void 0 ? void 0 : _b.points) || 0;
+    var apply = function () {
+        var currentItem = checkPoints.find(function (i) { return i.index === index; });
+        var currentPoints = currentItem ? currentItem.points : 0;
+        var updatedItem = {
+            index: index,
+            points: currentPoints + per
+        };
+        var otherItems = checkPoints.filter(function (i) { return i.index !== index; });
+        var updatedPoints = __spreadArray(__spreadArray([], otherItems, true), [updatedItem], false);
+        dispatch(setPoints(updatedPoints));
+        // dispatch(validatePosOrder())
+        if (callback)
+            callback();
+    };
+    var remove = function () {
+        var currentItem = checkPoints.find(function (i) { return i.index === index; });
+        var currentPoints = currentItem ? currentItem.points : 0;
+        var updatedItem = {
+            index: index,
+            points: currentPoints - per
+        };
+        var otherItems = checkPoints.filter(function (i) { return i.index !== index; });
+        var updatedPoints = updatedItem.points > 0 ? __spreadArray(__spreadArray([], otherItems, true), [updatedItem], false) : otherItems;
+        dispatch(setPoints(updatedPoints));
+        // dispatch(validatePosOrder())
+        if (callback)
+            callback();
+    };
+    var renderQuantity = function (quantity, incrementDisabled) { return (React.createElement(QuantityContainer, { quantity: quantity, increment: apply, incrementDisabled: incrementDisabled, decrement: remove, fontSize: 24, iconSize: 28, children: QuantityView })); };
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        item: item,
+        itemPointsApplied: itemPointsApplied,
+        pointsRemaining: pointsRemaining,
+        successMessageConfig: successMessageConfig,
+        renderQuantity: renderQuantity,
+        apiUrl: apiUrl
+    });
+};
+export default PointsReward;

package/dist/esm/components/PointsRewards.d.ts

@@ -0,0 +1,8 @@
+import { PointsRewardProps, PointsRewardsProps, QuantityProps } from '@open-tender/ui';
+import React, { ReactNode } from 'react';
+declare const PointsRewards: ({ children, PointsRewardView, QuantityView }: {
+    children: (props: PointsRewardsProps) => ReactNode;
+    PointsRewardView: (props: PointsRewardProps) => ReactNode;
+    QuantityView: (props: QuantityProps) => ReactNode;
+}) => React.ReactNode;
+export default PointsRewards;

package/dist/esm/components/PointsRewards.js

@@ -0,0 +1,22 @@
+import React, { useCallback } from 'react';
+import { useAppSelector } from '../app/hooks';
+import { useCustomerRewards } from '../hooks';
+import { selectKioskConfig } from '../slices';
+import { default as PointsRewardContainer } from './PointsReward';
+var PointsRewards = function (_a) {
+    var children = _a.children, PointsRewardView = _a.PointsRewardView, QuantityView = _a.QuantityView;
+    var config = useAppSelector(selectKioskConfig).pointsRewards;
+    var _b = useCustomerRewards(), items = _b.items, points = _b.points, pointsApplied = _b.pointsApplied, pointsRemaining = _b.pointsRemaining;
+    var renderPointReward = useCallback(function (item) { return (React.createElement(PointsRewardContainer, { item: item, children: PointsRewardView, QuantityView: QuantityView })); }, [PointsRewardView, QuantityView]);
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        items: items,
+        points: points,
+        pointsApplied: pointsApplied,
+        pointsRemaining: pointsRemaining,
+        renderPointReward: renderPointReward
+    });
+};
+export default PointsRewards;

package/dist/esm/components/PromoCode.d.ts

@@ -0,0 +1,9 @@
+import { ErrorMessageProps, KeypadProps, PromoCodeProps } from '@open-tender/ui';
+import React, { ReactNode } from 'react';
+declare const PromoCode: ({ close, children, KeypadView, ErrorMessageView }: {
+    close: () => void;
+    children: (props: PromoCodeProps) => ReactNode;
+    KeypadView: (props: KeypadProps) => ReactNode;
+    ErrorMessageView: (props: ErrorMessageProps) => ReactNode;
+}) => React.ReactNode;
+export default PromoCode;

package/dist/esm/components/PromoCode.js

@@ -0,0 +1,49 @@
+import { handleRespError } from '@open-tender/utils';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { useAppDispatch, useAppSelector } from '../app/hooks';
+import { addPromoCode, selectKioskConfig, selectOrder } from '../slices';
+import { default as ErrorMessageContainer } from './ErrorMessage';
+import { default as KeypadContainer } from './Keypad';
+var PromoCode = function (_a) {
+    var close = _a.close, children = _a.children, KeypadView = _a.KeypadView, ErrorMessageView = _a.ErrorMessageView;
+    var dispatch = useAppDispatch();
+    var _b = useState(''), promoCode = _b[0], setPromoCode = _b[1];
+    var _c = useState(false), submitted = _c[0], setSubmitted = _c[1];
+    var _d = useState(null), errMsg = _d[0], setErrMsg = _d[1];
+    var _e = useAppSelector(selectKioskConfig), config = _e.promoCode, modalContentConfig = _e.modalContent;
+    var _f = useAppSelector(selectOrder), loading = _f.loading, error = _f.error;
+    var isLoading = loading === 'pending';
+    var submit = function () {
+        setSubmitted(true);
+        dispatch(addPromoCode(promoCode));
+    };
+    var handlers = { submit: submit, close: close };
+    useEffect(function () {
+        if (submitted && !isLoading) {
+            setSubmitted(false);
+            if (error) {
+                var detail = handleRespError(error).detail;
+                setErrMsg(detail || 'Something went wrong');
+            }
+            else {
+                close();
+            }
+        }
+    }, [submitted, isLoading, error, close]);
+    var renderErrorMessage = useCallback(function (errMsg) { return (React.createElement(ErrorMessageContainer, { content: errMsg, children: ErrorMessageView })); }, [ErrorMessageView]);
+    var keypadHandlers = useMemo(function () { return ({
+        change: setPromoCode
+    }); }, [setPromoCode]);
+    var renderKeypad = useCallback(function () { return (React.createElement(KeypadContainer, { type: "default", handlers: keypadHandlers, value: promoCode, children: KeypadView })); }, [keypadHandlers, promoCode, KeypadView]);
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        handlers: handlers,
+        errMsg: errMsg,
+        renderErrorMessage: renderErrorMessage,
+        modalContentConfig: modalContentConfig,
+        renderKeypad: renderKeypad
+    });
+};
+export default PromoCode;

package/dist/esm/components/Quantity.d.ts

@@ -0,0 +1,15 @@
+import { QuantityProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const Quantity: ({ quantity, increment, incrementDisabled, decrement, decrementDisabled, fontSize, iconSize, strokeWidth, className, children }: {
+    quantity: number;
+    increment: () => void;
+    incrementDisabled?: boolean;
+    decrement: () => void;
+    decrementDisabled?: boolean;
+    fontSize?: number;
+    iconSize?: number;
+    strokeWidth?: number;
+    className?: string;
+    children: (props: QuantityProps) => ReactNode;
+}) => ReactNode;
+export default Quantity;