@open-tender/store 0.1.9 → 0.1.280

package/dist/cjs/components/Discount.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var Discount = function (_a) {
+    var discount = _a.discount, children = _a.children, isSmall = _a.isSmall;
+    var apiUrl = (0, hooks_1.useAppSelector)(slices_1.selectKioskApi);
+    var _b = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig), config = _b.discount, cardConfig = _b.card;
+    if (!config)
+        return null;
+    return children({ config: config, discount: discount, cardConfig: cardConfig, apiUrl: apiUrl, isSmall: isSmall });
+};
+exports.default = Discount;

package/dist/cjs/components/ErrorMessage.d.ts

@@ -0,0 +1,9 @@
+import { ErrorMessageProps, Styles } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const ErrorMessage: ({ content, icon, style, children }: {
+    content: string;
+    icon?: ReactNode;
+    style?: Styles;
+    children: (props: ErrorMessageProps) => ReactNode;
+}) => ReactNode;
+export default ErrorMessage;

package/dist/cjs/components/ErrorMessage.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var ErrorMessage = function (_a) {
+    var content = _a.content, icon = _a.icon, style = _a.style, children = _a.children;
+    var config = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig).errorMessage;
+    if (!config)
+        return null;
+    return children({ config: config, icon: icon, style: style, children: content });
+};
+exports.default = ErrorMessage;

package/dist/cjs/components/FavsButton.d.ts

@@ -0,0 +1,11 @@
+import { MenuItem } from '@open-tender/types';
+import { FavsButtonProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const FavsButton: ({ title, path, item, navigate, children }: {
+    title: string;
+    path: string;
+    item: MenuItem;
+    navigate: (route: string) => void;
+    children: (props: FavsButtonProps) => ReactNode;
+}) => ReactNode;
+export default FavsButton;

package/dist/cjs/components/FavsButton.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var hooks_1 = require("../app/hooks");
+var hooks_2 = require("../hooks");
+var slices_1 = require("../slices");
+var FavsButton = function (_a) {
+    var title = _a.title, path = _a.path, item = _a.item, navigate = _a.navigate, children = _a.children;
+    var config = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig).favsButton;
+    var imageUrl = (0, hooks_2.useKioskImageUrl)(item);
+    var browse = function () { return navigate(path); };
+    var handlers = { browse: browse };
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        handlers: handlers,
+        title: title,
+        imageUrl: imageUrl
+    });
+};
+exports.default = FavsButton;

package/dist/cjs/components/Header.d.ts

@@ -0,0 +1,13 @@
+import { HeaderProps, SignInButtonProps, TagsButtonProps } from '@open-tender/ui';
+import React, { ReactNode } from 'react';
+declare const Header: ({ to, backText, backAction, pathname, navigate, children, SignInButtonView, TagsButtonView }: {
+    to?: string;
+    backText?: string;
+    backAction?: () => void;
+    pathname: string;
+    navigate: (route: string) => void;
+    children: (props: HeaderProps) => ReactNode;
+    SignInButtonView: (props: SignInButtonProps) => ReactNode;
+    TagsButtonView?: (props: TagsButtonProps) => ReactNode;
+}) => React.ReactNode;
+export default Header;

package/dist/cjs/components/Header.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var SignInButton_1 = tslib_1.__importDefault(require("./SignInButton"));
+var TagsButton_1 = tslib_1.__importDefault(require("./TagsButton"));
+var Header = function (_a) {
+    var to = _a.to, _b = _a.backText, backText = _b === void 0 ? 'Back' : _b, backAction = _a.backAction, pathname = _a.pathname, navigate = _a.navigate, children = _a.children, SignInButtonView = _a.SignInButtonView, TagsButtonView = _a.TagsButtonView;
+    var dispatch = (0, hooks_1.useAppDispatch)();
+    var config = ((0, hooks_1.useAppSelector)(slices_1.selectKioskConfig) || {}).header;
+    var showButtons = !!(backAction || to);
+    var _c = (0, hooks_1.useAppSelector)(slices_1.selectStoreSettings), display_sign_in = _c.display_sign_in, display_allergens = _c.display_allergens, display_tags = _c.display_tags;
+    var back = function () {
+        if (backAction) {
+            backAction();
+        }
+        else if (to) {
+            navigate(to);
+        }
+        else {
+            navigate('/');
+        }
+    };
+    var startOver = function () { return navigate('/'); };
+    var open = function () {
+        dispatch((0, slices_1.toggleSidebar)());
+    };
+    var handlers = { back: back, open: open, startOver: startOver };
+    var renderSignInButton = (0, react_1.useCallback)(function () { return (react_1.default.createElement(SignInButton_1.default, { pathname: pathname, navigate: navigate, children: SignInButtonView })); }, [pathname, navigate, SignInButtonView]);
+    var renderTagsButton = (0, react_1.useCallback)(function () {
+        return TagsButtonView ? react_1.default.createElement(TagsButton_1.default, { children: TagsButtonView }) : null;
+    }, [TagsButtonView]);
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        handlers: handlers,
+        showButtons: showButtons,
+        backText: backText,
+        renderSignInButton: display_sign_in ? renderSignInButton : undefined,
+        renderTagsButton: TagsButtonView && (display_allergens || display_tags)
+            ? renderTagsButton
+            : undefined
+    });
+};
+exports.default = Header;

