ci: support vue26 & vue27

.github/workflows/pull-request.yml

@@ -9,5 +9,119 @@ on:
     types: [opened, synchronize, reopened]
 
 jobs:
-  call-test-build:
-    uses: Tencent/tdesign/.github/workflows/test-build.yml@main
+  check:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: check_github_primary_email
+        run: |
+          log_emails=$(git log --pretty=format:"%ae %ce" -1)
+          if [[ ${log_emails} =~ '[email protected]' ]];then 
+            echo "$log_emails 跳过验证"
+            exit 0
+          fi
+          if [[ ${log_emails} =~ '@tencent.com' ]];then 
+            echo "默认邮箱 $log_emails 校验非法，可以去 https://github.com/settings/emails 更改" 
+            exit 2;
+          else 
+            echo "邮箱 $log_emails 校验通过";
+          fi
+      - uses: actions/checkout@v4
+        with:
+          ref: ${{ github.event.pull_request.head.sha }}
+      - name: check_local_email
+        run: |
+          log_emails=$(git log --pretty=format:"%ae %ce" -1)
+          if [[ ${log_emails} =~ '[email protected]' ]];then 
+            echo "$log_emails 跳过验证"
+            exit 0
+          fi
+          if [[ ${log_emails} =~ '@tencent.com' ]];then 
+            echo "本地提交邮箱 $log_emails 校验非法，需要本地更改重新提交" 
+            exit 2;
+          else 
+            echo "邮箱 $log_emails 校验通过";
+          fi
+
+  test:
+    # needs: check
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          submodules: recursive
+      - uses: pnpm/action-setup@v4
+        with:
+          version: 9     
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 18
+
+      - run: node script/migrate/migrateConfig.mjs
+      - run: pnpm install
+      - run: node script/migrate/migrateComponent.mjs
+
+      - run: npm run lint
+      - run: npm run test
+
+  site:
+    runs-on: ubuntu-latest
+    # needs: test
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          submodules: recursive
+      - uses: pnpm/action-setup@v4
+        with:
+          version: 9      
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 18
+
+      - run: node script/migrate/migrateConfig.mjs
+      - run: pnpm install
+      - run: node script/migrate/migrateComponent.mjs
+
+      - name: Build site
+        run: npm run site:preview
+
+      - run: |
+          zip -r _site.zip _site
+
+      - name: upload _site artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: _site
+          path: _site.zip
+          retention-days: 5
+
+      - name: Save PR number
+        if: ${{ always() }}
+        run: echo ${{ github.event.number }} > ./pr-id.txt
+
+      - name: Upload PR number
+        if: ${{ always() }}
+        uses: actions/upload-artifact@v4
+        with:
+          name: pr
+          path: ./pr-id.txt
+
+  build:
+    runs-on: ubuntu-latest
+    # needs: build
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          submodules: recursive
+      - uses: pnpm/action-setup@v4
+        with:
+          version: 9  
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 18
+
+      - run: node script/migrate/migrateConfig.mjs
+      - run: pnpm install
+      - run: node script/migrate/migrateComponent.mjs
+      - name: Build 
+        run: npm run build

script/migrate/components/anchor.mjs

@@ -0,0 +1,10 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+export default function migrateAnchor() {
+  let content = readFileSync('src/anchor/anchor.tsx', 'utf8');
+  if (!content.includes("import { CSSProperties } from 'vue/types/jsx';")) {
+    content = `import { CSSProperties } from 'vue/types/jsx';\n${content}`;
+    content = content.replace('{activeLineStyle}', '{activeLineStyle as CSSProperties}');
+    writeFileSync('src/anchor/anchor.tsx', content, 'utf8');
+  }
+}

script/migrate/components/auto-complete.mjs

@@ -0,0 +1,10 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+export default function migrateAutoComplete() {
+  const filePath = 'src/auto-complete/auto-complete.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('...this.popupProps,')) {
+    content = content.replace('...this.popupProps,', '...(this.popupProps as PopupProps),');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}

script/migrate/components/calendar.mjs

