diff --git a/react/Text/Readme.md b/react/Text/Readme.md index 0fa6bc85c6..ed05309d5a 100644 --- a/react/Text/Readme.md +++ b/react/Text/Readme.md @@ -53,3 +53,11 @@ import { Caption } from 'cozy-ui/transpiled/react/Text'; This a caption text ``` + +#### ErrorMessage text + +``` +import { ErrorMessage } from 'cozy-ui/transpiled/react/Text'; + +This an error message text +``` diff --git a/react/Text/index.jsx b/react/Text/index.jsx index 17ba90dfa6..ec5ecf5bce 100644 --- a/react/Text/index.jsx +++ b/react/Text/index.jsx @@ -1,6 +1,7 @@ import React from 'react' import cx from 'classnames' import PropTypes from 'prop-types' +import styles from './styles.styl' export const BaseText = props => { const { className, children, tag, ellipsis, ...restProps } = props @@ -42,6 +43,10 @@ export const Caption = ({ className, ...restProps }) => ( ) +export const ErrorMessage = ({ className, ...restProps }) => ( + +) + // Props const commonProps = { children: PropTypes.node, @@ -71,6 +76,9 @@ Caption.propTypes = { Uppercase.propTypes = { ...commonProps } +ErrorMessage.propTypes = { + ...commonProps +} // Default Props const commonDefaultProps = { @@ -101,4 +109,8 @@ Uppercase.defaultProps = { ...commonDefaultProps } +ErrorMessage.defaultProps = { + ...commonDefaultProps +} + export default Text diff --git a/react/Text/styles.styl b/react/Text/styles.styl new file mode 100644 index 0000000000..3cce6421ad --- /dev/null +++ b/react/Text/styles.styl @@ -0,0 +1,2 @@ +.ErrorMessage + color var(--pomegranate) diff --git a/react/__snapshots__/examples.spec.jsx.snap b/react/__snapshots__/examples.spec.jsx.snap index 19ec0b6006..9d6f5f156a 100644 --- a/react/__snapshots__/examples.spec.jsx.snap +++ b/react/__snapshots__/examples.spec.jsx.snap @@ -5870,6 +5870,12 @@ exports[`Text should render examples: Text 7`] = ` " `; +exports[`Text should render examples: Text 8`] = ` +"
+
This an error message text
+
" +`; + exports[`Textarea should render examples: Textarea 1`] = `"
"`; exports[`Textarea should render examples: Textarea 2`] = `"
"`;