@chao-component/bag-animation-ui 1.0.8 → 1.0.10
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 +40 -0
- package/dist/index.js +3 -3
- package/dist/index.mjs +3 -3
- package/package.json +12 -3
package/README.md
ADDED
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
# Bag Animation UI
|
|
2
|
+
|
|
3
|
+
一个用于显示 APNG 动画的 React 组件，支持全屏遮罩和交互式拖拽。
|
|
4
|
+
|
|
5
|
+
## 开发
|
|
6
|
+
|
|
7
|
+
### 安装依赖
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
npm install
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
### 开发模式（预览组件效果）
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
npm run demo
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
这会在 `http://localhost:3000` 启动开发服务器，你可以在浏览器中实时预览组件效果。
|
|
20
|
+
|
|
21
|
+
### 构建组件
|
|
22
|
+
|
|
23
|
+
```bash
|
|
24
|
+
npm run build
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
### 构建演示页面
|
|
28
|
+
|
|
29
|
+
```bash
|
|
30
|
+
npm run demo:build
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
## 使用
|
|
34
|
+
|
|
35
|
+
查看 [USAGE.md](./USAGE.md) 了解详细使用说明。
|
|
36
|
+
|
|
37
|
+
## 快速开始
|
|
38
|
+
|
|
39
|
+
查看 [QUICK_START.md](./QUICK_START.md) 了解快速开始指南。
|
|
40
|
+
|
package/dist/index.js
CHANGED
|
@@ -1034,7 +1034,7 @@ function BagAnimation({
|
|
|
1034
1034
|
showMask && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
1035
1035
|
"div",
|
|
1036
1036
|
{
|
|
1037
|
-
className: "fixed inset-0 z-[
|
|
1037
|
+
className: "fixed inset-0 z-[99]",
|
|
1038
1038
|
style: {
|
|
1039
1039
|
backgroundColor: `rgba(0, 0, 0, ${maskOpacity})`,
|
|
1040
1040
|
backdropFilter: `blur(${maskBlur}px)`,
|
|
@@ -1049,7 +1049,7 @@ function BagAnimation({
|
|
|
1049
1049
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
1050
1050
|
"div",
|
|
1051
1051
|
{
|
|
1052
|
-
className: "fixed inset-0 z-[
|
|
1052
|
+
className: "fixed inset-0 z-[100] flex items-center justify-center pointer-events-none",
|
|
1053
1053
|
style: { pointerEvents: "none" },
|
|
1054
1054
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
1055
1055
|
"div",
|
|
@@ -1137,7 +1137,7 @@ function BagAnimation({
|
|
|
1137
1137
|
}
|
|
1138
1138
|
)
|
|
1139
1139
|
] }),
|
|
1140
|
-
|
|
1140
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
1141
1141
|
"img",
|
|
1142
1142
|
{
|
|
1143
1143
|
src: mysteryBoxImage,
|
package/dist/index.mjs
CHANGED
|
@@ -1018,7 +1018,7 @@ function BagAnimation({
|
|
|
1018
1018
|
showMask && /* @__PURE__ */ jsx(
|
|
1019
1019
|
"div",
|
|
1020
1020
|
{
|
|
1021
|
-
className: "fixed inset-0 z-[
|
|
1021
|
+
className: "fixed inset-0 z-[99]",
|
|
1022
1022
|
style: {
|
|
1023
1023
|
backgroundColor: `rgba(0, 0, 0, ${maskOpacity})`,
|
|
1024
1024
|
backdropFilter: `blur(${maskBlur}px)`,
|
|
@@ -1033,7 +1033,7 @@ function BagAnimation({
|
|
|
1033
1033
|
/* @__PURE__ */ jsx(
|
|
1034
1034
|
"div",
|
|
1035
1035
|
{
|
|
1036
|
-
className: "fixed inset-0 z-[
|
|
1036
|
+
className: "fixed inset-0 z-[100] flex items-center justify-center pointer-events-none",
|
|
1037
1037
|
style: { pointerEvents: "none" },
|
|
1038
1038
|
children: /* @__PURE__ */ jsxs(
|
|
1039
1039
|
"div",
|
|
@@ -1121,7 +1121,7 @@ function BagAnimation({
|
|
|
1121
1121
|
}
|
|
1122
1122
|
)
|
|
1123
1123
|
] }),
|
|
1124
|
-
|
|
1124
|
+
/* @__PURE__ */ jsx(
|
|
1125
1125
|
"img",
|
|
1126
1126
|
{
|
|
1127
1127
|
src: mysteryBoxImage,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chao-component/bag-animation-ui",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.10",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"module": "dist/index.mjs",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -24,7 +24,9 @@
|
|
|
24
24
|
},
|
|
25
25
|
"scripts": {
|
|
26
26
|
"build": "tsup",
|
|
27
|
-
"dev": "tsup --watch"
|
|
27
|
+
"dev": "tsup --watch",
|
|
28
|
+
"demo": "vite --config vite.config.demo.ts",
|
|
29
|
+
"demo:build": "vite build --config vite.config.demo.ts"
|
|
28
30
|
},
|
|
29
31
|
"keywords": [],
|
|
30
32
|
"author": "",
|
|
@@ -39,6 +41,13 @@
|
|
|
39
41
|
"@types/react": "^19.2.7",
|
|
40
42
|
"@types/react-dom": "^19.2.3",
|
|
41
43
|
"tsup": "^8.5.1",
|
|
42
|
-
"typescript": "^5.9.3"
|
|
44
|
+
"typescript": "^5.9.3",
|
|
45
|
+
"vite": "^5.0.0",
|
|
46
|
+
"@vitejs/plugin-react": "^4.2.0",
|
|
47
|
+
"react": "^19.2.3",
|
|
48
|
+
"react-dom": "^19.2.3",
|
|
49
|
+
"tailwindcss": "^3.4.0",
|
|
50
|
+
"postcss": "^8.4.0",
|
|
51
|
+
"autoprefixer": "^10.4.0"
|
|
43
52
|
}
|
|
44
53
|
}
|