package/dist/cjs/components/IdleModal.d.ts

@@ -0,0 +1,8 @@
+import { IdleModalProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const IdleModal: ({ close, reset, children }: {
+    close: () => void;
+    reset: () => void;
+    children: (props: IdleModalProps) => ReactNode;
+}) => ReactNode;
+export default IdleModal;

package/dist/cjs/components/IdleModal.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var WAITING_TIME_IN_SECONDS = 15;
+var IdleModal = function (_a) {
+    var close = _a.close, reset = _a.reset, children = _a.children;
+    var _b = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig), config = _b.idleModal, modalContentConfig = _b.modalContent;
+    var handlers = (0, react_1.useMemo)(function () { return ({ close: close, reset: reset }); }, [close, reset]);
+    (0, react_1.useEffect)(function () {
+        var timerId = setTimeout(reset, WAITING_TIME_IN_SECONDS * 1000);
+        return function () { return clearTimeout(timerId); };
+    }, [reset]);
+    if (!config)
+        return null;
+    return children({ config: config, modalContentConfig: modalContentConfig, handlers: handlers });
+};
+exports.default = IdleModal;

package/dist/cjs/components/Ingredients.d.ts

@@ -0,0 +1,10 @@
+import { IngredientsProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const Ingredients: ({ title, subtitle, ingredients, close, children }: {
+    title: string;
+    subtitle?: string;
+    ingredients: string;
+    close: () => void;
+    children: (props: IngredientsProps) => ReactNode;
+}) => ReactNode;
+export default Ingredients;

package/dist/cjs/components/Ingredients.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var Ingredients = function (_a) {
+    var title = _a.title, subtitle = _a.subtitle, ingredients = _a.ingredients, close = _a.close, children = _a.children;
+    var _b = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig), config = _b.ingredients, modalContentConfig = _b.modalContent;
+    var handlers = { close: close };
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        modalContentConfig: modalContentConfig,
+        handlers: handlers,
+        title: title,
+        subtitle: subtitle,
+        ingredients: ingredients
+    });
+};
+exports.default = Ingredients;

package/dist/cjs/components/Input.d.ts

@@ -0,0 +1,11 @@
+import { InputProps, Styles } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const Input: ({ label, value, setValue, isRequired, style, children }: {
+    label?: string;
+    value: string;
+    setValue: (value: string) => void;
+    isRequired?: boolean;
+    style?: Styles;
+    children: (props: InputProps) => ReactNode;
+}) => ReactNode;
+export default Input;

package/dist/cjs/components/Input.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var Input = function (_a) {
+    var label = _a.label, value = _a.value, setValue = _a.setValue, isRequired = _a.isRequired, style = _a.style, children = _a.children;
+    var _b = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig), config = _b.input, labelConfig = _b.label;
+    var update = function (evt) {
+        setValue(evt.target.value);
+    };
+    var handlers = { update: update };
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        handlers: handlers,
+        label: label,
+        value: value,
+        isRequired: isRequired,
+        style: style,
+        labelConfig: labelConfig
+    });
+};
+exports.default = Input;

package/dist/cjs/components/InputButton.d.ts

@@ -0,0 +1,13 @@
+import { InputButtonProps, Styles } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const InputButton: ({ label, value, open, isRequired, style, labelStyle, showOptionalLabel, children }: {
+    label?: string;
+    value: string;
+    open: () => void;
+    isRequired?: boolean;
+    style?: Styles;
+    labelStyle?: Styles;
+    showOptionalLabel?: boolean;
+    children: (props: InputButtonProps) => ReactNode;
+}) => ReactNode;
+export default InputButton;

