vcc-ui
Version:
A React library for building user interfaces at Volvo Cars
69 lines (68 loc) • 2.09 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import { bool, func, node, string } from 'prop-types';
import React, { forwardRef } from 'react';
import { useId } from '../../utils/auto-id';
import { Block } from '../block';
import { Message } from '../message';
import { View } from '../view';
import { checkboxStyle, labelStyle } from './checkbox.style';
const CheckBoxMessages = _ref => {
let {
errorMessage,
description
} = _ref;
return /*#__PURE__*/React.createElement(React.Fragment, null, errorMessage ? /*#__PURE__*/React.createElement(Message, {
type: "error"
}, errorMessage) : null, description ? /*#__PURE__*/React.createElement(Message, null, description) : null);
};
/**
* @deprecated Use `import { Checkbox } from '@volvo-cars/react-forms'` instead. See [Checkbox](https://developer.volvocars.com/design-system/web/?path=/docs/components-forms-checkbox--docs)
*/
export const Checkbox = /*#__PURE__*/forwardRef((_ref2, ref) => {
let {
isValid = true,
label,
errorMessage,
description,
...props
} = _ref2;
const styleProps = {
isValid
};
const id = useId('vcc-ui-checkbox', props.id);
return /*#__PURE__*/React.createElement(View, {
spacing: 1,
shrink: 1,
direction: "row"
}, /*#__PURE__*/React.createElement(Block, _extends({}, props, {
ref: ref,
id: id,
as: "input",
type: "checkbox",
extend: [checkboxStyle(styleProps)]
})), /*#__PURE__*/React.createElement(View, {
spacing: description || errorMessage ? 0.5 : 0,
direction: "column",
wrap: "wrap",
shrink: 1
}, /*#__PURE__*/React.createElement(Block, {
as: "label",
htmlFor: id,
extend: labelStyle(styleProps)
}, label), /*#__PURE__*/React.createElement(CheckBoxMessages, {
description: description,
errorMessage: errorMessage
})));
});
Checkbox.displayName = 'Checkbox';
Checkbox.propTypes = {
onChange: func.isRequired,
checked: bool,
isValid: bool,
id: string,
name: string,
// @ts-ignore
label: node.isRequired,
description: string,
errorMessage: string
};