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

Grafana Components Library

{"version":3,"file":"Icon.mjs","sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport * as React from 'react';\nimport SVG from 'react-inlinesvg';\n\nimport { GrafanaTheme2, isIconName } from '@grafana/data';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { IconName, IconType, IconSize } from '../../types/icon';\nimport { spin } from '../../utils/keyframes';\n\nimport { getIconPath, getSvgSize } from './utils';\n\nexport interface IconProps extends Omit<React.SVGProps<SVGElement>, 'onLoad' | 'onError' | 'ref'> {\n  name: IconName;\n  size?: IconSize;\n  type?: IconType;\n  /**\n   * Give your icon a semantic meaning. The icon will be hidden from screen readers, unless this prop or an aria-label is provided.\n   */\n  title?: string;\n}\n\nconst getIconStyles = (theme: GrafanaTheme2) => {\n  return {\n    icon: css({\n      display: 'inline-block',\n      fill: 'currentColor',\n      flexShrink: 0,\n      label: 'Icon',\n      // line-height: 0; is needed for correct icon alignment in Safari\n      lineHeight: 0,\n      verticalAlign: 'middle',\n    }),\n    orange: css({\n      fill: theme.v1.palette.orange,\n    }),\n    spin: css({\n      [theme.transitions.handleMotion('no-preference', 'reduce')]: {\n        animation: `${spin} 2s infinite linear`,\n      },\n    }),\n  };\n};\n\nexport const Icon = React.memo(\n  React.forwardRef<SVGElement, IconProps>(\n    ({ size = 'md', type = 'default', name, className, style, title = '', ...rest }, ref) => {\n      const styles = useStyles2(getIconStyles);\n\n      if (!isIconName(name)) {\n        console.warn('Icon component passed an invalid icon name', name);\n      }\n\n      // handle the deprecated 'fa fa-spinner'\n      const iconName: IconName = name === 'fa fa-spinner' ? 'spinner' : name;\n\n      const svgSize = getSvgSize(size);\n      const svgHgt = svgSize;\n      const svgWid = name.startsWith('gf-bar-align') ? 16 : name.startsWith('gf-interp') ? 30 : svgSize;\n      const svgPath = getIconPath(iconName, type);\n\n      const composedClassName = cx(\n        styles.icon,\n        className,\n        type === 'mono' ? { [styles.orange]: name === 'favorite' } : '',\n        {\n          [styles.spin]: iconName === 'spinner',\n        }\n      );\n\n      return (\n        <SVG\n          aria-hidden={\n            rest.tabIndex === undefined &&\n            !title &&\n            !rest['aria-label'] &&\n            !rest['aria-labelledby'] &&\n            !rest['aria-describedby']\n          }\n          innerRef={ref}\n          src={svgPath}\n          width={svgWid}\n          height={svgHgt}\n          title={title}\n          className={composedClassName}\n          style={style}\n          // render an empty element with the correct dimensions while loading\n          // this prevents content layout shift whilst the icon asynchronously loads\n          // which happens even if the icon is in the cache(!)\n          loader={\n            <span\n              className={cx(\n                css({\n                  width: svgWid,\n                  height: svgHgt,\n                }),\n                composedClassName\n              )}\n            />\n          }\n          {...rest}\n        />\n      );\n    }\n  )\n);\n\nIcon.displayName = 'Icon';\n"],"names":[],"mappings":"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"}