package/dist/cjs/components/InputButton.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var InputButton = function (_a) {
+    var label = _a.label, value = _a.value, open = _a.open, isRequired = _a.isRequired, style = _a.style, labelStyle = _a.labelStyle, showOptionalLabel = _a.showOptionalLabel, children = _a.children;
+    var _b = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig), config = _b.inputButton, labelConfig = _b.label;
+    var handlers = { open: open };
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        labelConfig: labelConfig,
+        handlers: handlers,
+        label: label,
+        value: value,
+        isRequired: isRequired,
+        style: style,
+        labelStyle: labelStyle,
+        showOptionalLabel: showOptionalLabel
+    });
+};
+exports.default = InputButton;

package/dist/cjs/components/ItemGroup.d.ts

@@ -0,0 +1,14 @@
+import { CartItemGroup } from '@open-tender/types';
+import { ErrorMessageProps, ItemGroupProps, SuccessMessageProps } from '@open-tender/ui';
+import React from 'react';
+declare const _default: React.MemoExoticComponent<({ group, content, flash, index, onItemClicked, children, ErrorMessageView, SuccessMessageView }: {
+    group: CartItemGroup;
+    content: React.ReactNode;
+    flash?: boolean | undefined;
+    index?: number | undefined;
+    onItemClicked?: ((index?: number | undefined) => void) | undefined;
+    children: (props: ItemGroupProps) => React.ReactNode;
+    ErrorMessageView: (props: ErrorMessageProps) => React.ReactNode;
+    SuccessMessageView: (props: SuccessMessageProps) => React.ReactNode;
+}) => React.ReactNode>;
+export default _default;

package/dist/cjs/components/ItemGroup.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var utils_1 = require("@open-tender/utils");
+var react_1 = tslib_1.__importStar(require("react"));
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var ErrorMessage_1 = tslib_1.__importDefault(require("./ErrorMessage"));
+var SuccessMessage_1 = tslib_1.__importDefault(require("./SuccessMessage"));
+var ItemGroup = function (_a) {
+    var group = _a.group, content = _a.content, flash = _a.flash, index = _a.index, onItemClicked = _a.onItemClicked, children = _a.children, ErrorMessageView = _a.ErrorMessageView, SuccessMessageView = _a.SuccessMessageView;
+    var config = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig).itemGroup;
+    var modifierGroup = (0, utils_1.useModifierGroup)(group);
+    var renderErrorMessage = (0, react_1.useCallback)(function (icon, children) { return (react_1.default.createElement(ErrorMessage_1.default, { icon: icon, content: children, children: ErrorMessageView })); }, [ErrorMessageView]);
+    var renderSuccessMessage = (0, react_1.useCallback)(function (icon, children) { return (react_1.default.createElement(SuccessMessage_1.default, { icon: icon, content: children, children: SuccessMessageView })); }, [SuccessMessageView]);
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        group: modifierGroup,
+        children: content,
+        flash: flash,
+        index: index,
+        onItemClicked: onItemClicked,
+        renderErrorMessage: renderErrorMessage,
+        renderSuccessMessage: renderSuccessMessage
+    });
+};
+exports.default = react_1.default.memo(ItemGroup);

package/dist/cjs/components/ItemGroups.d.ts

@@ -0,0 +1,17 @@
+import { CartItemGroups, CartLevels } from '@open-tender/types';
+import { Handlers, ItemGroupsProps, ItemOptionProps, ErrorMessageProps, SuccessMessageProps, ItemGroupProps } from '@open-tender/ui';
+import React, { ReactNode } from 'react';
+declare const ItemGroups: ({ handlers, groups, levels, excludeSize, configName, optionConfigName, children, ItemGroupView, ItemOptionView, ErrorMessageView, SuccessMessageView }: {
+    handlers: Handlers;
+    groups: CartItemGroups;
+    levels: CartLevels;
+    excludeSize?: boolean;
+    configName?: string;
+    optionConfigName?: string;
+    children: (props: ItemGroupsProps) => ReactNode;
+    ItemOptionView: (props: ItemOptionProps) => ReactNode;
+    ItemGroupView: (props: ItemGroupProps) => ReactNode;
+    ErrorMessageView: (props: ErrorMessageProps) => ReactNode;
+    SuccessMessageView: (props: SuccessMessageProps) => ReactNode;
+}) => React.ReactNode;
+export default ItemGroups;

