@navinc/base-react-components
Version:
Nav's Pattern Library
31 lines (30 loc) • 1.79 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const styled_components_1 = __importDefault(require("styled-components"));
const copy_1 = __importDefault(require("./copy"));
const radio_js_1 = __importDefault(require("./radio.js"));
const AsidePill = (0, styled_components_1.default)(copy_1.default) `
background-color: ${({ theme }) => theme.greenSheen200};
padding: 4px 8px;
border-radius: 12px;
display: inline-block;
`;
const Toggles = styled_components_1.default.div `
display: flex;
flex-wrap: wrap;
& > ${radio_js_1.default} {
min-width: 240px;
margin: 8px;
padding: 0 16px;
}
`;
exports.default = ({ asideContent, toggleA, toggleB, toggleCondition, toggleCallback }) => ((0, jsx_runtime_1.jsxs)(Toggles, { children: [(0, jsx_runtime_1.jsx)(radio_js_1.default, { "data-testid": `upgrade-plan-page:${toggleA}-radio-toggle`, checked: !toggleCondition, label: toggleA, onChange: () => {
toggleCallback(!toggleCondition);
}, checkedBackgroundColor: ({ theme }) => theme.neutral100, hasBorder: true }, void 0), (0, jsx_runtime_1.jsx)(radio_js_1.default, { "data-testid": `upgrade-plan-page:${toggleB}-radio-toggle`, checked: toggleCondition, label: toggleB, hasBorder: true, onChange: () => {
toggleCallback(!toggleCondition);
}, checkedBackgroundColor: ({ theme }) => theme.neutral100, asideContent: (0, jsx_runtime_1.jsx)(AsidePill, Object.assign({ size: "xs" }, { children: asideContent }), void 0) }, void 0)] }, void 0));
//# sourceMappingURL=wrapped-ab-content-toggle.js.map