@wc-kit/react 0.0.1 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +41 -0
- package/package.json +22 -9
package/README.md
ADDED
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
# @wc-kit/react
|
|
2
|
+
|
|
3
|
+
[@wc-kit/core](https://www.npmjs.com/package/@wc-kit/core) Web Components 的 React 适配包，基于 [@lit/react](https://lit.dev/docs/frameworks/react/) 官方方案生成包装组件。
|
|
4
|
+
|
|
5
|
+
## 安装
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @wc-kit/react @wc-kit/core react
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## 用法
|
|
12
|
+
|
|
13
|
+
```tsx
|
|
14
|
+
import { WcButton, WcInput } from '@wc-kit/react';
|
|
15
|
+
|
|
16
|
+
export function Demo() {
|
|
17
|
+
return (
|
|
18
|
+
<>
|
|
19
|
+
{/* 事件映射为 onWc* props */}
|
|
20
|
+
<WcButton theme="primary" onClick={() => console.log('clicked')}>
|
|
21
|
+
主要按钮
|
|
22
|
+
</WcButton>
|
|
23
|
+
|
|
24
|
+
{/* wc-input 事件 detail.value 携带输入值 */}
|
|
25
|
+
<WcInput label="用户名" onWcInput={(e) => console.log(e.detail.value)} />
|
|
26
|
+
</>
|
|
27
|
+
);
|
|
28
|
+
}
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
## 说明
|
|
32
|
+
|
|
33
|
+
- 覆盖全部 38 个 `<wc-*>` 组件，组件名 PascalCase（`wc-button` → `WcButton`）
|
|
34
|
+
- 自定义事件（`wc-change` 等）映射为 `onWc*` props，回调参数类型为对应 `CustomEvent`
|
|
35
|
+
- 需要 React 18 或 19（peerDependencies）
|
|
36
|
+
|
|
37
|
+
组件 API 与交互示例见仓库 [apps/website](https://github.com/xianmua/wui/tree/main/apps/website) 文档站。
|
|
38
|
+
|
|
39
|
+
## License
|
|
40
|
+
|
|
41
|
+
MIT
|
package/package.json
CHANGED
|
@@ -1,10 +1,23 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wc-kit/react",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.3",
|
|
4
4
|
"description": "React wrappers for @wc-kit/core web components, built on @lit/react",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"react",
|
|
7
|
+
"web-components",
|
|
8
|
+
"lit",
|
|
9
|
+
"ui",
|
|
10
|
+
"components",
|
|
11
|
+
"wc-kit"
|
|
12
|
+
],
|
|
5
13
|
"files": [
|
|
6
14
|
"dist"
|
|
7
15
|
],
|
|
16
|
+
"repository": {
|
|
17
|
+
"type": "git",
|
|
18
|
+
"url": "git+https://github.com/xianmua/wui.git",
|
|
19
|
+
"directory": "packages/react"
|
|
20
|
+
},
|
|
8
21
|
"type": "module",
|
|
9
22
|
"main": "./dist/index.cjs.js",
|
|
10
23
|
"module": "./dist/index.es.js",
|
|
@@ -19,15 +32,9 @@
|
|
|
19
32
|
"publishConfig": {
|
|
20
33
|
"access": "public"
|
|
21
34
|
},
|
|
22
|
-
"scripts": {
|
|
23
|
-
"build": "vite build",
|
|
24
|
-
"dev": "vite build --watch",
|
|
25
|
-
"test": "vitest run",
|
|
26
|
-
"test:watch": "vitest"
|
|
27
|
-
},
|
|
28
35
|
"dependencies": {
|
|
29
36
|
"@lit/react": "^1.0.8",
|
|
30
|
-
"@wc-kit/core": "
|
|
37
|
+
"@wc-kit/core": "0.0.2"
|
|
31
38
|
},
|
|
32
39
|
"devDependencies": {
|
|
33
40
|
"@types/react": "^18.3.0",
|
|
@@ -41,5 +48,11 @@
|
|
|
41
48
|
},
|
|
42
49
|
"peerDependencies": {
|
|
43
50
|
"react": "^18.0.0 || ^19.0.0"
|
|
51
|
+
},
|
|
52
|
+
"scripts": {
|
|
53
|
+
"build": "vite build",
|
|
54
|
+
"dev": "vite build --watch",
|
|
55
|
+
"test": "vitest run",
|
|
56
|
+
"test:watch": "vitest"
|
|
44
57
|
}
|
|
45
|
-
}
|
|
58
|
+
}
|