package/dist/cjs/components/ItemGroups.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var ItemGroup_1 = tslib_1.__importDefault(require("./ItemGroup"));
+var ItemOption_1 = tslib_1.__importDefault(require("./ItemOption"));
+var ItemGroups = function (_a) {
+    var handlers = _a.handlers, groups = _a.groups, levels = _a.levels, _b = _a.excludeSize, excludeSize = _b === void 0 ? true : _b, _c = _a.configName, configName = _c === void 0 ? 'itemGroups' : _c, _d = _a.optionConfigName, optionConfigName = _d === void 0 ? 'itemOption' : _d, children = _a.children, ItemGroupView = _a.ItemGroupView, ItemOptionView = _a.ItemOptionView, ErrorMessageView = _a.ErrorMessageView, SuccessMessageView = _a.SuccessMessageView;
+    var _e = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig), _f = configName, config = _e[_f];
+    var renderItemOption = (0, react_1.useCallback)(function (group, option) { return (react_1.default.createElement(ItemOption_1.default, { key: "".concat(group.id, "-").concat(option.id), levels: levels, handlers: handlers, group: group, option: option, children: ItemOptionView, configName: optionConfigName })); }, [levels, handlers, ItemOptionView, optionConfigName]);
+    var renderItemGroup = (0, react_1.useCallback)(function (group, content) { return (react_1.default.createElement(ItemGroup_1.default, { key: group.id, SuccessMessageView: SuccessMessageView, ErrorMessageView: ErrorMessageView, group: group, content: content, children: ItemGroupView })); }, [ItemGroupView, ErrorMessageView, SuccessMessageView]);
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        groups: groups,
+        excludeSize: excludeSize,
+        renderItemOption: renderItemOption,
+        renderItemGroup: renderItemGroup
+    });
+};
+exports.default = ItemGroups;

package/dist/cjs/components/ItemOption.d.ts

@@ -0,0 +1,13 @@
+import { CartItemGroup, CartItemOption, CartLevels } from '@open-tender/types';
+import { Handlers, ItemOptionProps } from '@open-tender/ui';
+import React from 'react';
+declare const _default: React.MemoExoticComponent<({ handlers, group, option, levels, placeholder, children, configName }: {
+    handlers: Handlers;
+    group: CartItemGroup;
+    option: CartItemOption;
+    levels: CartLevels;
+    placeholder?: string | undefined;
+    children: (props: ItemOptionProps) => React.ReactNode;
+    configName?: string | undefined;
+}) => React.ReactNode>;
+export default _default;

package/dist/cjs/components/ItemOption.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var utils_1 = require("@open-tender/utils");
+var react_1 = tslib_1.__importDefault(require("react"));
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var ItemOption = function (_a) {
+    var handlers = _a.handlers, group = _a.group, option = _a.option, levels = _a.levels, placeholder = _a.placeholder, children = _a.children, _b = _a.configName, configName = _b === void 0 ? 'itemOption' : _b;
+    var dispatch = (0, hooks_1.useAppDispatch)();
+    var apiUrl = (0, hooks_1.useAppSelector)(slices_1.selectKioskApi);
+    var _c = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig), _d = configName, config = _c[_d];
+    var toggleOption = handlers.toggleOption, incrementOption = handlers.incrementOption, decrementOption = handlers.decrementOption, setOptionQuantity = handlers.setOptionQuantity;
+    var allergenAlerts = [];
+    var modifier = (0, utils_1.useModifier)(group, option, levels, toggleOption, incrementOption, decrementOption, setOptionQuantity, allergenAlerts);
+    var showNested = function () {
+        // dispatch(setCurrentOption(modifier))
+        var currentOption = {
+            groupId: group.id,
+            optionId: option.id,
+            levels: modifier.updatedLevels
+        };
+        dispatch((0, slices_1.setCurrentOption)(currentOption));
+    };
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        handlers: tslib_1.__assign({ showNested: showNested }, handlers),
+        group: group,
+        option: modifier,
+        groupOption: option,
+        apiUrl: apiUrl,
+        placeholder: placeholder
+    });
+};
+exports.default = react_1.default.memo(ItemOption);

package/dist/cjs/components/ItemOptionSelected.d.ts