@@ -0,0 +1,11 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+export default function migrateCalendar() {
+  const filePath = 'src/calendar/calendar-cell.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (!content.includes("import { CSSProperties } from 'vue/types/jsx';")) {
+    content = `import { CSSProperties } from 'vue/types/jsx';\n${content}`;
+    content = content.replace('{cellContentOuterDomStyle}', '{cellContentOuterDomStyle as CSSProperties}');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}

script/migrate/components/card.mjs

@@ -0,0 +1,10 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+export default function migrateCard() {
+  const filePath = 'src/card/card.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('{this.cover}')) {
+    content = content.replace('{this.cover}', '{this.cover as string}');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}

script/migrate/components/dropdown.mjs

@@ -0,0 +1,13 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+export default function migrateDropdown() {
+  const filePath = 'src/dropdown/dropdown-item.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('ref={this.itemRef}')) {
+    content = content.replace(
+      'ref={this.itemRef}',
+      'ref="itemRef"',
+    );
+    writeFileSync(filePath, content, 'utf8');
+  }
+}

script/migrate/components/migrateImport.mjs

@@ -0,0 +1,34 @@
+import glob from 'glob';
+import { readFileSync, writeFileSync } from 'node:fs';
+
+export default function migrateImport() {
+  glob.sync('src/**/*.{tsx,vue,ts}', { ignore: ['src/_common'] }).forEach((file) => {
+    let content = readFileSync(file, 'utf8');
+    let isChange = false;
+    if (content.includes('@vue/composition-api')) {
+      content = content.replaceAll('@vue/composition-api', 'vue');
+      isChange = true;
+    }
+    if (content.includes("import VueCompositionAPI from 'vue';")) {
+      content = content.replaceAll("import VueCompositionAPI from 'vue';", '')
+        .replaceAll(', VueCompositionAPI', '');
+      isChange = true;
+    }
+    if (content.includes('// vue27:ts-ignore')) {
+      content = content.replaceAll('// vue27:ts-ignore', '// @ts-ignore');
+      isChange = true;
+    }
+    if (isChange) {
+      writeFileSync(file, content, 'utf8');
+    }
+    // console.log(`Processing file: ${file}`);
+  });
+  glob.sync('site/**/*.vue', { ignore: ['node_modules'] }).forEach((file) => {
+    const content = readFileSync(file, 'utf8');
+    if (content.includes('@vue/composition-api')) {
+      const newContent = content.replaceAll('@vue/composition-api', 'vue');
+      writeFileSync(file, newContent, 'utf8');
+    }
+    // console.log(`Processing file: ${file}`);
+  });
+}

script/migrate/components/migrateSingleFile.mjs

@@ -0,0 +1,17 @@
+import { execSync } from 'node:child_process';
+import { readFileSync, writeFileSync } from 'node:fs';
+
+function migrateSrcIndexTs() {
+  execSync('git restore src/index.ts');
+  let content = readFileSync('src/index.ts', 'utf8');
+  content = content.replace("import VueCompositionAPI from '@vue/composition-api';", '');
+
+  // 替换 VueCompositionAPI 安装代码
+  content = content.replace(/\s*if \(Vue\._installedPlugins\.indexOf\(VueCompositionAPI\) === -1\) \{\s*Vue\.use\(VueCompositionAPI\);\s*\}/g, '');
+
+  writeFileSync('src/index.ts', content, 'utf8');
+}
+
+export default function migrateSingleFile() {
+  migrateSrcIndexTs();
+}

script/migrate/components/range-input.mjs

@@ -0,0 +1,11 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+export default function migrateRangeInput() {
+  const filePath = 'src/range-input/range-input.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('const instance = getCurrentInstance();')) {
+    content = content.replace('const instance = getCurrentInstance();', 'const instance = getCurrentInstance().proxy;');
+    content = content.replaceAll('instance.emit', 'instance.$emit');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}

script/migrate/components/select-input.mjs

