Skip to content

Commit 0c8197f

Browse files
afc163afc163
authored
chore: update maintenance dependencies (#101)
* chore: update maintenance dependencies * fix: align TypeScript and ESLint compatibility * chore: use testing-library dom events * test: keep react testing event behavior * chore: address review comments * fix: keep compatible eslint export rule * docs: use ut install for local setup * chore: restore vercel install command * chore: align maintenance dependencies * chore: fix upgraded test tooling * fix: preserve React peer dependency range * docs: use npm install in README * chore: remove redundant strict tsconfig flags * chore: remove manual global test declarations * chore: migrate to native eslint flat config * chore: address review comments
1 parent c8950b6 commit 0c8197f

10 files changed

Lines changed: 211 additions & 97 deletions

File tree

‎.eslintrc.js‎

Lines changed: 0 additions & 11 deletions
This file was deleted.

‎.github/dependabot.yml‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,10 @@ updates:
88
time: '21:00'
99
timezone: Asia/Shanghai
1010
open-pull-requests-limit: 10
11+
groups:
12+
npm-dependencies:
13+
patterns:
14+
- '*'
1115

1216
- package-ecosystem: github-actions
1317
directory: '/'
@@ -17,3 +21,7 @@ updates:
1721
time: '21:00'
1822
timezone: Asia/Shanghai
1923
open-pull-requests-limit: 10
24+
groups:
25+
github-actions:
26+
patterns:
27+
- '*'

‎README.md‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<div align="center">
22
<h1>@rc-component/tour</h1>
3-
<p><sub><img alt="Ant Design" height="14" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" style="vertical-align: -0.125em;" /> Part of the Ant Design ecosystem.</sub></p>
3+
<p><sub><a href="https://ant.design"><img alt="Ant Design" height="14" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" style="vertical-align: -0.125em;" /></a> Part of the Ant Design ecosystem.</sub></p>
44
<p>🧭 Guided React tours with masks, target tracking, keyboard navigation, and custom panels.</p>
55

66
<p>
@@ -15,7 +15,6 @@
1515

1616
<p align="center">English | <a href="./README.zh-CN.md">简体中文</a></p>
1717

18-
1918
## Highlights
2019

2120
- Tracks step targets and renders guided panels through a trigger-backed popup.

‎README.zh-CN.md‎

Lines changed: 42 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<div align="center">
22
<h1>@rc-component/tour</h1>
3-
<p><sub><img alt="Ant Design" height="14" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" style="vertical-align: -0.125em;" /> Ant Design 生态的一部分。</sub></p>
3+
<p><sub><a href="https://ant.design"><img alt="Ant Design" height="14" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" style="vertical-align: -0.125em;" /></a> Ant Design 生态的一部分。</sub></p>
44
<p>🧭 React 引导组件，用于创建分步产品导览。</p>
55

66
<p>
@@ -15,7 +15,6 @@
1515

1616
<p align="center"><a href="./README.md">English</a> | 简体中文</p>
1717

18-
1918
## 特性
2019

2120
- 跟踪步骤目标并通过触发器支持的弹层窗口渲染引导面板。
@@ -69,53 +68,53 @@ npm start
6968

7069
### Tour
7170

72-
| 名称 | 类型 | 默认值 | 说明 |
73-
| ----------------------- | ------------------------------------------------------------ | -------------- | ---------------------------------------------------- |
74-
| `animated` | boolean \| `{ placeholder: boolean }` | false | 启用目标占位动画。 |
75-
| `arrow` | boolean \| `{ pointAtCenter: boolean }` | true | 显示箭头，并可选择指向目标中心。 |
76-
| `builtinPlacements` | TriggerProps['builtinPlacements'] \| function | - | 自定义位置映射。 |
77-
| `className` | string | - | 面板 className。 |
78-
| `classNames` | `Partial<Record<SemanticName, string>>` | - | 语义 className。 |
79-
| `closable` | boolean \| object | - | 关闭按钮配置。 |
80-
| `closeIcon` | React.ReactNode | - | 自定义关闭图标。 |
81-
| `current` | number | - | 受控当前步骤。 |
82-
| `defaultCurrent` | number | 0 | 初始当前步骤。 |
83-
| `defaultOpen` | boolean | - | 初始打开状态。 |
84-
| `disabledInteraction` | boolean | - | 禁用与目标区域的交互。 |
85-
| `gap` | Gap | - | 目标周围的间隙偏移和半径。 |
86-
| `getPopupContainer` | TriggerProps['getPopupContainer'] \| false | - | 弹层容器解析函数。使用 false 表示内联模式。 |
87-
| `keyboard` | boolean | true | 启用 Escape 和箭头键导航。 |
88-
| `mask` | boolean \| `{ style?: React.CSSProperties; color?: string }` | true | 遮罩配置。 |
89-
| `onChange` | `(current: number) => void` | - | 当前步骤更改时调用。 |
90-
| `onClose` | `(current: number) => void` | - | 引导关闭时调用。 |
91-
| `onFinish` | `() => void` | - | 引导完成后调用。 |
92-
| `onPopupAlign` | TriggerProps['onPopupAlign'] | - | 弹层对齐后调用。 |
93-
| `open` | boolean | - | 受控打开状态。 |
94-
| `placement` | PlacementType | - | 默认面板位置。 |
95-
| `prefixCls` | string | `'rc-tour'` | className 前缀。 |
96-
| `renderPanel` | `(props, current) => ReactNode` | - | 自定义面板渲染器。 |
97-
| `rootClassName` | string | - | 根 className。 |
98-
| `scrollIntoViewOptions` | boolean \| ScrollIntoViewOptions | 中心选项 | 目标滚动行为。 |
99-
| `steps` | TourStepInfo[] | [] | 漫游步骤。 |
100-
| `style` | React.CSSProperties | - | 面板风格。 |
101-
| `styles` | `Partial<Record<SemanticName, React.CSSProperties>>` | - | 语义化样式。 |
102-
| `zIndex` | number | 1001 | 弹层 z 索引。 |
71+
| 名称 | 类型 | 默认值 | 说明 |
72+
| ----------------------- | ------------------------------------------------------------ | ----------- | ------------------------------------------- |
73+
| `animated` | boolean \| `{ placeholder: boolean }` | false | 启用目标占位动画。 |
74+
| `arrow` | boolean \| `{ pointAtCenter: boolean }` | true | 显示箭头，并可选择指向目标中心。 |
75+
| `builtinPlacements` | TriggerProps['builtinPlacements'] \| function | - | 自定义位置映射。 |
76+
| `className` | string | - | 面板 className。 |
77+
| `classNames` | `Partial<Record<SemanticName, string>>` | - | 语义 className。 |
78+
| `closable` | boolean \| object | - | 关闭按钮配置。 |
79+
| `closeIcon` | React.ReactNode | - | 自定义关闭图标。 |
80+
| `current` | number | - | 受控当前步骤。 |
81+
| `defaultCurrent` | number | 0 | 初始当前步骤。 |
82+
| `defaultOpen` | boolean | - | 初始打开状态。 |
83+
| `disabledInteraction` | boolean | - | 禁用与目标区域的交互。 |
84+
| `gap` | Gap | - | 目标周围的间隙偏移和半径。 |
85+
| `getPopupContainer` | TriggerProps['getPopupContainer'] \| false | - | 弹层容器解析函数。使用 false 表示内联模式。 |
86+
| `keyboard` | boolean | true | 启用 Escape 和箭头键导航。 |
87+
| `mask` | boolean \| `{ style?: React.CSSProperties; color?: string }` | true | 遮罩配置。 |
88+
| `onChange` | `(current: number) => void` | - | 当前步骤更改时调用。 |
89+
| `onClose` | `(current: number) => void` | - | 引导关闭时调用。 |
90+
| `onFinish` | `() => void` | - | 引导完成后调用。 |
91+
| `onPopupAlign` | TriggerProps['onPopupAlign'] | - | 弹层对齐后调用。 |
92+
| `open` | boolean | - | 受控打开状态。 |
93+
| `placement` | PlacementType | - | 默认面板位置。 |
94+
| `prefixCls` | string | `'rc-tour'` | className 前缀。 |
95+
| `renderPanel` | `(props, current) => ReactNode` | - | 自定义面板渲染器。 |
96+
| `rootClassName` | string | - | 根 className。 |
97+
| `scrollIntoViewOptions` | boolean \| ScrollIntoViewOptions | 中心选项 | 目标滚动行为。 |
98+
| `steps` | TourStepInfo[] | [] | 漫游步骤。 |
99+
| `style` | React.CSSProperties | - | 面板风格。 |
100+
| `styles` | `Partial<Record<SemanticName, React.CSSProperties>>` | - | 语义化样式。 |
101+
| `zIndex` | number | 1001 | 弹层 z 索引。 |
103102

104103
### TourStepInfo
105104

106-
| 名称 | 类型 | 默认值 | 说明 |
107-
| ----------------------- | ------------------------------------------ | --------- | --------------------------- |
108-
| `arrow` | boolean \| `{ pointAtCenter: boolean }` | inherited | 步骤箭头配置。 |
109-
| `className` | string | - | 步骤面板 className。 |
105+
| 名称 | 类型 | 默认值 | 说明 |
106+
| ----------------------- | ------------------------------------------ | --------- | -------------------- |
107+
| `arrow` | boolean \| `{ pointAtCenter: boolean }` | inherited | 步骤箭头配置。 |
108+
| `className` | string | - | 步骤面板 className。 |
110109
| `closable` | boolean \| object | inherited | 步骤关闭按钮配置。 |
111-
| `closeIcon` | React.ReactNode | inherited | 步骤关闭图标。 |
112-
| `description` | React.ReactNode | - | 步骤描述。 |
113-
| `mask` | boolean \| object | inherited | 步骤遮罩配置。 |
114-
| `placement` | PlacementType | inherited | 步骤位置。 |
110+
| `closeIcon` | React.ReactNode | inherited | 步骤关闭图标。 |
111+
| `description` | React.ReactNode | - | 步骤描述。 |
112+
| `mask` | boolean \| object | inherited | 步骤遮罩配置。 |
113+
| `placement` | PlacementType | inherited | 步骤位置。 |
115114
| `scrollIntoViewOptions` | boolean \| ScrollIntoViewOptions | inherited | 步骤滚动行为。 |
116115
| `style` | React.CSSProperties | - | 步骤面板样式。 |
117-
| `target` | HTMLElement \| `() => HTMLElement \| null` | - | 目标元素或解析器。 |
118-
| `title` | React.ReactNode | - | 步骤标题。 |
116+
| `target` | HTMLElement \| `() => HTMLElement \| null` | - | 目标元素或解析器。 |
117+
| `title` | React.ReactNode | - | 步骤标题。 |
119118

120119
## 本地开发
121120

‎eslint.config.mjs‎

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
import js from '@eslint/js';
2+
import { defineConfig } from 'eslint/config';
3+
import { dirname } from 'node:path';
4+
import { fileURLToPath } from 'node:url';
5+
import prettier from 'eslint-config-prettier';
6+
import jest from 'eslint-plugin-jest';
7+
import react from 'eslint-plugin-react';
8+
import reactHooks from 'eslint-plugin-react-hooks';
9+
import globals from 'globals';
10+
import tseslint from 'typescript-eslint';
11+
12+
const tsconfigRootDir = dirname(fileURLToPath(import.meta.url));
13+
14+
export default defineConfig([
15+
{
16+
plugins: {
17+
'@typescript-eslint': tseslint.plugin,
18+
},
19+
},
20+
{
21+
linterOptions: {
22+
reportUnusedDisableDirectives: 'warn',
23+
},
24+
},
25+
{
26+
ignores: [
27+
'node_modules/',
28+
'coverage/',
29+
'es/',
30+
'lib/',
31+
'dist/',
32+
'docs-dist/',
33+
'.docs-dist/',
34+
'.dumi/',
35+
'.doc/',
36+
'.vercel/',
37+
],
38+
},
39+
{
40+
files: ['**/*.{js,jsx,ts,tsx}'],
41+
extends: [
42+
js.configs.recommended,
43+
react.configs.flat.recommended,
44+
react.configs.flat['jsx-runtime'],
45+
prettier,
46+
],
47+
plugins: {
48+
'react-hooks': reactHooks,
49+
},
50+
languageOptions: {
51+
globals: {
52+
...globals.browser,
53+
...globals.node,
54+
},
55+
},
56+
settings: {
57+
react: {
58+
version: 'detect',
59+
},
60+
},
61+
rules: {
62+
'no-async-promise-executor': 'off',
63+
'no-empty-pattern': 'off',
64+
'no-irregular-whitespace': 'off',
65+
'no-prototype-builtins': 'off',
66+
'no-useless-escape': 'off',
67+
'no-extra-boolean-cast': 'off',
68+
'no-undef': 'off',
69+
'no-unused-vars': 'off',
70+
'react/no-find-dom-node': 'off',
71+
'react/display-name': 'off',
72+
'react/no-unknown-property': 'off',
73+
'react/prop-types': 'off',
74+
'react-hooks/exhaustive-deps': 'warn',
75+
'react-hooks/rules-of-hooks': 'error',
76+
},
77+
},
78+
{
79+
files: ['**/*.{ts,tsx}'],
80+
extends: [...tseslint.configs.recommended],
81+
rules: {
82+
'@typescript-eslint/ban-ts-comment': 'off',
83+
'@typescript-eslint/no-empty-object-type': 'off',
84+
'@typescript-eslint/no-explicit-any': 'off',
85+
'@typescript-eslint/no-unsafe-function-type': 'off',
86+
'@typescript-eslint/no-unnecessary-type-constraint': 'off',
87+
'@typescript-eslint/no-unused-vars': 'off',
88+
},
89+
},
90+
{
91+
files: ['src/**/*.{ts,tsx}'],
92+
languageOptions: {
93+
parserOptions: {
94+
projectService: true,
95+
tsconfigRootDir,
96+
},
97+
},
98+
},
99+
{
100+
files: ['tests/**/*.{js,jsx,ts,tsx}', '**/*.{test,spec}.{js,jsx,ts,tsx}'],
101+
extends: [jest.configs['flat/recommended']],
102+
rules: {
103+
'jest/no-disabled-tests': 'off',
104+
'jest/no-done-callback': 'off',
105+
'jest/no-identical-title': 'off',
106+
'jest/expect-expect': 'off',
107+
'jest/no-alias-methods': 'off',
108+
'jest/no-conditional-expect': 'off',
109+
'jest/no-export': 'off',
110+
'jest/no-standalone-expect': 'off',
111+
'jest/valid-expect': 'off',
112+
'jest/valid-title': 'off',
113+
},
114+
},
115+
]);

‎global.d.ts‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/// <reference types="jest" />
2+
/// <reference types="node" />
3+
/// <reference types="react" />
4+
/// <reference types="react-dom" />
5+
/// <reference types="@testing-library/jest-dom" />
6+
7+
declare module '*.css';
8+
declare module '*.less';
9+
declare module 'jsonp';
10+
11+
declare module 'moment/locale/zh-cn';

‎package.json‎

Lines changed: 22 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -47,29 +47,35 @@
4747
"clsx": "^2.1.1"
4848
},
4949
"devDependencies": {
50+
"@eslint/js": "^9.39.4",
5051
"@rc-component/father-plugin": "^2.2.0",
5152
"@rc-component/np": "^1.0.4",
53+
"@testing-library/dom": "^10.4.1",
5254
"@testing-library/jest-dom": "^6.9.1",
53-
"@testing-library/react": "^15.0.7",
54-
"@types/jest": "^29.5.14",
55-
"@types/minimatch": "^5.1.2",
55+
"@testing-library/react": "^16.3.2",
56+
"@types/jest": "^30.0.0",
5657
"@types/node": "^26.0.1",
57-
"@types/react": "^18.3.31",
58-
"@types/react-dom": "^18.3.7",
59-
"@umijs/fabric": "^4.0.1",
58+
"@types/react": "^19.2.17",
59+
"@types/react-dom": "^19.2.3",
6060
"cheerio": "1.0.0-rc.12",
61-
"dumi": "^2.4.35",
62-
"eslint": "^8.57.1",
63-
"father": "^4.6.23",
64-
"gh-pages": "^6.3.0",
65-
"prettier": "^3.9.0",
66-
"rc-test": "^7.1.3",
67-
"react": "^18.3.1",
68-
"react-dom": "^18.3.1",
69-
"typescript": "^5.9.3",
7061
"cross-env": "^10.1.0",
62+
"dumi": "^2.4.38",
63+
"eslint": "^9.39.4",
64+
"eslint-config-prettier": "^10.1.8",
65+
"eslint-plugin-jest": "^29.15.4",
66+
"eslint-plugin-react": "^7.37.5",
67+
"eslint-plugin-react-hooks": "^7.1.1",
68+
"father": "^4.6.24",
69+
"gh-pages": "^6.3.0",
70+
"globals": "^17.7.0",
7171
"husky": "^9.1.7",
72-
"lint-staged": "^16.4.0"
72+
"lint-staged": "^17.0.8",
73+
"prettier": "^3.9.4",
74+
"rc-test": "^7.1.3",
75+
"react": "^19.2.7",
76+
"react-dom": "^19.2.7",
77+
"typescript": "^6.0.3",
78+
"typescript-eslint": "^8.62.1"
7379
},
7480
"peerDependencies": {
7581
"react": ">=16.9.0",

‎src/Tour.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ const Tour: React.FC<TourProps> = props => {
6565
...restProps
6666
} = props;
6767

68-
const triggerRef = React.useRef<TriggerRef>();
68+
const triggerRef = React.useRef<TriggerRef>(null);
6969

7070
const [mergedCurrent, setMergedCurrent] = useControlledState(
7171
defaultCurrent || 0,

0 commit comments

Comments
 (0)