@grafana/ui/dist/esm/components/InfoBox/InfoBox.mjs.map

Grafana Components Library

{"version":3,"file":"InfoBox.mjs","sources":["../../../../src/components/InfoBox/InfoBox.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 { Alert, AlertVariant } from '../Alert/Alert';\nimport { Icon } from '../Icon/Icon';\n\nexport interface InfoBoxProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {\n  children: React.ReactNode;\n  /** Title of the box */\n  title?: string | JSX.Element;\n  /** Url of the read more link */\n  url?: string;\n  /** Text of the read more link */\n  urlTitle?: string;\n  /** Indicates whether or not box should be rendered with Grafana branding background */\n  branded?: boolean;\n  /** Color variant of the box */\n  severity?: AlertVariant;\n  /** Call back to be performed when box is dismissed */\n  onDismiss?: () => void;\n}\n\n/**\n * @deprecated use Alert with severity info.\n *\n * https://developers.grafana.com/ui/latest/index.html?path=/docs/information-deprecated-infobox--docs\n * */\nexport const InfoBox = React.memo(\n  React.forwardRef<HTMLDivElement, InfoBoxProps>(\n    ({ title, className, children, branded, url, urlTitle, onDismiss, severity = 'info', ...otherProps }, ref) => {\n      const styles = useStyles2(getStyles);\n\n      return (\n        // component is deprecated so no point fixing this\n        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n        <Alert severity={severity} className={className} {...otherProps} ref={ref} title={title as string}>\n          <div>{children}</div>\n          {url && (\n            <a href={url} className={cx('external-link', styles.docsLink)} target=\"_blank\" rel=\"noreferrer\">\n              <Icon name=\"book\" /> {urlTitle || 'Read more'}\n            </a>\n          )}\n        </Alert>\n      );\n    }\n  )\n);\n\nInfoBox.displayName = 'InfoBox';\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  docsLink: css({\n    display: 'inline-block',\n    marginTop: theme.spacing(2),\n  }),\n});\n"],"names":[],"mappings":";;;;;;;;AA8BO,MAAM,UAAU,KAAA,CAAM,IAAA;AAAA,EAC3B,KAAA,CAAM,UAAA;AAAA,IACJ,CAAC,EAAE,KAAA,EAAO,SAAA,EAAW,UAAU,OAAA,EAAS,GAAA,EAAK,QAAA,EAAU,SAAA,EAAW,QAAA,GAAW,MAAA,EAAQ,GAAG,UAAA,IAAc,GAAA,KAAQ;AAC5G,MAAA,MAAM,MAAA,GAAS,WAAW,SAAS,CAAA;AAEnC,MAAA;AAAA;AAAA;AAAA,6BAGG,KAAA,EAAA,EAAM,QAAA,EAAoB,WAAuB,GAAG,UAAA,EAAY,KAAU,KAAA,EACzE,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,SAAK,QAAA,EAAS,CAAA;AAAA,UACd,GAAA,oBACC,IAAA,CAAC,GAAA,EAAA,EAAE,IAAA,EAAM,KAAK,SAAA,EAAW,EAAA,CAAG,eAAA,EAAiB,MAAA,CAAO,QAAQ,CAAA,EAAG,MAAA,EAAO,QAAA,EAAS,KAAI,YAAA,EACjF,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,MAAK,MAAA,EAAO,CAAA;AAAA,YAAE,GAAA;AAAA,YAAE,QAAA,IAAY;AAAA,WAAA,EACpC;AAAA,SAAA,EAEJ;AAAA;AAAA,IAEJ;AAAA;AAEJ;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA;AAEtB,MAAM,SAAA,GAAY,CAAC,KAAA,MAA0B;AAAA,EAC3C,UAAU,GAAA,CAAI;AAAA,IACZ,OAAA,EAAS,cAAA;AAAA,IACT,SAAA,EAAW,KAAA,CAAM,OAAA,CAAQ,CAAC;AAAA,GAC3B;AACH,CAAA,CAAA;;;;"}