UNPKG

@grafana/ui

Version:
1 lines 1.85 kB
{"version":3,"file":"PercentChange.mjs","sources":["../../../../src/components/BigValue/PercentChange.tsx"],"sourcesContent":["import { IconName } from '@grafana/data';\n\nimport { Icon } from '../Icon/Icon';\n\nimport { PercentChangeStyles } from './BigValueLayout';\n\nexport interface Props {\n percentChange: number;\n styles: PercentChangeStyles;\n}\n\nexport const PercentChange = ({ percentChange, styles }: Props) => {\n let percentChangeIcon: IconName | undefined = undefined;\n if (percentChange > 0) {\n percentChangeIcon = 'arrow-up';\n } else if (percentChange < 0) {\n percentChangeIcon = 'arrow-down';\n }\n\n return (\n <div style={styles.containerStyles}>\n {percentChangeIcon && (\n <Icon name={percentChangeIcon} height={styles.iconSize} width={styles.iconSize} viewBox=\"6 6 12 12\" />\n )}\n {percentChangeString(percentChange)}\n </div>\n );\n};\n\n// percentChange is expected to be a value between 0-100\nexport const percentChangeString = (percentChange: number) => {\n return (percentChange / 100).toLocaleString(undefined, { style: 'percent', maximumSignificantDigits: 3 });\n};\n"],"names":[],"mappings":";;;AAWO,MAAM,aAAgB,GAAA,CAAC,EAAE,aAAA,EAAe,QAAoB,KAAA;AACjE,EAAA,IAAI,iBAA0C,GAAA,KAAA,CAAA;AAC9C,EAAA,IAAI,gBAAgB,CAAG,EAAA;AACrB,IAAoB,iBAAA,GAAA,UAAA;AAAA,GACtB,MAAA,IAAW,gBAAgB,CAAG,EAAA;AAC5B,IAAoB,iBAAA,GAAA,YAAA;AAAA;AAGtB,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA,EAAI,KAAO,EAAA,MAAA,CAAO,eAChB,EAAA,QAAA,EAAA;AAAA,IACC,iBAAA,oBAAA,GAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAM,iBAAmB,EAAA,MAAA,EAAQ,MAAO,CAAA,QAAA,EAAU,KAAO,EAAA,MAAA,CAAO,QAAU,EAAA,OAAA,EAAQ,WAAY,EAAA,CAAA;AAAA,IAErG,oBAAoB,aAAa;AAAA,GACpC,EAAA,CAAA;AAEJ;AAGa,MAAA,mBAAA,GAAsB,CAAC,aAA0B,KAAA;AAC5D,EAAQ,OAAA,CAAA,aAAA,GAAgB,KAAK,cAAe,CAAA,KAAA,CAAA,EAAW,EAAE,KAAO,EAAA,SAAA,EAAW,wBAA0B,EAAA,CAAA,EAAG,CAAA;AAC1G;;;;"}