feat: Upload, Input, InputNumber, Radio组件支持

README.md

@@ -45,12 +45,12 @@ Replacing `<path>` with appropriate values.
 - [ ] SelectProps
 - [ ] DatePicker
 - [ ] TimePicker
-- [ ] Input
-- [ ] InputNumber
-- [ ] Radio
+- [x] Input
+- [x] InputNumber
+- [x] Radio
 - [ ] Switch
 - [ ] Checkbox
-- [ ] Upload
+- [x] Upload
 - [ ] AutoComplete
 - [ ] Dropdown
 - [ ] Form

bin/transformer.js

@@ -65,7 +65,11 @@ const TRANSFORMER_INQUIRER_CHOICES = [
   'Select',
   'Popconfirm',
   'Space',
-  'Button'
+  'Button',
+  'InputNumber',
+  'Radio',
+  'Upload',
+  'Input'
 ]
   .sort((a, b) => a.localeCompare(b))
   .map((v) => ({

package.json

@@ -16,6 +16,7 @@
   ],
   "dependencies": {
     "@swc/core": "^1.3.82",
+    "chalk": "4",
     "execa": "4.0.3",
     "globby": "11.0.1",
     "inquirer": "7.3.3",

test.jsx

@@ -1,9 +1,5 @@
-import { Table, Space, Button } from 'antd'
+import { Table, Space, Button, Upload } from 'antd'
 
 export const test = () => {
-  return (
-    <Button type="link" danger>
-      数据大盘
-    </Button>
-  )
+  return <Upload />
 }

transforms/Input.js

@@ -0,0 +1,9 @@
+const { removeAntdImportAndAddSemiImport } = require('./utils')
+module.exports = function transformer(file, api) {
+  const j = api.jscodeshift
+  const root = j(file.source)
+
+  removeAntdImportAndAddSemiImport(j, root, 'Input', 'Input')
+
+  return root.toSource()
+}

transforms/InputNumber.js

@@ -0,0 +1,9 @@
+const { removeAntdImportAndAddSemiImport } = require('./utils')
+module.exports = function transformer(file, api) {
+  const j = api.jscodeshift
+  const root = j(file.source)
+
+  removeAntdImportAndAddSemiImport(j, root, 'InputNumber', 'InputNumber')
+
+  return root.toSource()
+}

transforms/Radio.js

@@ -0,0 +1,9 @@
+const { removeAntdImportAndAddSemiImport } = require('./utils')
+module.exports = function transformer(file, api) {
+  const j = api.jscodeshift
+  const root = j(file.source)
+
+  removeAntdImportAndAddSemiImport(j, root, 'Radio', 'Radio')
+
+  return root.toSource()
+}

transforms/Upload.js

@@ -0,0 +1,42 @@
+const chalk = require('chalk')
+
+const { removeAntdImportAndAddSemiImport } = require('./utils')
+module.exports = function transformer(file, api) {
+  const j = api.jscodeshift
+  const root = j(file.source)
+
+  removeAntdImportAndAddSemiImport(j, root, 'Upload', 'Upload')
+
+  // todo - 暂时没想好怎么自动处理 customRequest 的差异
+  console.log(
+    chalk.yellow(`
+    Upload组件 customRequest函数的参数有差异，如果有用到，记得手动更改一下
+    Antd
+    ----
+    <Upload customRequest={({ file } => {})} />
+
+    Semi
+    ----
+    <Upload customRequest={({ fileInstance: file }) => {}} />
+
+    Semi中fileInstance参数和Antd中的file等价
+  `)
+  )
+
+  // Find the Upload component and update its props
+  root.findJSXElements('Upload').forEach((path) => {
+    const { openingElement } = path.value
+
+    const actionAttribute = openingElement.attributes.find(
+      (attr) => attr.name.name === 'action'
+    )
+    // Semi组件<Upload /> action是必须
+    if (!actionAttribute) {
+      openingElement.attributes.push(
+        j.jsxAttribute(j.jsxIdentifier('action'), j.literal(''))
+      )
+    }
+  })
+
+  return root.toSource()
+}