Skip to content

Commit aff4b39

Browse files
committed
docs: add Chinese README
1 parent b785cf4 commit aff4b39

2 files changed

Lines changed: 126 additions & 0 deletions

File tree

README.md

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

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

1618
## Highlights
1719

README.zh-CN.md

Lines changed: 124 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,124 @@
1+
<div align="center">
2+
<h1>@rc-component/trigger</h1>
3+
<p><sub>Ant Design 生态的一部分。</sub></p>
4+
<p>🎯 React 弹层触发基础组件,支持定位、对齐、动画和事件触发。</p>
5+
<p>
6+
<a href="https://www.npmjs.com/package/@rc-component/trigger"><img src="https://img.shields.io/npm/v/@rc-component/trigger.svg?style=flat-square" alt="npm version" /></a>
7+
<a href="https://www.npmjs.com/package/@rc-component/trigger"><img src="https://img.shields.io/npm/dm/@rc-component/trigger.svg?style=flat-square" alt="npm downloads" /></a>
8+
<a href="https://github.com/react-component/trigger/actions/workflows/react-component-ci.yml"><img src="https://github.com/react-component/trigger/actions/workflows/react-component-ci.yml/badge.svg" alt="CI" /></a>
9+
<a href="https://app.codecov.io/gh/react-component/trigger"><img src="https://img.shields.io/codecov/c/github/react-component/trigger/master.svg?style=flat-square" alt="Codecov" /></a>
10+
<a href="https://bundlephobia.com/package/@rc-component/trigger"><img src="https://badgen.net/bundlephobia/minzip/@rc-component/trigger" alt="bundle size" /></a>
11+
<a href="https://github.com/umijs/dumi"><img src="https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square" alt="dumi" /></a>
12+
</p>
13+
</div>
14+
15+
<p align="center"><a href="./README.md">English</a> | 简体中文</p>
16+
17+
18+
## 特性
19+
20+
- Built for React and maintained by the rc-component team.
21+
- 被 Ant Design 使用和其他 React 组件库使用。
22+
- 提供 TypeScript declarations with both ES module and CommonJS outputs.
23+
- 保留 examples, tests, and preview builds aligned with the package source.
24+
25+
## 安装
26+
27+
```bash
28+
npm install @rc-component/trigger
29+
```
30+
31+
## 使用
32+
33+
```tsx
34+
import Trigger from '@rc-component/trigger';
35+
import '@rc-component/trigger/assets/index.css';
36+
37+
export default () => (
38+
<Trigger
39+
action={['click']}
40+
popup={<span>Popup content</span>}
41+
popupAlign={{
42+
points: ['tl', 'bl'],
43+
offset: [0, 4],
44+
}}
45+
>
46+
<button type="button">Open</button>
47+
</Trigger>
48+
);
49+
```
50+
51+
## 示例
52+
53+
Run the local dumi site to explore the examples:
54+
55+
```bash
56+
npm install
57+
npm start
58+
```
59+
60+
## API
61+
62+
### Trigger
63+
64+
| 属性 | 说明 | 类型 | 默认值 |
65+
| -------------------------- | ------------------------------------------------------------------------- | ----------------------------------------- | ------------------ |
66+
| action | Actions that control popup visibility. | `ActionType` \| `ActionType[]` | `hover` |
67+
| afterOpenChange | Called after popup visibility changes. | `(visible) => void` | - |
68+
| afterPopupVisibleChange | Deprecated. Use `afterOpenChange` instead. | `(visible) => void` | - |
69+
| alignPoint | Align popup to mouse position for click, hover, and context menu actions. | `boolean` | `false` |
70+
| arrow | Render popup arrow. | `boolean` \| `ArrowType` | - |
71+
| autoDestroy | Destroy popup DOM when it is hidden. | `boolean` | `false` |
72+
| blurDelay | Delay before hiding on blur, in seconds. | `number` | - |
73+
| builtinPlacements | Named placement presets. | `BuildInPlacements` | `{}` |
74+
| defaultPopupVisible | Initial uncontrolled visibility. | `boolean` | `false` |
75+
| focusDelay | Delay before showing on focus, in seconds. | `number` | - |
76+
| forceRender | Render popup before it is first shown. | `boolean` | `false` |
77+
| fresh | Keep popup content updated while closed. | `boolean` | - |
78+
| getPopupClassNameFromAlign | Return a popup class name from the current alignment. | `(align) => string` | - |
79+
| getPopupContainer | Return the element that should contain the popup. | `(node) => HTMLElement` | - |
80+
| hideAction | Actions that hide popup visibility. | `ActionType[]` | - |
81+
| mask | Render a mask behind the popup. | `boolean` | `false` |
82+
| maskClosable | Close when clicking the mask. | `boolean` | `true` |
83+
| maskMotion | Motion config for the mask. | `CSSMotionProps` | - |
84+
| mouseEnterDelay | Delay before showing on mouse enter, in seconds. | `number` | - |
85+
| mouseLeaveDelay | Delay before hiding on mouse leave, in seconds. | `number` | `0.1` |
86+
| popup | Popup content. | `ReactNode` \| `() => ReactNode` | - |
87+
| popupAlign | Alignment config compatible with dom-align. | `AlignType` | - |
88+
| popupClassName | Class name added to popup. | `string` | - |
89+
| popupMotion | Motion config for the popup. | `CSSMotionProps` | - |
90+
| popupPlacement | Placement key from `builtinPlacements`. | `string` | - |
91+
| popupStyle | Inline popup style. | `React.CSSProperties` | - |
92+
| popupVisible | Controlled popup visibility. | `boolean` | - |
93+
| prefixCls | Popup class name prefix. | `string` | `rc-trigger-popup` |
94+
| showAction | Actions that show popup visibility. | `ActionType[]` | - |
95+
| stretch | Stretch popup width and/or height from target. | `string` | - |
96+
| unique | Share popup container through `UniqueProvider`. | `boolean` | - |
97+
| uniqueContainerClassName | Class name passed to `UniqueProvider` container. | `string` | - |
98+
| uniqueContainerStyle | Style passed to `UniqueProvider` container. | `React.CSSProperties` | - |
99+
| zIndex | Popup z-index. | `number` | - |
100+
| onOpenChange | Called when visibility changes. | `(visible) => void` | - |
101+
| onPopupAlign | Called when the popup is aligned. | `(element, align) => void` | - |
102+
| onPopupClick | Called when popup is clicked. | `React.MouseEventHandler<HTMLDivElement>` | - |
103+
| onPopupVisibleChange | Deprecated. Use `onOpenChange` instead. | `(visible) => void` | - |
104+
105+
## 本地开发
106+
107+
```bash
108+
npm install
109+
npm start
110+
npm test
111+
npm run build
112+
```
113+
114+
## 发布
115+
116+
```bash
117+
npm run prepublishOnly
118+
```
119+
120+
The release flow is handled by `@rc-component/np` through the `rc-np` command after the package build.
121+
122+
## 许可证
123+
124+
@rc-component/trigger is released under the [MIT](./LICENSE) license.

0 commit comments

Comments
 (0)