@drivy/cobalt/components/Form/Checkmark.js

Opinionated design system for Drivy's projects.

import React from 'react';
import cx from 'classnames';
import { Hint } from './Hint.js';
import { withFieldLabelAndHint } from './field.js';

const Checkmark = ({ label, status, hint, ...inputProps }) => {
    return (React.createElement("div", { className: cx("cobalt-CheckmarkField", {
            "cobalt-CheckmarkField--success": status === "success",
            "cobalt-CheckmarkField--error": status === "error",
        }) },
        React.createElement("label", { className: "cobalt-CheckmarkField__LabelWrapper" },
            React.createElement("input", { ...inputProps, className: "cobalt-CheckmarkField__Input" }),
            React.createElement("span", { className: "cobalt-CheckmarkField__Checkmark" }),
            React.createElement("span", { className: "cobalt-CheckmarkField__Label" }, label)),
        hint && (React.createElement(Hint, { status: status },
            React.createElement("span", { dangerouslySetInnerHTML: { __html: hint } })))));
};
const Checkbox = ({ label, ...props }) => {
    return React.createElement(Checkmark, { ...props, label: label, type: "checkbox" });
};
Checkbox.displayName = "CobaltCheckbox";
const Radio = ({ label, ...props }) => {
    return React.createElement(Checkmark, { ...props, label: label, type: "radio" });
};
Radio.displayName = "CobaltRadio";
const ChoiceList = ({ children }) => {
    return (React.createElement("div", { className: "cobalt-ChoiceList" }, typeof children === "function" ? children() : children));
};
const wrappedChoiceList = withFieldLabelAndHint(ChoiceList);
wrappedChoiceList.displayName = "ChoiceList";

export { Checkbox, wrappedChoiceList as ChoiceList, Radio };
//# sourceMappingURL=Checkmark.js.map