{"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';\nimport { t } from '@grafana/i18n';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { IconSize, isIconSize } from '../../types/icon';\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 *\n * Spinner is `fa-spinner` icon animated. It is used to alert a user to wait for an activity to complete.\n *\n * https://developers.grafana.com/ui/latest/index.html?path=/docs/information-spinner--docs\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    lineHeight: 0,\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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"}