legacyLogicalPropertiesTransformer 没有正确拼接 calc()

[Airkro]

calc(a + b) 的拼接缺少必要的空格。

Sider 内的折叠 Menu Icon 受到明显的影响，无法居中对齐：

相关问题：

• 使用 legacyLogicalPropertiesTransformer ProLayout aside组件submenu样式显示出现问题 ant-design#40986
• 使用 legacyLogicalPropertiesTransformer ProLayout aside组件submenu样式显示出现问题 #92

[Airkro]

临时解决方案：

const transformers = [
  legacyLogicalPropertiesTransformer,
  {
    visit(cssObj) {
      for (const item of Object.values(cssObj)) {
        if (typeof item.value === 'string' && item.value === 'calc(50%-14px)') {
          item.value = item.value.split('-').join(' - ');
        }
      }
    },
  },
];

[susususutie]

临时解决方案：

const transformers = [
  legacyLogicalPropertiesTransformer,
  {
    visit(cssObj) {
      for (const item of Object.values(cssObj)) {
        if (typeof item.value === 'string' && item.value === 'calc(50%-14px)') {
          item.value = item.value.split('-').join(' - ');
        }
      }
    },
  },
];

这里14px是不固定的, 我改成用正则了

if (
  item &&
  typeof item === 'object' &&
  value' in item &&
  typeof item.value === 'string' &&
 /calc\(50%-\d+px\)/.test(item.value)
) {
   item.value = item.value.split('-').join(' - ');
}