@webstudio-is/sdk-components-animation 0.203.0 → 0.204.0
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.
|
@@ -25,7 +25,7 @@ type KeyframeEffectOptions = {
|
|
|
25
25
|
* - "start" → `calc(0% + range)`
|
|
26
26
|
* - "end" → `calc(100% - range)`
|
|
27
27
|
*/
|
|
28
|
-
type ScrollNamedRange = "start" | "end";
|
|
28
|
+
export type ScrollNamedRange = "start" | "end";
|
|
29
29
|
/**
|
|
30
30
|
* Scroll does not support https://drafts.csswg.org/scroll-animations/#named-ranges
|
|
31
31
|
* However, for simplicity and type unification with the view, we will use the names "start" and "end,"
|
|
@@ -36,14 +36,30 @@ type ScrollRangeOptions = {
|
|
|
36
36
|
rangeStart?: ScrollRangeValue | undefined;
|
|
37
37
|
rangeEnd?: ScrollRangeValue | undefined;
|
|
38
38
|
};
|
|
39
|
+
type AnimationAxis = "block" | "inline" | "x" | "y";
|
|
39
40
|
type ScrollAction = {
|
|
40
41
|
type: "scroll";
|
|
41
42
|
source?: "closest" | "nearest" | "root";
|
|
42
|
-
axis?:
|
|
43
|
+
axis?: AnimationAxis;
|
|
43
44
|
animations: {
|
|
44
45
|
timing: KeyframeEffectOptions & ScrollRangeOptions;
|
|
45
46
|
keyframes: AnimationKeyframe[];
|
|
46
47
|
}[];
|
|
47
48
|
};
|
|
48
|
-
export type
|
|
49
|
+
export type ViewNamedRange = "contain" | "cover" | "entry" | "exit" | "entry-crossing" | "exit-crossing";
|
|
50
|
+
export type ViewRangeValue = [name: ViewNamedRange, value: RangeUnitValue];
|
|
51
|
+
type ViewRangeOptions = {
|
|
52
|
+
rangeStart?: ViewRangeValue | undefined;
|
|
53
|
+
rangeEnd?: ViewRangeValue | undefined;
|
|
54
|
+
};
|
|
55
|
+
type ViewAction = {
|
|
56
|
+
type: "view";
|
|
57
|
+
subject?: string;
|
|
58
|
+
axis?: AnimationAxis;
|
|
59
|
+
animations: {
|
|
60
|
+
timing: KeyframeEffectOptions & ViewRangeOptions;
|
|
61
|
+
keyframes: AnimationKeyframe[];
|
|
62
|
+
}[];
|
|
63
|
+
};
|
|
64
|
+
export type AnimationAction = ScrollAction | ViewAction;
|
|
49
65
|
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webstudio-is/sdk-components-animation",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.204.0",
|
|
4
4
|
"description": "Webstudio components for animation",
|
|
5
5
|
"author": "Webstudio <github@webstudio.is>",
|
|
6
6
|
"homepage": "https://webstudio.is",
|
|
@@ -47,30 +47,35 @@
|
|
|
47
47
|
"dependencies": {
|
|
48
48
|
"react-error-boundary": "^5.0.0",
|
|
49
49
|
"scroll-timeline-polyfill": "^1.1.0",
|
|
50
|
-
"@webstudio-is/
|
|
51
|
-
"@webstudio-is/
|
|
52
|
-
"@webstudio-is/
|
|
53
|
-
"@webstudio-is/sdk": "0.
|
|
50
|
+
"@webstudio-is/icons": "0.204.0",
|
|
51
|
+
"@webstudio-is/react-sdk": "0.204.0",
|
|
52
|
+
"@webstudio-is/css-engine": "0.204.0",
|
|
53
|
+
"@webstudio-is/sdk": "0.204.0"
|
|
54
54
|
},
|
|
55
55
|
"devDependencies": {
|
|
56
56
|
"@types/react": "^18.2.70",
|
|
57
57
|
"@types/react-dom": "^18.2.25",
|
|
58
|
+
"@vitest/browser": "^3.0.4",
|
|
59
|
+
"playwright": "^1.50.1",
|
|
58
60
|
"react": "18.3.0-canary-14898b6a9-20240318",
|
|
59
61
|
"react-dom": "18.3.0-canary-14898b6a9-20240318",
|
|
60
62
|
"type-fest": "^4.32.0",
|
|
63
|
+
"vitest": "^3.0.4",
|
|
64
|
+
"@webstudio-is/css-data": "0.0.0",
|
|
61
65
|
"@webstudio-is/generate-arg-types": "0.0.0",
|
|
62
|
-
"@webstudio-is/sdk-components-react": "0.203.0",
|
|
63
66
|
"@webstudio-is/sdk-cli": "^0.94.0",
|
|
64
|
-
"@webstudio-is/
|
|
67
|
+
"@webstudio-is/design-system": "0.0.0",
|
|
68
|
+
"@webstudio-is/sdk-components-react": "0.204.0",
|
|
65
69
|
"@webstudio-is/tsconfig": "1.0.7",
|
|
66
|
-
"@webstudio-is/
|
|
67
|
-
"@webstudio-is/design-system": "0.0.0"
|
|
70
|
+
"@webstudio-is/template": "0.204.0"
|
|
68
71
|
},
|
|
69
72
|
"scripts": {
|
|
70
73
|
"build": "vite build --config ../../vite.sdk-components.config.ts",
|
|
71
74
|
"build:args": "NODE_OPTIONS=--conditions=webstudio generate-arg-types './src/*.tsx !./src/*.stories.tsx !./src/*.ws.ts !./src/*.template.tsx !./src/*.test.{ts,tsx}' -e asChild -e modal -e defaultOpen -e defaultChecked && prettier --write \"**/*.props.ts\"",
|
|
72
75
|
"build:stories": "webstudio-sdk generate-stories && prettier --write \"src/__generated__/*.stories.tsx\"",
|
|
73
76
|
"dts": "tsc --project tsconfig.dts.json",
|
|
74
|
-
"typecheck": "tsc"
|
|
77
|
+
"typecheck": "tsc",
|
|
78
|
+
"test": "vitest run",
|
|
79
|
+
"playwright-init": "playwright install --with-deps"
|
|
75
80
|
}
|
|
76
81
|
}
|