@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,CAA4D,KAAA;AAC1D,EAAM,MAAA,MAAA,GAAS,WAAW,+BAA+B,CAAA;AACzD,EAAA,MAAM,UAAU,EAAG,CAAA,UAAA,GAAa,OAAO,UAAa,GAAA,MAAA,CAAO,UAAU,SAAS,CAAA;AAE9E,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA,EAAI,IAAK,EAAA,OAAA,EAAQ,WAAW,OAC3B,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,IAAK,EAAA,EAAA,SAAA,EAAW,MAAO,CAAA,0BAAA,EAA4B,MAAK,sBAAuB,EAAA,CAAA;AAAA,IAC/E;AAAA,GACH,EAAA,CAAA;AAEJ;AAEa,MAAA,+BAAA,GAAkC,CAAC,KAAyB,KAAA;AACvE,EAAA,MAAM,SAAY,GAAA;AAAA,iBACD,EAAA,KAAA,CAAM,UAAW,CAAA,IAAA,CAAK,EAAE,CAAA;AAAA,mBACtB,EAAA,KAAA,CAAM,WAAW,gBAAgB,CAAA;AAAA,eAAA,EACrC,KAAM,CAAA,OAAA,CAAQ,GAAK,EAAA,CAAC,CAAC,CAAA;AAAA,aACvB,EAAA,KAAA,CAAM,MAAO,CAAA,KAAA,CAAM,YAAY,CAAA;AAAA,kBAC1B,EAAA,KAAA,CAAM,MAAO,CAAA,KAAA,CAAM,IAAI,CAAA;AAAA,qBACpB,EAAA,KAAA,CAAM,KAAM,CAAA,MAAA,CAAO,OAAO,CAAA;AAAA;AAAA;AAAA;;AAAA;AAAA,eAMhC,EAAA,KAAA,CAAM,MAAO,CAAA,KAAA,CAAM,YAAY,CAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA,IAAA,CAAA;AAS9C,EAAO,OAAA;AAAA,IACL,QAAA,EAAU,IAAI,SAAW,EAAA;AAAA,MACvB,QAAQ,KAAM,CAAA,OAAA,CAAQ,GAAK,EAAA,CAAA,EAAG,GAAG,CAAC,CAAA;AAAA,MAElC,UAAY,EAAA;AAAA,QACV,OAAS,EAAA,IAAA;AAAA,QACT,QAAU,EAAA,UAAA;AAAA,QACV,IAAM,EAAA,KAAA;AAAA,QACN,GAAK,EAAA,MAAA;AAAA,QACL,KAAO,EAAA,CAAA;AAAA,QACP,MAAQ,EAAA,CAAA;AAAA,QACR,WAAa,EAAA,eAAA;AAAA,QACb,WAAa,EAAA,CAAA,wBAAA,EAA2B,KAAM,CAAA,MAAA,CAAO,MAAM,IAAI,CAAA,YAAA,CAAA;AAAA,QAC/D,WAAa,EAAA;AAAA;AACf,KACD,CAAA;AAAA,IACD,UAAA,EAAY,IAAI,SAAW,EAAA;AAAA,MACzB,UAAY,EAAA,MAAA;AAAA,MAEZ,UAAY,EAAA;AAAA,QACV,OAAS,EAAA,IAAA;AAAA,QACT,QAAU,EAAA,UAAA;AAAA,QACV,IAAM,EAAA,MAAA;AAAA,QACN,GAAK,EAAA,KAAA;AAAA,QACL,KAAO,EAAA,CAAA;AAAA,QACP,MAAQ,EAAA,CAAA;AAAA,QACR,WAAa,EAAA,eAAA;AAAA,QACb,WAAa,EAAA,6CAAA;AAAA,QACb,WAAa,EAAA;AAAA;AACf,KACD,CAAA;AAAA,IACD,4BAA4B,GAAI,CAAA;AAAA,MAC9B,WAAA,EAAa,MAAM,OAAQ;AAAA,KAC5B;AAAA,GACH;AACF;;;;"}