UNPKG

@patreon/studio

Version:

Patreon Studio Design System

19 lines 826 B
import React from 'react'; import styled from 'styled-components'; import { tokens } from '../../tokens'; import { BodyText } from '../BodyText'; import { IconNo } from '../Icon'; const getErrorId = (inputId) => `${inputId}-error`; export const InlineError = ({ children, 'data-tag': dataTag, inputId, size = 'sm' }) => (<ErrorContainer data-tag={dataTag} id={getErrorId(inputId)}> <IconNo size={size === 'sm' ? '16px' : '12px'} color={tokens.global.critical.action.default}/> <BodyText as="span" size={size === 'sm' ? 'md' : 'sm'} color={tokens.global.critical.action.default}> {children} </BodyText> </ErrorContainer>); InlineError.getErrorId = getErrorId; const ErrorContainer = styled.div ` display: flex; align-items: center; gap: ${tokens.global.space.x8}; `; //# sourceMappingURL=index.jsx.map