@grafana/ui
Version:
Grafana Components Library
1 lines • 1.71 kB
Source Map (JSON)
{"version":3,"file":"LoadingPlaceholder.mjs","sources":["../../../../src/components/LoadingPlaceholder/LoadingPlaceholder.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { HTMLAttributes } from 'react';\nimport * as React from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { Spinner } from '../Spinner/Spinner';\n\n/**\n * @public\n */\nexport interface LoadingPlaceholderProps extends HTMLAttributes<HTMLDivElement> {\n text: React.ReactNode;\n}\n\n/**\n * Loading indicator with a text. 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-loadingplaceholder--docs\n * @public\n */\nexport const LoadingPlaceholder = ({ text, className, ...rest }: LoadingPlaceholderProps) => {\n const styles = useStyles2(getStyles);\n return (\n <div className={cx(styles.container, className)} {...rest}>\n {text} <Spinner inline={true} />\n </div>\n );\n};\n\nconst getStyles = (theme: GrafanaTheme2) => {\n return {\n container: css({\n marginBottom: theme.spacing(4),\n }),\n };\n};\n"],"names":[],"mappings":";;;;;;AAsBO,MAAM,qBAAqB,CAAC,EAAE,MAAM,SAAA,EAAW,GAAG,MAAK,KAA+B;AAC3F,EAAA,MAAM,MAAA,GAAS,WAAW,SAAS,CAAA;AACnC,EAAA,uBACE,IAAA,CAAC,SAAI,SAAA,EAAW,EAAA,CAAG,OAAO,SAAA,EAAW,SAAS,CAAA,EAAI,GAAG,IAAA,EAClD,QAAA,EAAA;AAAA,IAAA,IAAA;AAAA,IAAK,GAAA;AAAA,oBAAC,GAAA,CAAC,OAAA,EAAA,EAAQ,MAAA,EAAQ,IAAA,EAAM;AAAA,GAAA,EAChC,CAAA;AAEJ;AAEA,MAAM,SAAA,GAAY,CAAC,KAAA,KAAyB;AAC1C,EAAA,OAAO;AAAA,IACL,WAAW,GAAA,CAAI;AAAA,MACb,YAAA,EAAc,KAAA,CAAM,OAAA,CAAQ,CAAC;AAAA,KAC9B;AAAA,GACH;AACF,CAAA;;;;"}