@cntrl-site/sdk 1.23.2 → 1.24.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.
- package/dist/index.d.ts +1 -1
- package/dist/index.js +68 -23
- package/dist/index.mjs +68 -23
- package/dist/schemas/article/Article.schema.d.ts +4 -4
- package/dist/schemas/article/FillLayer.schema.d.ts +186 -0
- package/dist/schemas/article/FillLayer.schema.js +53 -0
- package/dist/schemas/article/Item.schema.d.ts +6 -6
- package/dist/schemas/article/Item.schema.js +5 -4
- package/dist/schemas/article/ItemArea.schema.d.ts +2 -2
- package/dist/schemas/article/ItemBase.schema.d.ts +4 -4
- package/dist/schemas/article/ItemState.schema.d.ts +2433 -231
- package/dist/schemas/article/ItemState.schema.js +4 -3
- package/dist/schemas/article/RichTextItem.schema.d.ts +16 -16
- package/dist/schemas/article/Section.schema.d.ts +2 -2
- package/dist/schemas/keyframe/Keyframes.schema.d.ts +1222 -186
- package/dist/schemas/keyframe/Keyframes.schema.js +11 -14
- package/dist/schemas/shared/FillLayer.schema.d.ts +186 -0
- package/dist/types/article/Item.d.ts +51 -3
- package/dist/types/article/ItemState.d.ts +4 -3
- package/dist/types/keyframe/Keyframe.d.ts +8 -11
- package/dist/types/keyframe/Keyframe.js +2 -2
- package/package.json +1 -1
|
@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.KeyframesSchema = exports.KeyframeSchema = void 0;
|
|
4
4
|
const Keyframe_1 = require("../../types/keyframe/Keyframe");
|
|
5
5
|
const zod_1 = require("zod");
|
|
6
|
+
const FillLayer_schema_1 = require("../article/FillLayer.schema");
|
|
6
7
|
const KeyframesBaseSchema = zod_1.z.object({
|
|
7
8
|
id: zod_1.z.string().min(1),
|
|
8
9
|
layoutId: zod_1.z.string().min(1),
|
|
@@ -41,17 +42,9 @@ const BorderWidthKeyframeSchema = KeyframesBaseSchema.extend({
|
|
|
41
42
|
borderWidth: zod_1.z.number().nonnegative()
|
|
42
43
|
})
|
|
43
44
|
});
|
|
44
|
-
const
|
|
45
|
-
type: zod_1.z.literal(Keyframe_1.KeyframeType.
|
|
46
|
-
value: zod_1.z.
|
|
47
|
-
color: zod_1.z.string()
|
|
48
|
-
})
|
|
49
|
-
});
|
|
50
|
-
const BorderColorKeyframeSchema = KeyframesBaseSchema.extend({
|
|
51
|
-
type: zod_1.z.literal(Keyframe_1.KeyframeType.BorderColor),
|
|
52
|
-
value: zod_1.z.object({
|
|
53
|
-
color: zod_1.z.string()
|
|
54
|
-
})
|
|
45
|
+
const BorderFillKeyframeSchema = KeyframesBaseSchema.extend({
|
|
46
|
+
type: zod_1.z.literal(Keyframe_1.KeyframeType.BorderFill),
|
|
47
|
+
value: zod_1.z.array(FillLayer_schema_1.FillLayerSchema)
|
|
55
48
|
});
|
|
56
49
|
const OpacityKeyframeSchema = KeyframesBaseSchema.extend({
|
|
57
50
|
type: zod_1.z.literal(Keyframe_1.KeyframeType.Opacity),
|
|
@@ -99,14 +92,17 @@ const FXParamsKeyframeSchema = KeyframesBaseSchema.extend({
|
|
|
99
92
|
type: zod_1.z.literal(Keyframe_1.KeyframeType.FXParams),
|
|
100
93
|
value: zod_1.z.record(zod_1.z.string(), zod_1.z.number())
|
|
101
94
|
});
|
|
95
|
+
const FillKeyframeSchema = KeyframesBaseSchema.extend({
|
|
96
|
+
type: zod_1.z.literal(Keyframe_1.KeyframeType.Fill),
|
|
97
|
+
value: zod_1.z.array(FillLayer_schema_1.FillLayerSchema)
|
|
98
|
+
});
|
|
102
99
|
exports.KeyframeSchema = zod_1.z.discriminatedUnion('type', [
|
|
103
100
|
DimensionsKeyframeSchema,
|
|
104
101
|
PositionKeyframeSchema,
|
|
105
102
|
RotationKeyframeSchema,
|
|
106
103
|
BorderRadiusKeyframeSchema,
|
|
107
104
|
BorderWidthKeyframeSchema,
|
|
108
|
-
|
|
109
|
-
BorderColorKeyframeSchema,
|
|
105
|
+
BorderFillKeyframeSchema,
|
|
110
106
|
OpacityKeyframeSchema,
|
|
111
107
|
ScaleKeyframeSchema,
|
|
112
108
|
BlurKeyframeSchema,
|
|
@@ -114,6 +110,7 @@ exports.KeyframeSchema = zod_1.z.discriminatedUnion('type', [
|
|
|
114
110
|
TextColorKeyframeSchema,
|
|
115
111
|
LetterSpacingKeyframeSchema,
|
|
116
112
|
WordSpacingKeyframeSchema,
|
|
117
|
-
FXParamsKeyframeSchema
|
|
113
|
+
FXParamsKeyframeSchema,
|
|
114
|
+
FillKeyframeSchema
|
|
118
115
|
]);
|
|
119
116
|
exports.KeyframesSchema = zod_1.z.array(exports.KeyframeSchema);
|
|
@@ -0,0 +1,186 @@
|
|
|
1
|
+
import { z } from 'zod';
|
|
2
|
+
export declare const ColorPointSchema: z.ZodObject<{
|
|
3
|
+
id: z.ZodString;
|
|
4
|
+
value: z.ZodString;
|
|
5
|
+
position: z.ZodNumber;
|
|
6
|
+
}, "strip", z.ZodTypeAny, {
|
|
7
|
+
position: number;
|
|
8
|
+
id: string;
|
|
9
|
+
value: string;
|
|
10
|
+
}, {
|
|
11
|
+
position: number;
|
|
12
|
+
id: string;
|
|
13
|
+
value: string;
|
|
14
|
+
}>;
|
|
15
|
+
export declare const FillLayerSchema: z.ZodDiscriminatedUnion<"type", [z.ZodObject<{
|
|
16
|
+
id: z.ZodString;
|
|
17
|
+
type: z.ZodLiteral<"solid">;
|
|
18
|
+
value: z.ZodString;
|
|
19
|
+
blendMode: z.ZodString;
|
|
20
|
+
}, "strip", z.ZodTypeAny, {
|
|
21
|
+
id: string;
|
|
22
|
+
value: string;
|
|
23
|
+
type: "solid";
|
|
24
|
+
blendMode: string;
|
|
25
|
+
}, {
|
|
26
|
+
id: string;
|
|
27
|
+
value: string;
|
|
28
|
+
type: "solid";
|
|
29
|
+
blendMode: string;
|
|
30
|
+
}>, z.ZodObject<{
|
|
31
|
+
id: z.ZodString;
|
|
32
|
+
type: z.ZodLiteral<"linear-gradient">;
|
|
33
|
+
colors: z.ZodArray<z.ZodObject<{
|
|
34
|
+
id: z.ZodString;
|
|
35
|
+
value: z.ZodString;
|
|
36
|
+
position: z.ZodNumber;
|
|
37
|
+
}, "strip", z.ZodTypeAny, {
|
|
38
|
+
position: number;
|
|
39
|
+
id: string;
|
|
40
|
+
value: string;
|
|
41
|
+
}, {
|
|
42
|
+
position: number;
|
|
43
|
+
id: string;
|
|
44
|
+
value: string;
|
|
45
|
+
}>, "many">;
|
|
46
|
+
start: z.ZodTuple<[z.ZodNumber, z.ZodNumber], null>;
|
|
47
|
+
end: z.ZodTuple<[z.ZodNumber, z.ZodNumber], null>;
|
|
48
|
+
angle: z.ZodNumber;
|
|
49
|
+
blendMode: z.ZodString;
|
|
50
|
+
}, "strip", z.ZodTypeAny, {
|
|
51
|
+
id: string;
|
|
52
|
+
type: "linear-gradient";
|
|
53
|
+
blendMode: string;
|
|
54
|
+
colors: {
|
|
55
|
+
position: number;
|
|
56
|
+
id: string;
|
|
57
|
+
value: string;
|
|
58
|
+
}[];
|
|
59
|
+
start: [number, number];
|
|
60
|
+
end: [number, number];
|
|
61
|
+
angle: number;
|
|
62
|
+
}, {
|
|
63
|
+
id: string;
|
|
64
|
+
type: "linear-gradient";
|
|
65
|
+
blendMode: string;
|
|
66
|
+
colors: {
|
|
67
|
+
position: number;
|
|
68
|
+
id: string;
|
|
69
|
+
value: string;
|
|
70
|
+
}[];
|
|
71
|
+
start: [number, number];
|
|
72
|
+
end: [number, number];
|
|
73
|
+
angle: number;
|
|
74
|
+
}>, z.ZodObject<{
|
|
75
|
+
id: z.ZodString;
|
|
76
|
+
type: z.ZodLiteral<"radial-gradient">;
|
|
77
|
+
colors: z.ZodArray<z.ZodObject<{
|
|
78
|
+
id: z.ZodString;
|
|
79
|
+
value: z.ZodString;
|
|
80
|
+
position: z.ZodNumber;
|
|
81
|
+
}, "strip", z.ZodTypeAny, {
|
|
82
|
+
position: number;
|
|
83
|
+
id: string;
|
|
84
|
+
value: string;
|
|
85
|
+
}, {
|
|
86
|
+
position: number;
|
|
87
|
+
id: string;
|
|
88
|
+
value: string;
|
|
89
|
+
}>, "many">;
|
|
90
|
+
center: z.ZodTuple<[z.ZodNumber, z.ZodNumber], null>;
|
|
91
|
+
diameter: z.ZodNumber;
|
|
92
|
+
angle: z.ZodNumber;
|
|
93
|
+
blendMode: z.ZodString;
|
|
94
|
+
}, "strip", z.ZodTypeAny, {
|
|
95
|
+
center: [number, number];
|
|
96
|
+
id: string;
|
|
97
|
+
type: "radial-gradient";
|
|
98
|
+
blendMode: string;
|
|
99
|
+
colors: {
|
|
100
|
+
position: number;
|
|
101
|
+
id: string;
|
|
102
|
+
value: string;
|
|
103
|
+
}[];
|
|
104
|
+
angle: number;
|
|
105
|
+
diameter: number;
|
|
106
|
+
}, {
|
|
107
|
+
center: [number, number];
|
|
108
|
+
id: string;
|
|
109
|
+
type: "radial-gradient";
|
|
110
|
+
blendMode: string;
|
|
111
|
+
colors: {
|
|
112
|
+
position: number;
|
|
113
|
+
id: string;
|
|
114
|
+
value: string;
|
|
115
|
+
}[];
|
|
116
|
+
angle: number;
|
|
117
|
+
diameter: number;
|
|
118
|
+
}>, z.ZodObject<{
|
|
119
|
+
id: z.ZodString;
|
|
120
|
+
type: z.ZodLiteral<"conic-gradient">;
|
|
121
|
+
colors: z.ZodArray<z.ZodObject<{
|
|
122
|
+
id: z.ZodString;
|
|
123
|
+
value: z.ZodString;
|
|
124
|
+
position: z.ZodNumber;
|
|
125
|
+
}, "strip", z.ZodTypeAny, {
|
|
126
|
+
position: number;
|
|
127
|
+
id: string;
|
|
128
|
+
value: string;
|
|
129
|
+
}, {
|
|
130
|
+
position: number;
|
|
131
|
+
id: string;
|
|
132
|
+
value: string;
|
|
133
|
+
}>, "many">;
|
|
134
|
+
center: z.ZodTuple<[z.ZodNumber, z.ZodNumber], null>;
|
|
135
|
+
angle: z.ZodNumber;
|
|
136
|
+
blendMode: z.ZodString;
|
|
137
|
+
}, "strip", z.ZodTypeAny, {
|
|
138
|
+
center: [number, number];
|
|
139
|
+
id: string;
|
|
140
|
+
type: "conic-gradient";
|
|
141
|
+
blendMode: string;
|
|
142
|
+
colors: {
|
|
143
|
+
position: number;
|
|
144
|
+
id: string;
|
|
145
|
+
value: string;
|
|
146
|
+
}[];
|
|
147
|
+
angle: number;
|
|
148
|
+
}, {
|
|
149
|
+
center: [number, number];
|
|
150
|
+
id: string;
|
|
151
|
+
type: "conic-gradient";
|
|
152
|
+
blendMode: string;
|
|
153
|
+
colors: {
|
|
154
|
+
position: number;
|
|
155
|
+
id: string;
|
|
156
|
+
value: string;
|
|
157
|
+
}[];
|
|
158
|
+
angle: number;
|
|
159
|
+
}>, z.ZodObject<{
|
|
160
|
+
id: z.ZodString;
|
|
161
|
+
type: z.ZodLiteral<"image">;
|
|
162
|
+
src: z.ZodString;
|
|
163
|
+
behavior: z.ZodString;
|
|
164
|
+
backgroundSize: z.ZodNumber;
|
|
165
|
+
opacity: z.ZodNumber;
|
|
166
|
+
blendMode: z.ZodString;
|
|
167
|
+
rotation: z.ZodOptional<z.ZodNumber>;
|
|
168
|
+
}, "strip", z.ZodTypeAny, {
|
|
169
|
+
opacity: number;
|
|
170
|
+
id: string;
|
|
171
|
+
type: "image";
|
|
172
|
+
blendMode: string;
|
|
173
|
+
src: string;
|
|
174
|
+
behavior: string;
|
|
175
|
+
backgroundSize: number;
|
|
176
|
+
rotation?: number | undefined;
|
|
177
|
+
}, {
|
|
178
|
+
opacity: number;
|
|
179
|
+
id: string;
|
|
180
|
+
type: "image";
|
|
181
|
+
blendMode: string;
|
|
182
|
+
src: string;
|
|
183
|
+
behavior: string;
|
|
184
|
+
backgroundSize: number;
|
|
185
|
+
rotation?: number | undefined;
|
|
186
|
+
}>]>;
|
|
@@ -94,7 +94,7 @@ interface MediaLayoutParams {
|
|
|
94
94
|
opacity: number;
|
|
95
95
|
radius: number;
|
|
96
96
|
strokeWidth: number;
|
|
97
|
-
|
|
97
|
+
strokeFill: FillLayer[];
|
|
98
98
|
blur: number;
|
|
99
99
|
isDraggable?: boolean;
|
|
100
100
|
}
|
|
@@ -163,13 +163,61 @@ interface RichTextLayoutParams {
|
|
|
163
163
|
interface RectangleLayoutParams {
|
|
164
164
|
radius: number;
|
|
165
165
|
strokeWidth: number;
|
|
166
|
-
|
|
167
|
-
|
|
166
|
+
fill: FillLayer[];
|
|
167
|
+
strokeFill: FillLayer[];
|
|
168
168
|
blur: number;
|
|
169
169
|
backdropBlur: number;
|
|
170
170
|
blurMode: 'default' | 'backdrop';
|
|
171
171
|
isDraggable?: boolean;
|
|
172
172
|
}
|
|
173
|
+
export type FillLayer = SolidFillLayer | LinearGradientFillLayer | RadialGradientFillLayer | ConicGradientFillLayer | ImageLayer;
|
|
174
|
+
type ColorPoint = {
|
|
175
|
+
id: string;
|
|
176
|
+
value: string;
|
|
177
|
+
position: number;
|
|
178
|
+
};
|
|
179
|
+
export type SolidFillLayer = {
|
|
180
|
+
id: string;
|
|
181
|
+
type: 'solid';
|
|
182
|
+
value: string;
|
|
183
|
+
blendMode: string;
|
|
184
|
+
};
|
|
185
|
+
export type LinearGradientFillLayer = {
|
|
186
|
+
id: string;
|
|
187
|
+
type: 'linear-gradient';
|
|
188
|
+
colors: ColorPoint[];
|
|
189
|
+
start: [number, number];
|
|
190
|
+
end: [number, number];
|
|
191
|
+
angle: number;
|
|
192
|
+
blendMode: string;
|
|
193
|
+
};
|
|
194
|
+
export type RadialGradientFillLayer = {
|
|
195
|
+
id: string;
|
|
196
|
+
type: 'radial-gradient';
|
|
197
|
+
colors: ColorPoint[];
|
|
198
|
+
diameter: number;
|
|
199
|
+
center: [number, number];
|
|
200
|
+
angle: number;
|
|
201
|
+
blendMode: string;
|
|
202
|
+
};
|
|
203
|
+
export type ConicGradientFillLayer = {
|
|
204
|
+
id: string;
|
|
205
|
+
type: 'conic-gradient';
|
|
206
|
+
colors: ColorPoint[];
|
|
207
|
+
center: [number, number];
|
|
208
|
+
angle: number;
|
|
209
|
+
blendMode: string;
|
|
210
|
+
};
|
|
211
|
+
export type ImageLayer = {
|
|
212
|
+
id: string;
|
|
213
|
+
type: 'image';
|
|
214
|
+
src: string;
|
|
215
|
+
behavior: string;
|
|
216
|
+
backgroundSize: number;
|
|
217
|
+
opacity: number;
|
|
218
|
+
blendMode: string;
|
|
219
|
+
rotation?: number;
|
|
220
|
+
};
|
|
173
221
|
export interface ScrollPlaybackParams {
|
|
174
222
|
from: number;
|
|
175
223
|
to: number;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { ArticleItemType } from './ArticleItemType';
|
|
2
|
+
import { FillLayer } from './Item';
|
|
2
3
|
type StateId = string;
|
|
3
4
|
export type ItemState<T extends ArticleItemType> = Record<StateId, ItemStatesMap[T]>;
|
|
4
5
|
export type ItemStateParams = ItemStatesMap[ArticleItemType];
|
|
@@ -41,7 +42,7 @@ export interface MediaStateParams extends ItemStatesBaseMap {
|
|
|
41
42
|
opacity?: StateParams<number>;
|
|
42
43
|
radius?: StateParams<number>;
|
|
43
44
|
strokeWidth?: StateParams<number>;
|
|
44
|
-
|
|
45
|
+
strokeFill?: StateParams<FillLayer[]>;
|
|
45
46
|
}
|
|
46
47
|
export interface RichTextStateParams extends ItemStatesBaseMap {
|
|
47
48
|
color?: StateParams<string>;
|
|
@@ -51,8 +52,8 @@ export interface RichTextStateParams extends ItemStatesBaseMap {
|
|
|
51
52
|
export interface RectangleStateParams extends ItemStatesBaseMap {
|
|
52
53
|
radius?: StateParams<number>;
|
|
53
54
|
strokeWidth?: StateParams<number>;
|
|
54
|
-
|
|
55
|
-
|
|
55
|
+
fill?: StateParams<FillLayer[]>;
|
|
56
|
+
strokeFill?: StateParams<FillLayer[]>;
|
|
56
57
|
backdropBlur?: StateParams<number>;
|
|
57
58
|
}
|
|
58
59
|
export interface VideoEmbedStateParams extends ItemStatesBaseMap {
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { FillLayer } from '../article/Item';
|
|
1
2
|
export type KeyframeAny = Keyframe<KeyframeType>;
|
|
2
3
|
export interface Keyframe<T extends KeyframeType> {
|
|
3
4
|
id: string;
|
|
@@ -13,8 +14,6 @@ export declare enum KeyframeType {
|
|
|
13
14
|
Rotation = "rotation",
|
|
14
15
|
BorderRadius = "border-radius",
|
|
15
16
|
BorderWidth = "border-width",
|
|
16
|
-
Color = "color",
|
|
17
|
-
BorderColor = "border-color",
|
|
18
17
|
Opacity = "opacity",
|
|
19
18
|
Scale = "scale",
|
|
20
19
|
TextColor = "text-color",
|
|
@@ -22,7 +21,9 @@ export declare enum KeyframeType {
|
|
|
22
21
|
WordSpacing = "word-spacing",
|
|
23
22
|
Blur = "blur",
|
|
24
23
|
BackdropBlur = "backdrop-blur",
|
|
25
|
-
FXParams = "fx-params"
|
|
24
|
+
FXParams = "fx-params",
|
|
25
|
+
BorderFill = "border-fill",
|
|
26
|
+
Fill = "fill"
|
|
26
27
|
}
|
|
27
28
|
export interface KeyframeValueMap {
|
|
28
29
|
[KeyframeType.Dimensions]: DimensionsValue;
|
|
@@ -30,8 +31,6 @@ export interface KeyframeValueMap {
|
|
|
30
31
|
[KeyframeType.Rotation]: RotationValue;
|
|
31
32
|
[KeyframeType.BorderRadius]: BorderRadiusValue;
|
|
32
33
|
[KeyframeType.BorderWidth]: BorderWidthValue;
|
|
33
|
-
[KeyframeType.Color]: ColorValue;
|
|
34
|
-
[KeyframeType.BorderColor]: BorderColorValue;
|
|
35
34
|
[KeyframeType.Opacity]: OpacityValue;
|
|
36
35
|
[KeyframeType.Scale]: ScaleValue;
|
|
37
36
|
[KeyframeType.Blur]: BlurValue;
|
|
@@ -40,6 +39,8 @@ export interface KeyframeValueMap {
|
|
|
40
39
|
[KeyframeType.LetterSpacing]: LetterSpacingValue;
|
|
41
40
|
[KeyframeType.WordSpacing]: WordSpacingValue;
|
|
42
41
|
[KeyframeType.FXParams]: FXParamsValue;
|
|
42
|
+
[KeyframeType.BorderFill]: BorderFillValue;
|
|
43
|
+
[KeyframeType.Fill]: FillValue;
|
|
43
44
|
}
|
|
44
45
|
interface DimensionsValue {
|
|
45
46
|
width: number;
|
|
@@ -58,12 +59,6 @@ interface BorderRadiusValue {
|
|
|
58
59
|
interface BorderWidthValue {
|
|
59
60
|
borderWidth: number;
|
|
60
61
|
}
|
|
61
|
-
interface ColorValue {
|
|
62
|
-
color: string;
|
|
63
|
-
}
|
|
64
|
-
interface BorderColorValue {
|
|
65
|
-
color: string;
|
|
66
|
-
}
|
|
67
62
|
interface OpacityValue {
|
|
68
63
|
opacity: number;
|
|
69
64
|
}
|
|
@@ -85,5 +80,7 @@ interface LetterSpacingValue {
|
|
|
85
80
|
interface WordSpacingValue {
|
|
86
81
|
wordSpacing: number;
|
|
87
82
|
}
|
|
83
|
+
type BorderFillValue = FillLayer[];
|
|
88
84
|
type FXParamsValue = Record<string, number>;
|
|
85
|
+
type FillValue = FillLayer[];
|
|
89
86
|
export {};
|
|
@@ -8,8 +8,6 @@ var KeyframeType;
|
|
|
8
8
|
KeyframeType["Rotation"] = "rotation";
|
|
9
9
|
KeyframeType["BorderRadius"] = "border-radius";
|
|
10
10
|
KeyframeType["BorderWidth"] = "border-width";
|
|
11
|
-
KeyframeType["Color"] = "color";
|
|
12
|
-
KeyframeType["BorderColor"] = "border-color";
|
|
13
11
|
KeyframeType["Opacity"] = "opacity";
|
|
14
12
|
KeyframeType["Scale"] = "scale";
|
|
15
13
|
KeyframeType["TextColor"] = "text-color";
|
|
@@ -18,4 +16,6 @@ var KeyframeType;
|
|
|
18
16
|
KeyframeType["Blur"] = "blur";
|
|
19
17
|
KeyframeType["BackdropBlur"] = "backdrop-blur";
|
|
20
18
|
KeyframeType["FXParams"] = "fx-params";
|
|
19
|
+
KeyframeType["BorderFill"] = "border-fill";
|
|
20
|
+
KeyframeType["Fill"] = "fill";
|
|
21
21
|
})(KeyframeType || (exports.KeyframeType = KeyframeType = {}));
|