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

Opinionated design system for Drivy's projects.

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

const ToggleSwitch = ({ large, status, label, position, hint, ...inputProps }) => {
    return (React.createElement("div", { className: cx("cobalt-ToggleSwitchField", {
            "cobalt-ToggleSwitchField--large": large,
            "cobalt-ToggleSwitchField--position-left": position === "left",
            "cobalt-ToggleSwitchField--error": status === "error",
            "cobalt-ToggleSwitchField--standalone": !label,
        }) },
        React.createElement("label", { className: "cobalt-ToggleSwitchField__LabelWrapper" },
            React.createElement("input", { ...inputProps, type: "checkbox", className: "cobalt-ToggleSwitchField__Input" }),
            React.createElement("span", { className: "cobalt-ToggleSwitchField__ToggleSwitch" },
                React.createElement("span", { className: "cobalt-ToggleSwitchField__ToggleSwitchSlider" })),
            label && (React.createElement("span", { className: "cobalt-ToggleSwitchField__Label" }, label))),
        hint && (React.createElement(Hint, { status: status },
            React.createElement("span", { dangerouslySetInnerHTML: { __html: hint } })))));
};

export { ToggleSwitch };
//# sourceMappingURL=ToggleSwitch.js.map