selection.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. exports.default = void 0;
  6. var _cssinjs = require("@ant-design/cssinjs");
  7. const genSelectionStyle = token => {
  8. const {
  9. componentCls,
  10. antCls,
  11. iconCls,
  12. fontSizeIcon,
  13. padding,
  14. paddingXS,
  15. headerIconColor,
  16. headerIconHoverColor,
  17. tableSelectionColumnWidth,
  18. tableSelectedRowBg,
  19. tableSelectedRowHoverBg,
  20. tableRowHoverBg,
  21. tablePaddingHorizontal,
  22. calc
  23. } = token;
  24. return {
  25. [`${componentCls}-wrapper`]: {
  26. // ========================== Selections ==========================
  27. [`${componentCls}-selection-col`]: {
  28. width: tableSelectionColumnWidth,
  29. [`&${componentCls}-selection-col-with-dropdown`]: {
  30. width: calc(tableSelectionColumnWidth).add(fontSizeIcon).add(calc(padding).div(4)).equal()
  31. }
  32. },
  33. [`${componentCls}-bordered ${componentCls}-selection-col`]: {
  34. width: calc(tableSelectionColumnWidth).add(calc(paddingXS).mul(2)).equal(),
  35. [`&${componentCls}-selection-col-with-dropdown`]: {
  36. width: calc(tableSelectionColumnWidth).add(fontSizeIcon).add(calc(padding).div(4)).add(calc(paddingXS).mul(2)).equal()
  37. }
  38. },
  39. [`
  40. table tr th${componentCls}-selection-column,
  41. table tr td${componentCls}-selection-column,
  42. ${componentCls}-selection-column
  43. `]: {
  44. paddingInlineEnd: token.paddingXS,
  45. paddingInlineStart: token.paddingXS,
  46. textAlign: 'center',
  47. [`${antCls}-radio-wrapper`]: {
  48. marginInlineEnd: 0
  49. }
  50. },
  51. [`table tr th${componentCls}-selection-column${componentCls}-cell-fix-left`]: {
  52. zIndex: calc(token.zIndexTableFixed).add(1).equal({
  53. unit: false
  54. })
  55. },
  56. [`table tr th${componentCls}-selection-column::after`]: {
  57. backgroundColor: 'transparent !important'
  58. },
  59. [`${componentCls}-selection`]: {
  60. position: 'relative',
  61. display: 'inline-flex',
  62. flexDirection: 'column'
  63. },
  64. [`${componentCls}-selection-extra`]: {
  65. position: 'absolute',
  66. top: 0,
  67. zIndex: 1,
  68. cursor: 'pointer',
  69. transition: `all ${token.motionDurationSlow}`,
  70. marginInlineStart: '100%',
  71. paddingInlineStart: (0, _cssinjs.unit)(calc(tablePaddingHorizontal).div(4).equal()),
  72. [iconCls]: {
  73. color: headerIconColor,
  74. fontSize: fontSizeIcon,
  75. verticalAlign: 'baseline',
  76. '&:hover': {
  77. color: headerIconHoverColor
  78. }
  79. }
  80. },
  81. // ============================= Rows =============================
  82. [`${componentCls}-tbody`]: {
  83. [`${componentCls}-row`]: {
  84. [`&${componentCls}-row-selected`]: {
  85. [`> ${componentCls}-cell`]: {
  86. background: tableSelectedRowBg,
  87. '&-row-hover': {
  88. background: tableSelectedRowHoverBg
  89. }
  90. }
  91. },
  92. [`> ${componentCls}-cell-row-hover`]: {
  93. background: tableRowHoverBg
  94. }
  95. }
  96. }
  97. }
  98. };
  99. };
  100. var _default = exports.default = genSelectionStyle;