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

Grafana Components Library

{"version":3,"file":"Spinner.mjs","sources":["../../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import { cx, css } from '@emotion/css';\nimport * as React from 'react';\nimport SVG from 'react-inlinesvg';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nimport { useStyles2 } from '../../themes';\nimport { IconSize, isIconSize } from '../../types';\nimport { t } from '../../utils/i18n';\nimport { spin } from '../../utils/keyframes';\nimport { Icon } from '../Icon/Icon';\nimport { getIconRoot, getIconSubDir } from '../Icon/utils';\n\nexport interface Props {\n  className?: string;\n  style?: React.CSSProperties;\n  iconClassName?: string;\n  inline?: boolean;\n  size?: IconSize;\n}\n\n/**\n * @deprecated\n * use a predefined size, e.g. 'md' or 'lg' instead\n */\ninterface PropsWithDeprecatedSize extends Omit<Props, 'size'> {\n  size?: number | string;\n}\n\n/**\n * @public\n */\nexport const Spinner = ({\n  className,\n  inline = false,\n  iconClassName,\n  style,\n  size = 'md',\n}: Props | PropsWithDeprecatedSize) => {\n  const styles = useStyles2(getStyles);\n\n  const deprecatedStyles = useStyles2(getDeprecatedStyles, size);\n  const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n  const iconName = prefersReducedMotion ? 'hourglass' : 'spinner';\n\n  // this entire if statement is handling the deprecated size prop\n  // TODO remove once we fully remove the deprecated type\n  if (typeof size !== 'string' || !isIconSize(size)) {\n    const iconRoot = getIconRoot();\n    const subDir = getIconSubDir(iconName, 'default');\n    const svgPath = `${iconRoot}${subDir}/${iconName}.svg`;\n    return (\n      <div\n        data-testid=\"Spinner\"\n        style={style}\n        className={cx(\n          {\n            [styles.inline]: inline,\n          },\n          deprecatedStyles.wrapper,\n          className\n        )}\n      >\n        <SVG\n          src={svgPath}\n          width={size}\n          height={size}\n          className={cx(styles.spin, deprecatedStyles.icon, className)}\n          style={style}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div\n      data-testid=\"Spinner\"\n      style={style}\n      className={cx(\n        {\n          [styles.inline]: inline,\n        },\n        className\n      )}\n    >\n      <Icon\n        className={cx(styles.spin, iconClassName)}\n        name={iconName}\n        size={size}\n        aria-label={t('grafana-ui.spinner.aria-label', 'Loading')}\n      />\n    </div>\n  );\n};\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  inline: css({\n    display: 'inline-block',\n  }),\n  spin: css({\n    [theme.transitions.handleMotion('no-preference')]: {\n      animation: `${spin} 2s infinite linear`,\n    },\n  }),\n});\n\n// TODO remove once we fully remove the deprecated type\nconst getDeprecatedStyles = (theme: GrafanaTheme2, size: number | string) => ({\n  wrapper: css({\n    fontSize: typeof size === 'string' ? size : `${size}px`,\n  }),\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});\n"],"names":[],"mappings":"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"}