@@ -0,0 +1,11 @@
+import { CartItemGroup, CartItemOption, CartLevels } from '@open-tender/types';
+import { Handlers, ItemOptionProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const ItemOptionSelected: ({ handlers, group, option, levels, children }: {
+    handlers: Handlers;
+    group: CartItemGroup;
+    option: CartItemOption;
+    levels: CartLevels;
+    children: (props: ItemOptionProps) => ReactNode;
+}) => ReactNode;
+export default ItemOptionSelected;

package/dist/cjs/components/ItemOptionSelected.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var utils_1 = require("@open-tender/utils");
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var ItemOptionSelected = function (_a) {
+    var handlers = _a.handlers, group = _a.group, option = _a.option, levels = _a.levels, children = _a.children;
+    var dispatch = (0, hooks_1.useAppDispatch)();
+    var apiUrl = (0, hooks_1.useAppSelector)(slices_1.selectKioskApi);
+    var config = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig).itemOptionSelected;
+    var toggleOption = handlers.toggleOption, incrementOption = handlers.incrementOption, decrementOption = handlers.decrementOption, setOptionQuantity = handlers.setOptionQuantity;
+    var allergenAlerts = [];
+    var modifier = (0, utils_1.useModifier)(group, option, levels, toggleOption, incrementOption, decrementOption, setOptionQuantity, allergenAlerts);
+    var showNested = function () {
+        // dispatch(setCurrentOption(modifier))
+        var currentOption = {
+            groupId: group.id,
+            optionId: option.id,
+            levels: modifier.updatedLevels
+        };
+        dispatch((0, slices_1.setCurrentOption)(currentOption));
+    };
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        handlers: { showNested: showNested },
+        group: group,
+        groupOption: option,
+        option: modifier,
+        apiUrl: apiUrl
+    });
+};
+exports.default = ItemOptionSelected;

package/dist/cjs/components/ItemSelections.d.ts

@@ -0,0 +1,13 @@
+import { CartItemGroups, CartLevels } from '@open-tender/types';
+import { Handlers, ItemSelectionsProps, ItemOptionProps, ErrorMessageProps } from '@open-tender/ui';
+import React, { ReactNode } from 'react';
+declare const ItemSelections: ({ handlers, groups, levels, isIncomplete, children, ItemOptionView, ErrorMessageView }: {
+    handlers: Handlers;
+    groups: CartItemGroups;
+    levels: CartLevels;
+    isIncomplete: boolean;
+    children: (props: ItemSelectionsProps) => ReactNode;
+    ItemOptionView: (props: ItemOptionProps) => ReactNode;
+    ErrorMessageView: (props: ErrorMessageProps) => ReactNode;
+}) => React.ReactNode;
+export default ItemSelections;

package/dist/cjs/components/ItemSelections.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var ErrorMessage_1 = tslib_1.__importDefault(require("./ErrorMessage"));
+var ItemOptionSelected_1 = tslib_1.__importDefault(require("./ItemOptionSelected"));
+var ItemSelections = function (_a) {
+    var handlers = _a.handlers, groups = _a.groups, levels = _a.levels, isIncomplete = _a.isIncomplete, children = _a.children, ItemOptionView = _a.ItemOptionView, ErrorMessageView = _a.ErrorMessageView;
+    var config = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig).itemSelections;
+    var display_customize = (0, hooks_1.useAppSelector)(slices_1.selectStoreSettings).display_customize;
+    var renderErrorMessage = (0, react_1.useCallback)(function (icon, children) { return (react_1.default.createElement(ErrorMessage_1.default, { icon: icon, content: children, children: ErrorMessageView })); }, [ErrorMessageView]);
+    var renderItemOption = (0, react_1.useCallback)(function (group, option) { return (react_1.default.createElement(ItemOptionSelected_1.default, { levels: levels, handlers: handlers, group: group, option: option, children: ItemOptionView })); }, [levels, handlers, ItemOptionView]);
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        groups: groups,
+        isIncomplete: isIncomplete,
+        isCustomize: display_customize,
+        renderErrorMessage: renderErrorMessage,
+        renderItemOption: renderItemOption
+    });
+};
+exports.default = ItemSelections;

package/dist/cjs/components/ItemSize.d.ts

@@ -0,0 +1,9 @@
+import { CartItemGroup } from '@open-tender/types';
+import { ItemSizeProps } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const ItemSize: ({ sizeGroup, toggleSize, children }: {
+    sizeGroup?: CartItemGroup | null;
+    toggleSize: (optionId: number) => void;
+    children: (props: ItemSizeProps) => ReactNode;
+}) => ReactNode;
+export default ItemSize;

