1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
metamask-extension/ui/components/component-library/label/label.js
2023-03-17 10:24:07 -07:00

45 lines
989 B
JavaScript

import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { Text } from '../text';
import {
FONT_WEIGHT,
TextVariant,
DISPLAY,
AlignItems,
} from '../../../helpers/constants/design-system';
export const Label = ({ htmlFor, className, children, ...props }) => (
<Text
className={classnames(
'mm-label',
{ 'mm-label--html-for': htmlFor },
className,
)}
as="label"
htmlFor={htmlFor}
variant={TextVariant.bodyMd}
fontWeight={FONT_WEIGHT.BOLD}
display={DISPLAY.INLINE_FLEX}
alignItems={AlignItems.center}
{...props}
>
{children}
</Text>
);
Label.propTypes = {
/**
* The content of the label
*/
children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
/**
* The id of the input associated with the label
*/
htmlFor: PropTypes.string,
/**
* Additional classNames to be added to the label component
*/
className: PropTypes.string,
};