"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ProductOption = void 0;
var react_1 = __importDefault(require("react"));
var material_1 = require("@mui/material");
var react_fontawesome_1 = require("@fortawesome/react-fontawesome");
var pro_regular_svg_icons_1 = require("@fortawesome/pro-regular-svg-icons");
var index_1 = require("../../index");
var Flex_1 = require("../Flex");
var ProductOption = function (_a) {
    var _b = _a.isSelected, isSelected = _b === void 0 ? false : _b, _c = _a.onClick, onClick = _c === void 0 ? function () { } : _c, _d = _a.name, name = _d === void 0 ? "" : _d, icon = _a.icon, _e = _a.selectable, selectable = _e === void 0 ? true : _e, children = _a.children, _f = _a.maxWidth, maxWidth = _f === void 0 ? 250 : _f;
    return (react_1.default.createElement(material_1.Paper, { variant: "outlined", style: {
            borderColor: isSelected ? index_1.green.standard : index_1.grey.standard,
            maxWidth: maxWidth,
        } },
        react_1.default.createElement(Flex_1.Flex, { column: true, justifyContent: "space-between", alignItems: "center" },
            react_1.default.createElement(Flex_1.Flex, { column: true, alignItems: "center", mb: 4 },
                react_1.default.createElement(material_1.Box, { mb: 2, mt: 3 }, icon),
                react_1.default.createElement(material_1.Box, { style: {
                        fontWeight: isSelected
                            ? index_1.theme.typography.fontWeightMedium
                            : undefined,
                    } }, name)),
            selectable && (react_1.default.createElement(material_1.Box, { mb: 4 }, isSelected ? (react_1.default.createElement(index_1.DestructiveButton, { className: "remove-button", onClick: onClick },
                react_1.default.createElement(react_fontawesome_1.FontAwesomeIcon, { size: "sm", style: {
                        marginLeft: "-8px",
                        paddingRight: "8px",
                    }, icon: pro_regular_svg_icons_1.faMinus }),
                "Remove")) : (react_1.default.createElement(index_1.SecondaryButton, { className: "add-button", onClick: onClick },
                react_1.default.createElement(react_fontawesome_1.FontAwesomeIcon, { size: "sm", style: {
                        marginLeft: "-8px",
                        paddingRight: "8px",
                    }, icon: pro_regular_svg_icons_1.faPlus }),
                "Add")))),
            children)));
};
exports.ProductOption = ProductOption;
//# sourceMappingURL=ProductOption.js.map