@@ -0,0 +1,34 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+function migrateUseSingle() {
+  const filePath = 'src/select-input/useSingle.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('const instance = getCurrentInstance();')) {
+    content = content.replace('const instance = getCurrentInstance();', 'const instance = getCurrentInstance().proxy;');
+    content = content.replaceAll('instance.emit', 'instance.$emit');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+function migrateUseOverlayInnerStyle() {
+  const filePath = 'src/select-input/useOverlayInnerStyle.ts';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('const instance = getCurrentInstance();')) {
+    content = content.replace('const instance = getCurrentInstance();', 'const instance = getCurrentInstance().proxy;');
+    content = content.replaceAll('instance.emit', 'instance.$emit');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+function migrateSelectInput() {
+  const filePath = 'src/select-input/select-input.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('setup(props: TdSelectInputProps')) {
+    content = content.replace('setup(props: TdSelectInputProps', 'setup(props');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+
+export default function () {
+  migrateSelectInput();
+  migrateUseSingle();
+  migrateUseOverlayInnerStyle();
+}

script/migrate/components/select.mjs

@@ -0,0 +1,11 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+export default function migrateSelect() {
+  const filePath = 'src/select/select.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('const instance = getCurrentInstance();')) {
+    content = content.replace('const instance = getCurrentInstance();', 'const instance = getCurrentInstance().proxy;');
+    content = content.replaceAll('instance.emit', 'instance.$emit');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}

script/migrate/components/table.mjs

@@ -0,0 +1,60 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+function migrateThead() {
+  const filePath = 'src/table/thead.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('setup(props: TheadProps')) {
+    content = content.replace('setup(props: TheadProps', 'setup(props');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+function migrateTbody() {
+  const filePath = 'src/table/tbody.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('setup(props: TableBodyProps')) {
+    content = content.replace('setup(props: TableBodyProps', 'setup(props');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+function migrateTfoot() {
+  const filePath = 'src/table/tfoot.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('setup(props: TFootProps')) {
+    content = content.replace('setup(props: TFootProps', 'setup(props');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+function migrateTr() {
+  const filePath = 'src/table/tr.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('setup(props: TrProps')) {
+    content = content.replace('setup(props: TrProps', 'setup(props');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+function migrateFilterController() {
+  const filePath = 'src/table/filter-controller.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('setup(props: TableFilterControllerProps')) {
+    content = content.replace('setup(props: TableFilterControllerProps', 'setup(props');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+function migrateEditableCell() {
+  const filePath = 'src/table/editable-cell.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('this.col.edit')) {
+    content = content.replace('render() {', 'render() {\nconst col = this.col as PrimaryTableCol<TableRowData>;');
+    content = content.replaceAll('this.col.edit', 'col.edit');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+
+export default function migrateTable() {
+  migrateThead();
+  migrateTbody();
+  migrateTfoot();
+  migrateTr();
+  migrateFilterController();
+  migrateEditableCell();
+}

script/migrate/components/timeline.mjs

@@ -0,0 +1,26 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+function migrateTimeline() {
+  const filePath = 'src/timeline/timeline.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('const instance = getCurrentInstance();')) {
+    content = content.replace('const instance = getCurrentInstance();', 'const instance = getCurrentInstance().proxy;');
+    content = content.replaceAll('instance.slots', 'instance.$slots');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+
+function migrateTimelineItem() {
+  const filePath = 'src/timeline/timeline-item.tsx';
+  let content = readFileSync(filePath, 'utf8');
+  if (content.includes('const instance = getCurrentInstance();')) {
+    content = content.replace('const instance = getCurrentInstance();', 'const instance = getCurrentInstance().proxy;');
+    content = content.replaceAll('instance.parent.slots', 'instance.$parent.$slots');
+    writeFileSync(filePath, content, 'utf8');
+  }
+}
+
+export default function () {
+  migrateTimeline();
+  migrateTimelineItem();
+}

script/migrate/components/tree.mjs

@@ -0,0 +1,7 @@
+import { readFileSync, writeFileSync } from 'node:fs';
+
+export default function migrateTree() {
+  let content = readFileSync('src/tree/adapt.ts', 'utf8');
+  content = content.replace('VueCompositionAPI,', '').replace(', VueCompositionAPI', '');
+  writeFileSync('src/tree/adapt.ts', content, 'utf8');
+}