@open-tender/store/dist/esm/config/itemOption.js

A library of hooks, reducers, utility functions, and types for use with Open Tender applications that utilize our in-store POS API

import { __assign } from "tslib";
import styles from '../styles';
import { theme } from '../utils';
var itemOption = {
    itemOption: {
        classes: '',
        props: {},
        style: {
            alignItems: 'stretch',
            flexGrow: 1,
            padding: theme.spacing.padding.small
        }
    },
    itemOption__container: {
        classes: '',
        props: {},
        style: {
            alignItems: 'stretch',
            flexGrow: 1,
            padding: theme.spacing.padding.small,
            position: 'relative'
        }
    },
    itemOption__containerRequired: {
        classes: '',
        props: {},
        style: {
            alignItems: 'stretch',
            backgroundColor: theme.colors.error.secondary,
            borderColor: theme.colors.error.primary,
            borderRadius: theme.spacing.borderRadius.medium,
            borderStyle: 'solid',
            borderWidth: theme.spacing.borderWidth.medium,
            flexGrow: 1,
            padding: theme.spacing.padding.small,
            position: 'relative'
        }
    },
    itemOption__decrease: {
        classes: '',
        props: {},
        style: {
            alignItems: 'center',
            display: 'flex',
            height: 48,
            justifyContent: 'center',
            position: 'absolute',
            left: theme.spacing.padding.small,
            marginLeft: 2,
            top: theme.spacing.padding.small,
            width: 48,
            zIndex: 1
        }
    },
    itemOption__decreaseIcon: {
        classes: 'buttonPrimary',
        props: { text: 'Decrease Quantity' },
        style: __assign(__assign({}, styles.buttonPrimary), { height: 30, lineHeight: 0, padding: 0, width: 30 })
    },
    itemOption__increase: {
        classes: '',
        props: {},
        style: {
            alignItems: 'center',
            display: 'flex',
            height: 48,
            justifyContent: 'center',
            position: 'absolute',
            right: theme.spacing.padding.small,
            marginRight: 2,
            top: theme.spacing.padding.small,
            width: 48,
            zIndex: 1
        }
    },
    itemOption__increaseIcon: {
        classes: 'buttonPrimary',
        props: { text: 'Decrease Quantity' },
        style: __assign(__assign({}, styles.buttonPrimary), { height: 30, lineHeight: 0, padding: 0, width: 30 })
    },
    itemOption__button: {
        classes: '',
        props: {},
        style: {
            alignItems: 'stretch',
            // backgroundColor: theme.colors.card.primary,
            // borderRadius: theme.spacing.borderRadius.small,
            // boxShadow: theme.colors.boxShadow.primary,
            display: 'flex',
            flexDirection: 'column',
            flexGrow: 1,
            height: 260,
            overflow: 'hidden'
            // padding: theme.spacing.padding.small,
        }
    },
    itemOption__quantityContainer: {
        classes: '',
        props: {},
        style: {
            alignItems: 'center',
            flexDirection: 'row',
            flexGrow: 0,
            flexShrink: 0,
            height: 48,
            justifyContent: 'center'
        }
    },
    itemOption__quantity: {
        classes: '',
        props: {},
        style: __assign(__assign({}, styles.textHeading), { fontSize: theme.fontSizes.medium, lineHeight: 1 })
    },
    itemOption__imageContainer: {
        classes: '',
        props: {},
        style: {
            alignItems: 'center',
            flexGrow: 1,
            flexShrink: 1,
            justifyContent: 'center'
        }
    },
    itemOption__imageWrapper: {
        classes: '',
        props: {},
        style: {
            alignItems: 'stretch',
            borderRadius: 60,
            height: 120,
            justifyContent: 'center',
            overflow: 'hidden',
            width: 120
        }
    },
    itemOption__image: {
        classes: '',
        props: {},
        style: {
            backgroundColor: theme.colors.background.tertiary,
            backgroundPosition: 'center',
            backgroundSize: 'cover',
            flexGrow: 1
        }
    },
    itemOption__priceContainer: {
        classes: '',
        props: {},
        style: {
            // backgroundColor: 'palegreen',
            alignItems: 'flex-end',
            flexDirection: 'row',
            flexGrow: 0,
            flexShrink: 0,
            gap: 15,
            justifyContent: 'center',
            paddingBottom: 3
        }
    },
    itemOption__price: {
        classes: '',
        props: {},
        style: __assign(__assign({}, styles.textHeading), { fontSize: theme.fontSizes.xxsmall, lineHeight: 1 })
    },
    itemOption__cals: {
        classes: '',
        props: {},
        style: __assign(__assign({}, styles.textBody), { fontSize: theme.fontSizes.xxsmall, lineHeight: 1 })
    },
    itemOption__nameContainer: {
        classes: '',
        props: {},
        style: {
            alignItems: 'center',
            flexGrow: 0,
            flexShrink: 0,
            // height: 48,
            justifyContent: 'flex-end',
            paddingBottom: 10,
            paddingLeft: 5,
            paddingRight: 5
        }
    },
    itemOption__name: {
        classes: '',
        props: {},
        style: __assign(__assign({}, styles.textHeading), { fontSize: theme.fontSizes.medium, height: theme.fontSizes.medium, lineHeight: 1, overflow: 'hidden' })
    },
    itemOption__groups: {
        classes: '',
        props: {},
        style: {
            alignItems: 'stretch'
            // backgroundColor: theme.colors.background.tertiary,
            // borderRadius: theme.spacing.borderRadius.xsmall,
            // padding: theme.spacing.padding.small
        }
    },
    itemOption__groupsOptions: {
        classes: '',
        props: {},
        style: {
            alignItems: 'center',
            justifyContent: 'center',
            marginBottom: theme.spacing.padding.small,
            textAlign: 'center'
        }
    },
    itemOption__groupsOptionNames: {
        classes: '',
        props: {},
        style: __assign(__assign({}, styles.textBody), { fontSize: theme.fontSizes.small })
    },
    itemOption__groupsButton: {
        classes: '',
        props: {},
        style: __assign(__assign({}, styles.buttonPrimary), { borderRadius: theme.spacing.borderRadius.xsmall, paddingBottom: 10, paddingLeft: 5, paddingRight: 5, paddingTop: 10 })
    },
    itemOption__groupsButtonRequired: {
        classes: '',
        props: {},
        style: __assign(__assign({}, styles.buttonDelete), { borderColor: theme.colors.error.primary, borderRadius: theme.spacing.borderRadius.xsmall, paddingBottom: 10, paddingLeft: 5, paddingRight: 5, paddingTop: 10 })
    }
};
export default itemOption;