index.js 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import { genComponentStyleHook, mergeToken } from '../../theme/internal';
  3. import { resetComponent } from '../../style';
  4. const genStatisticStyle = token => {
  5. const {
  6. componentCls,
  7. marginXXS,
  8. padding,
  9. colorTextDescription,
  10. statisticTitleFontSize,
  11. colorTextHeading,
  12. statisticContentFontSize,
  13. statisticFontFamily
  14. } = token;
  15. return {
  16. [`${componentCls}`]: _extends(_extends({}, resetComponent(token)), {
  17. [`${componentCls}-title`]: {
  18. marginBottom: marginXXS,
  19. color: colorTextDescription,
  20. fontSize: statisticTitleFontSize
  21. },
  22. [`${componentCls}-skeleton`]: {
  23. paddingTop: padding
  24. },
  25. [`${componentCls}-content`]: {
  26. color: colorTextHeading,
  27. fontSize: statisticContentFontSize,
  28. fontFamily: statisticFontFamily,
  29. [`${componentCls}-content-value`]: {
  30. display: 'inline-block',
  31. direction: 'ltr'
  32. },
  33. [`${componentCls}-content-prefix, ${componentCls}-content-suffix`]: {
  34. display: 'inline-block'
  35. },
  36. [`${componentCls}-content-prefix`]: {
  37. marginInlineEnd: marginXXS
  38. },
  39. [`${componentCls}-content-suffix`]: {
  40. marginInlineStart: marginXXS
  41. }
  42. }
  43. })
  44. };
  45. };
  46. // ============================== Export ==============================
  47. export default genComponentStyleHook('Statistic', token => {
  48. const {
  49. fontSizeHeading3,
  50. fontSize,
  51. fontFamily
  52. } = token;
  53. const statisticToken = mergeToken(token, {
  54. statisticTitleFontSize: fontSize,
  55. statisticContentFontSize: fontSizeHeading3,
  56. statisticFontFamily: fontFamily
  57. });
  58. return [genStatisticStyle(statisticToken)];
  59. });