autosuspense 0.1.6 → 0.1.8
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/dist/components/prefabs/prebuilt/Block.css +42 -0
- package/dist/components/prefabs/prebuilt/Card.css +45 -0
- package/dist/components/prefabs/prebuilt/List.css +48 -0
- package/dist/hooks/useSuspenseFallback.d.ts +2 -2
- package/dist/hooks/useSuspenseFallback.d.ts.map +1 -1
- package/package.json +3 -2
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
.as-block {
|
|
2
|
+
width: 100%;
|
|
3
|
+
min-height: var(--as-block-min-height, 96px);
|
|
4
|
+
border-radius: var(--as-block-radius, 12px);
|
|
5
|
+
box-sizing: border-box;
|
|
6
|
+
|
|
7
|
+
background: var(
|
|
8
|
+
--as-block-bg,
|
|
9
|
+
linear-gradient(
|
|
10
|
+
90deg,
|
|
11
|
+
var(--as-skeleton-base, #ececec) 25%,
|
|
12
|
+
var(--as-skeleton-highlight, #f5f5f5) 37%,
|
|
13
|
+
var(--as-skeleton-base, #ececec) 63%
|
|
14
|
+
)
|
|
15
|
+
);
|
|
16
|
+
|
|
17
|
+
background-size: 400% 100%;
|
|
18
|
+
animation:
|
|
19
|
+
as-shimmer 1.4s ease infinite,
|
|
20
|
+
as-pulse 2s ease-in-out infinite;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
@keyframes as-shimmer {
|
|
24
|
+
0% {
|
|
25
|
+
background-position: 100% 0;
|
|
26
|
+
}
|
|
27
|
+
100% {
|
|
28
|
+
background-position: 0 0;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
@keyframes as-pulse {
|
|
33
|
+
0% {
|
|
34
|
+
opacity: 1;
|
|
35
|
+
}
|
|
36
|
+
50% {
|
|
37
|
+
opacity: 0.85;
|
|
38
|
+
}
|
|
39
|
+
100% {
|
|
40
|
+
opacity: 1;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
.as-card {
|
|
2
|
+
width: 100%;
|
|
3
|
+
min-height: var(--as-card-min-height, 120px);
|
|
4
|
+
padding: var(--as-card-padding, 16px);
|
|
5
|
+
box-sizing: border-box;
|
|
6
|
+
|
|
7
|
+
border-radius: var(--as-card-radius, 12px);
|
|
8
|
+
|
|
9
|
+
background: var(
|
|
10
|
+
--as-card-bg,
|
|
11
|
+
linear-gradient(
|
|
12
|
+
90deg,
|
|
13
|
+
var(--as-skeleton-base, #ececec) 25%,
|
|
14
|
+
var(--as-skeleton-highlight, #f5f5f5) 37%,
|
|
15
|
+
var(--as-skeleton-base, #ececec) 63%
|
|
16
|
+
)
|
|
17
|
+
);
|
|
18
|
+
|
|
19
|
+
background-size: 400% 100%;
|
|
20
|
+
animation:
|
|
21
|
+
as-shimmer 1.4s ease infinite,
|
|
22
|
+
as-pulse 2s ease-in-out infinite;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
/* reuse same animations */
|
|
26
|
+
@keyframes as-shimmer {
|
|
27
|
+
0% {
|
|
28
|
+
background-position: 100% 0;
|
|
29
|
+
}
|
|
30
|
+
100% {
|
|
31
|
+
background-position: 0 0;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
@keyframes as-pulse {
|
|
36
|
+
0% {
|
|
37
|
+
opacity: 1;
|
|
38
|
+
}
|
|
39
|
+
50% {
|
|
40
|
+
opacity: 0.85;
|
|
41
|
+
}
|
|
42
|
+
100% {
|
|
43
|
+
opacity: 1;
|
|
44
|
+
}
|
|
45
|
+
}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
.as-list {
|
|
2
|
+
width: 100%;
|
|
3
|
+
min-height: var(--as-list-min-height, 160px);
|
|
4
|
+
padding: var(--as-list-padding, 12px);
|
|
5
|
+
box-sizing: border-box;
|
|
6
|
+
|
|
7
|
+
border-radius: var(--as-list-radius, 8px);
|
|
8
|
+
|
|
9
|
+
display: flex;
|
|
10
|
+
flex-direction: column;
|
|
11
|
+
gap: var(--as-list-gap, 12px);
|
|
12
|
+
|
|
13
|
+
background: var(
|
|
14
|
+
--as-list-bg,
|
|
15
|
+
linear-gradient(
|
|
16
|
+
90deg,
|
|
17
|
+
var(--as-skeleton-base, #ececec) 25%,
|
|
18
|
+
var(--as-skeleton-highlight, #f5f5f5) 37%,
|
|
19
|
+
var(--as-skeleton-base, #ececec) 63%
|
|
20
|
+
)
|
|
21
|
+
);
|
|
22
|
+
|
|
23
|
+
background-size: 400% 100%;
|
|
24
|
+
animation:
|
|
25
|
+
as-shimmer 1.4s ease infinite,
|
|
26
|
+
as-pulse 2s ease-in-out infinite;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
@keyframes as-shimmer {
|
|
30
|
+
0% {
|
|
31
|
+
background-position: 100% 0;
|
|
32
|
+
}
|
|
33
|
+
100% {
|
|
34
|
+
background-position: 0 0;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
@keyframes as-pulse {
|
|
39
|
+
0% {
|
|
40
|
+
opacity: 1;
|
|
41
|
+
}
|
|
42
|
+
50% {
|
|
43
|
+
opacity: 0.85;
|
|
44
|
+
}
|
|
45
|
+
100% {
|
|
46
|
+
opacity: 1;
|
|
47
|
+
}
|
|
48
|
+
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export declare function useSuspenseFallback(element:
|
|
1
|
+
import { FallbackDescriptor } from "../types/FallbackRegistry";
|
|
2
|
+
export declare function useSuspenseFallback(element: FallbackDescriptor): void;
|
|
3
3
|
//# sourceMappingURL=useSuspenseFallback.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSuspenseFallback.d.ts","sourceRoot":"","sources":["../../src/hooks/useSuspenseFallback.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useSuspenseFallback.d.ts","sourceRoot":"","sources":["../../src/hooks/useSuspenseFallback.ts"],"names":[],"mappings":"AACA,OAAO,EAAmB,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAGhF,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,kBAAkB,GAAG,IAAI,CAgBrE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "autosuspense",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.8",
|
|
4
4
|
"description": "Automatic suspense wiring block for React.",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"type": "commonjs",
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"typescript"
|
|
25
25
|
],
|
|
26
26
|
"scripts": {
|
|
27
|
-
"build": "tsc -
|
|
27
|
+
"build": "tsc && copyfiles -u 1 \"src/**/*.css\" dist",
|
|
28
28
|
"test:build": "node dist/index.js"
|
|
29
29
|
},
|
|
30
30
|
"peerDependencies": {
|
|
@@ -34,6 +34,7 @@
|
|
|
34
34
|
"devDependencies": {
|
|
35
35
|
"@types/react": "^16.14.68",
|
|
36
36
|
"@types/react-dom": "^16.9.25",
|
|
37
|
+
"copyfiles": "^2.4.1",
|
|
37
38
|
"react": "^16.8.0",
|
|
38
39
|
"react-dom": "^16.8.0",
|
|
39
40
|
"typescript": "^5.3.0"
|