Skip to content

Commit 6f9d074

Browse files
afc163afc163
committed
docs: add Chinese README
1 parent 8b5db46 commit 6f9d074

2 files changed

Lines changed: 102 additions & 0 deletions

File tree

‎README.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@
1313
</p>
1414
</div>
1515

16+
<p align="center">English | <a href="./README.zh-CN.md">简体中文</a></p>
17+
1618

1719
## Highlights
1820

‎README.zh-CN.md‎

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
<div align="center">
2+
<h1>@rc-component/tooltip</h1>
3+
<p><sub>Ant Design 生态的一部分。</sub></p>
4+
<p>💡 React 文字提示组件，基于 trigger 定位和弹层能力构建。</p>
5+
6+
<p>
7+
<a href="https://www.npmjs.com/package/@rc-component/tooltip"><img src="https://img.shields.io/npm/v/@rc-component/tooltip.svg?style=flat-square" alt="npm version" /></a>
8+
<a href="https://www.npmjs.com/package/@rc-component/tooltip"><img src="https://img.shields.io/npm/dm/@rc-component/tooltip.svg?style=flat-square" alt="npm downloads" /></a>
9+
<a href="https://github.com/react-component/tooltip/actions"><img src="https://github.com/react-component/tooltip/actions/workflows/react-component-ci.yml/badge.svg" alt="CI" /></a>
10+
<a href="https://codecov.io/gh/react-component/tooltip"><img src="https://img.shields.io/codecov/c/github/react-component/tooltip/master.svg?style=flat-square" alt="Codecov" /></a>
11+
<a href="https://bundlephobia.com/package/@rc-component/tooltip"><img src="https://badgen.net/bundlephobia/minzip/@rc-component/tooltip" alt="bundle size" /></a>
12+
<a href="https://github.com/umijs/dumi"><img src="https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square" alt="dumi" /></a>
13+
</p>
14+
</div>
15+
16+
<p align="center"><a href="./README.md">English</a> | 简体中文</p>
17+
18+
19+
## 特性
20+
21+
- 支持 hover, focus, click, and controlled visibility through one trigger layer.
22+
- 提供 built-in placements, custom alignment, delays, arrows, and popup motion.
23+
- 暴露 semantic `classNames` and `styles` slots for root, arrow, and container nodes.
24+
- 保留 accessibility wiring through generated tooltip ids and `aria-describedby`.
25+
26+
## 安装
27+
28+
```bash
29+
npm install @rc-component/tooltip
30+
```
31+
32+
## 使用
33+
34+
```tsx pure
35+
import Tooltip from '@rc-component/tooltip';
36+
import '@rc-component/tooltip/assets/bootstrap_white.css';
37+
38+
export default () => (
39+
<Tooltip placement="top" overlay={<span>Tooltip content</span>}>
40+
<button type="button">Hover me</button>
41+
</Tooltip>
42+
);
43+
```
44+
45+
Online preview: https://tooltip.react-component.vercel.app/
46+
47+
## API
48+
49+
### Tooltip
50+
51+
| 名称 | 类型 | 默认值 | 说明 |
52+
| --------------------- | ---------------------------------------------------- | ------------------- | ---------------------------------------------------------- |
53+
| `afterVisibleChange` | `(visible: boolean) => void` | - | Called after popup visibility changes. |
54+
| `align` | AlignType | `{}` | Extra popup alignment config. |
55+
| `arrowContent` | React.ReactNode | - | Custom arrow content. |
56+
| `builtinPlacements` | TriggerProps['builtinPlacements'] | built in placements | Placement map passed to trigger. |
57+
| `children` | React.ReactElement | - | Required trigger element. |
58+
| `classNames` | `Partial<Record<SemanticName, string>>` | - | Semantic class names for root, arrow, and container nodes. |
59+
| `defaultVisible` | boolean | - | Initial uncontrolled visible state. |
60+
| `destroyOnHidden` | boolean | false | Destroy popup DOM when hidden. |
61+
| `fresh` | boolean | - | Keep popup content fresh when closed. |
62+
| `getTooltipContainer` | `(node: HTMLElement) => HTMLElement` | - | Resolve popup container. |
63+
| `id` | string | generated id | Tooltip id used for accessibility. |
64+
| `motion` | TriggerProps['popupMotion'] | - | Popup motion config. |
65+
| `mouseEnterDelay` | number | 0 | Delay in seconds before showing on mouse enter. |
66+
| `mouseLeaveDelay` | number | 0.1 | Delay in seconds before hiding on mouse leave. |
67+
| `onPopupAlign` | TriggerProps['onPopupAlign'] | - | Called after popup alignment. |
68+
| `onVisibleChange` | `(visible: boolean) => void` | - | Called when visibility changes. |
69+
| `overlay` | React.ReactNode \| `() => React.ReactNode` | - | Tooltip content. |
70+
| `placement` | string | `'right'` | Popup placement. |
71+
| `prefixCls` | string | `'rc-tooltip'` | Prefix class name. |
72+
| `showArrow` | boolean \| ArrowType | true | Whether to show arrow or provide arrow config. |
73+
| `styles` | `Partial<Record<SemanticName, React.CSSProperties>>` | - | Semantic styles for root, arrow, and container nodes. |
74+
| `trigger` | ActionType \| ActionType[] | `['hover']` | Actions that show the tooltip. |
75+
| `unique` | TriggerProps['unique'] | - | Experimental unique container reuse config. |
76+
| `visible` | boolean | - | Controlled visible state. |
77+
| `zIndex` | number | - | Popup z-index. |
78+
79+
## 本地开发
80+
81+
```bash
82+
npm install
83+
npm start
84+
npm test
85+
npm run tsc
86+
npm run compile
87+
npm run build
88+
```
89+
90+
## 发布
91+
92+
```bash
93+
npm run prepublishOnly
94+
```
95+
96+
The release flow is handled by `@rc-component/np` through the `rc-np` command after the package build.
97+
98+
## 许可证
99+
100+
@rc-component/tooltip is released under the [MIT](./LICENSE) license.

0 commit comments

Comments
 (0)