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

Opinionated design system for Drivy's projects.

import { jsx, jsxs } from 'react/jsx-runtime';
import cx from 'classnames';
import { withFieldLabelAndHint } from './field.js';
import { Hint } from './Hint.js';

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

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