@grafana/ui/dist/esm/components/Forms/FieldValidationMessage.mjs.map

Grafana Components Library

{"version":3,"file":"FieldValidationMessage.mjs","sources":["../../../../src/components/Forms/FieldValidationMessage.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport * as React from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { Icon } from '../Icon/Icon';\n\nexport interface FieldValidationMessageProps {\n  /** Override component style */\n  className?: string;\n  horizontal?: boolean;\n}\n\nexport const FieldValidationMessage = ({\n  children,\n  horizontal,\n  className,\n}: React.PropsWithChildren<FieldValidationMessageProps>) => {\n  const styles = useStyles2(getFieldValidationMessageStyles);\n  const cssName = cx(horizontal ? styles.horizontal : styles.vertical, className);\n\n  return (\n    <div role=\"alert\" className={cssName}>\n      <Icon className={styles.fieldValidationMessageIcon} name=\"exclamation-triangle\" />\n      {children}\n    </div>\n  );\n};\n\nexport const getFieldValidationMessageStyles = (theme: GrafanaTheme2) => {\n  const baseStyle = `\n      font-size: ${theme.typography.size.sm};\n      font-weight: ${theme.typography.fontWeightMedium};\n      padding: ${theme.spacing(0.5, 1)};\n      color: ${theme.colors.error.contrastText};\n      background: ${theme.colors.error.main};\n      border-radius: ${theme.shape.radius.default};\n      position: relative;\n      display: inline-block;\n      align-self: flex-start;\n\n      a {\n        color: ${theme.colors.error.contrastText};\n        text-decoration: underline;\n      }\n\n      a:hover {\n        text-decoration: none;\n      }\n    `;\n\n  return {\n    vertical: css(baseStyle, {\n      margin: theme.spacing(0.5, 0, 0, 0),\n\n      '&:before': {\n        content: '\"\"',\n        position: 'absolute',\n        left: '9px',\n        top: '-5px',\n        width: 0,\n        height: 0,\n        borderWidth: '0 4px 5px 4px',\n        borderColor: `transparent transparent ${theme.colors.error.main} transparent`,\n        borderStyle: 'solid',\n      },\n    }),\n    horizontal: css(baseStyle, {\n      marginLeft: '10px',\n\n      '&:before': {\n        content: '\"\"',\n        position: 'absolute',\n        left: '-5px',\n        top: '9px',\n        width: 0,\n        height: 0,\n        borderWidth: '4px 5px 4px 0',\n        borderColor: 'transparent #e02f44 transparent transparent',\n        borderStyle: 'solid',\n      },\n    }),\n    fieldValidationMessageIcon: css({\n      marginRight: theme.spacing(),\n    }),\n  };\n};\n"],"names":[],"mappings":";;;;;;AAcO,MAAM,yBAAyB,CAAC;AAAA,EACrC,QAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF,CAAA,KAA4D;AAC1D,EAAA,MAAM,MAAA,GAAS,WAAW,+BAA+B,CAAA;AACzD,EAAA,MAAM,UAAU,EAAA,CAAG,UAAA,GAAa,OAAO,UAAA,GAAa,MAAA,CAAO,UAAU,SAAS,CAAA;AAE9E,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,IAAA,EAAK,OAAA,EAAQ,WAAW,OAAA,EAC3B,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,0BAAA,EAA4B,MAAK,sBAAA,EAAuB,CAAA;AAAA,IAC/E;AAAA,GAAA,EACH,CAAA;AAEJ;AAEO,MAAM,+BAAA,GAAkC,CAAC,KAAA,KAAyB;AACvE,EAAA,MAAM,SAAA,GAAY;AAAA,iBAAA,EACD,KAAA,CAAM,UAAA,CAAW,IAAA,CAAK,EAAE,CAAA;AAAA,mBAAA,EACtB,KAAA,CAAM,WAAW,gBAAgB,CAAA;AAAA,eAAA,EACrC,KAAA,CAAM,OAAA,CAAQ,GAAA,EAAK,CAAC,CAAC,CAAA;AAAA,aAAA,EACvB,KAAA,CAAM,MAAA,CAAO,KAAA,CAAM,YAAY,CAAA;AAAA,kBAAA,EAC1B,KAAA,CAAM,MAAA,CAAO,KAAA,CAAM,IAAI,CAAA;AAAA,qBAAA,EACpB,KAAA,CAAM,KAAA,CAAM,MAAA,CAAO,OAAO,CAAA;AAAA;AAAA;AAAA;;AAAA;AAAA,eAAA,EAMhC,KAAA,CAAM,MAAA,CAAO,KAAA,CAAM,YAAY,CAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA,IAAA,CAAA;AAS9C,EAAA,OAAO;AAAA,IACL,QAAA,EAAU,IAAI,SAAA,EAAW;AAAA,MACvB,QAAQ,KAAA,CAAM,OAAA,CAAQ,GAAA,EAAK,CAAA,EAAG,GAAG,CAAC,CAAA;AAAA,MAElC,UAAA,EAAY;AAAA,QACV,OAAA,EAAS,IAAA;AAAA,QACT,QAAA,EAAU,UAAA;AAAA,QACV,IAAA,EAAM,KAAA;AAAA,QACN,GAAA,EAAK,MAAA;AAAA,QACL,KAAA,EAAO,CAAA;AAAA,QACP,MAAA,EAAQ,CAAA;AAAA,QACR,WAAA,EAAa,eAAA;AAAA,QACb,WAAA,EAAa,CAAA,wBAAA,EAA2B,KAAA,CAAM,MAAA,CAAO,MAAM,IAAI,CAAA,YAAA,CAAA;AAAA,QAC/D,WAAA,EAAa;AAAA;AACf,KACD,CAAA;AAAA,IACD,UAAA,EAAY,IAAI,SAAA,EAAW;AAAA,MACzB,UAAA,EAAY,MAAA;AAAA,MAEZ,UAAA,EAAY;AAAA,QACV,OAAA,EAAS,IAAA;AAAA,QACT,QAAA,EAAU,UAAA;AAAA,QACV,IAAA,EAAM,MAAA;AAAA,QACN,GAAA,EAAK,KAAA;AAAA,QACL,KAAA,EAAO,CAAA;AAAA,QACP,MAAA,EAAQ,CAAA;AAAA,QACR,WAAA,EAAa,eAAA;AAAA,QACb,WAAA,EAAa,6CAAA;AAAA,QACb,WAAA,EAAa;AAAA;AACf,KACD,CAAA;AAAA,IACD,4BAA4B,GAAA,CAAI;AAAA,MAC9B,WAAA,EAAa,MAAM,OAAA;AAAQ,KAC5B;AAAA,GACH;AACF;;;;"}