package/dist/cjs/components/ItemSize.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var ItemSize = function (_a) {
+    var _b;
+    var sizeGroup = _a.sizeGroup, toggleSize = _a.toggleSize, children = _a.children;
+    var config = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig).itemSize;
+    var appliedOption = (_b = sizeGroup === null || sizeGroup === void 0 ? void 0 : sizeGroup.options) === null || _b === void 0 ? void 0 : _b.find(function (i) { return i.quantity > 0; });
+    var appliedId = (appliedOption === null || appliedOption === void 0 ? void 0 : appliedOption.id) || null;
+    var handlers = { toggleSize: toggleSize };
+    if (!config || !sizeGroup)
+        return null;
+    return children({
+        config: config,
+        handlers: handlers,
+        sizeGroup: sizeGroup,
+        appliedId: appliedId
+    });
+};
+exports.default = ItemSize;

package/dist/cjs/components/Keypad.d.ts

@@ -0,0 +1,11 @@
+import { Handlers, KeypadProps, KeypadType } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const Keypad: ({ children, maxLength, type, value, handlers, isEmail }: {
+    children: (props: KeypadProps) => ReactNode;
+    maxLength?: number;
+    type?: KeypadType;
+    value: string;
+    handlers: Handlers;
+    isEmail?: boolean;
+}) => ReactNode;
+export default Keypad;

package/dist/cjs/components/Keypad.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var utils_1 = require("../utils");
+var Keypad = function (_a) {
+    var children = _a.children, maxLength = _a.maxLength, type = _a.type, value = _a.value, handlers = _a.handlers, isEmail = _a.isEmail;
+    var _b = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig), keypad = _b.keypad, numpad = _b.numpad;
+    var isDollar = type === 'dollar';
+    var config = type === 'numeric' || isDollar ? numpad : keypad;
+    var _c = (0, react_1.useState)(false), isShiftOn = _c[0], setIsShiftOn = _c[1];
+    var handleOnKeyPress = (0, react_1.useCallback)(function (key) {
+        setIsShiftOn(function (prev) { return (key === '\u21E7' ? !prev : prev); });
+        handlers.change((0, utils_1.getKeyboardValue)(key, value, maxLength, isShiftOn));
+    }, [handlers, value, maxLength, isShiftOn]);
+    var viewHandlers = (0, react_1.useMemo)(function () { return ({ keyPress: handleOnKeyPress }); }, [handleOnKeyPress]);
+    if (!config)
+        return null;
+    return children({
+        config: config,
+        handlers: viewHandlers,
+        value: value,
+        type: type,
+        isEmail: isEmail,
+        isShiftOn: isShiftOn
+    });
+};
+exports.default = Keypad;

package/dist/cjs/components/Label.d.ts

@@ -0,0 +1,10 @@
+import { LabelProps, Styles } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const Label: ({ content, label, isRequired, style, children }: {
+    content: ReactNode;
+    label?: string;
+    isRequired?: boolean;
+    style?: Styles;
+    children: (props: LabelProps) => ReactNode;
+}) => ReactNode;
+export default Label;

package/dist/cjs/components/Label.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var Label = function (_a) {
+    var content = _a.content, label = _a.label, isRequired = _a.isRequired, style = _a.style, children = _a.children;
+    var config = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig).label;
+    if (!config)
+        return null;
+    return children({ config: config, label: label, isRequired: isRequired, style: style, children: content });
+};
+exports.default = Label;

package/dist/cjs/components/Loader.d.ts

@@ -0,0 +1,8 @@
+import { LoaderProps, Styles } from '@open-tender/ui';
+import { ReactNode } from 'react';
+declare const Loader: ({ text, style, children }: {
+    text?: string;
+    style?: Styles;
+    children: (props: LoaderProps) => ReactNode;
+}) => ReactNode;
+export default Loader;

package/dist/cjs/components/Loader.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var hooks_1 = require("../app/hooks");
+var slices_1 = require("../slices");
+var Loader = function (_a) {
+    var text = _a.text, style = _a.style, children = _a.children;
+    var config = (0, hooks_1.useAppSelector)(slices_1.selectKioskConfig).loader;
+    if (!config)
+        return null;
+    return children({ config: config, text: text, style: style });
+};
+exports.default = Loader;