compact-item.js 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. exports.genCompactItemStyle = genCompactItemStyle;
  6. // handle border collapse
  7. function compactItemBorder(token, parentCls, options, prefixCls) {
  8. const {
  9. focusElCls,
  10. focus,
  11. borderElCls
  12. } = options;
  13. const childCombinator = borderElCls ? '> *' : '';
  14. const hoverEffects = ['hover', focus ? 'focus' : null, 'active'].filter(Boolean).map(n => `&:${n} ${childCombinator}`).join(',');
  15. return {
  16. [`&-item:not(${parentCls}-last-item)`]: {
  17. marginInlineEnd: token.calc(token.lineWidth).mul(-1).equal()
  18. },
  19. [`&-item:not(${prefixCls}-status-success)`]: {
  20. zIndex: 2
  21. },
  22. '&-item': Object.assign(Object.assign({
  23. [hoverEffects]: {
  24. zIndex: 3
  25. }
  26. }, focusElCls ? {
  27. [`&${focusElCls}`]: {
  28. zIndex: 3
  29. }
  30. } : {}), {
  31. [`&[disabled] ${childCombinator}`]: {
  32. zIndex: 0
  33. }
  34. })
  35. };
  36. }
  37. // handle border-radius
  38. function compactItemBorderRadius(prefixCls, parentCls, options) {
  39. const {
  40. borderElCls
  41. } = options;
  42. const childCombinator = borderElCls ? `> ${borderElCls}` : '';
  43. return {
  44. [`&-item:not(${parentCls}-first-item):not(${parentCls}-last-item) ${childCombinator}`]: {
  45. borderRadius: 0
  46. },
  47. [`&-item:not(${parentCls}-last-item)${parentCls}-first-item`]: {
  48. [`& ${childCombinator}, &${prefixCls}-sm ${childCombinator}, &${prefixCls}-lg ${childCombinator}`]: {
  49. borderStartEndRadius: 0,
  50. borderEndEndRadius: 0
  51. }
  52. },
  53. [`&-item:not(${parentCls}-first-item)${parentCls}-last-item`]: {
  54. [`& ${childCombinator}, &${prefixCls}-sm ${childCombinator}, &${prefixCls}-lg ${childCombinator}`]: {
  55. borderStartStartRadius: 0,
  56. borderEndStartRadius: 0
  57. }
  58. }
  59. };
  60. }
  61. function genCompactItemStyle(token, options = {
  62. focus: true
  63. }) {
  64. const {
  65. componentCls
  66. } = token;
  67. const compactCls = `${componentCls}-compact`;
  68. return {
  69. [compactCls]: Object.assign(Object.assign({}, compactItemBorder(token, compactCls, options, componentCls)), compactItemBorderRadius(componentCls, compactCls, options))
  70. };
  71. }