index.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import { genCompactItemStyle } from '../../style/compact-item';
  2. import { genStyleHooks } from '../../theme/internal';
  3. import getColumnsStyle from './columns';
  4. // =============================== Base ===============================
  5. const genBaseStyle = token => {
  6. const {
  7. componentCls,
  8. antCls
  9. } = token;
  10. return [
  11. // =====================================================
  12. // == Control ==
  13. // =====================================================
  14. {
  15. [componentCls]: {
  16. width: token.controlWidth
  17. }
  18. },
  19. // =====================================================
  20. // == Popup ==
  21. // =====================================================
  22. {
  23. [`${componentCls}-dropdown`]: [{
  24. [`&${antCls}-select-dropdown`]: {
  25. padding: 0
  26. }
  27. }, getColumnsStyle(token)]
  28. },
  29. // =====================================================
  30. // == RTL ==
  31. // =====================================================
  32. {
  33. [`${componentCls}-dropdown-rtl`]: {
  34. direction: 'rtl'
  35. }
  36. },
  37. // =====================================================
  38. // == Space Compact ==
  39. // =====================================================
  40. genCompactItemStyle(token)];
  41. };
  42. // ============================== Export ==============================
  43. export const prepareComponentToken = token => {
  44. const itemPaddingVertical = Math.round((token.controlHeight - token.fontSize * token.lineHeight) / 2);
  45. return {
  46. controlWidth: 184,
  47. controlItemWidth: 111,
  48. dropdownHeight: 180,
  49. optionSelectedBg: token.controlItemBgActive,
  50. optionSelectedFontWeight: token.fontWeightStrong,
  51. optionPadding: `${itemPaddingVertical}px ${token.paddingSM}px`,
  52. menuPadding: token.paddingXXS,
  53. optionSelectedColor: token.colorText
  54. };
  55. };
  56. export default genStyleHooks('Cascader', genBaseStyle, prepareComponentToken, {
  57. unitless: {
  58. optionSelectedFontWeight: true
  59. }
  60. });