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

Opinionated design system for Drivy's projects.

import { jsx, jsxs } from "react/jsx-runtime";
import classnames from "classnames";
import react from "react";
const InputWithDetails = ({ type, icon, illustrationUrl, title, description, className, ...inputProps })=>{
    const prefix = `cobalt-${type}-with-details`;
    return /*#__PURE__*/ jsxs("label", {
        className: classnames(prefix, !description && `${prefix}--noDescription`, className),
        children: [
            /*#__PURE__*/ jsx("input", {
                ...inputProps,
                type: type,
                className: `${prefix}__input`
            }),
            /*#__PURE__*/ jsxs("div", {
                className: `${prefix}__inner`,
                children: [
                    illustrationUrl ? /*#__PURE__*/ jsx("img", {
                        alt: title,
                        className: `${prefix}__illustration`,
                        src: illustrationUrl
                    }) : icon && /*#__PURE__*/ react.cloneElement(icon, {
                        className: `${prefix}__icon`
                    }),
                    /*#__PURE__*/ jsxs("div", {
                        className: `${prefix}__content`,
                        children: [
                            /*#__PURE__*/ jsx("div", {
                                className: `${prefix}__title`,
                                children: title
                            }),
                            description && /*#__PURE__*/ jsx("div", {
                                className: `${prefix}__description`,
                                children: description
                            })
                        ]
                    }),
                    /*#__PURE__*/ jsx("div", {
                        className: `${prefix}__visual-input`
                    })
                ]
            })
        ]
    });
};
const Form_InputWithDetails = InputWithDetails;
export default Form_InputWithDetails;

//# sourceMappingURL=InputWithDetails.js.map