@cntrl-site/sdk 1.21.0-alpha.8 → 1.21.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/Components/ControlSlider/ControlSlider.d.ts +22 -22
- package/dist/Components/ControlSlider/ControlSliderComponent.d.ts +9 -4
- package/dist/index.js +54 -36
- package/dist/index.mjs +54 -36
- package/dist/schemas/article/Article.schema.d.ts +7 -0
- package/dist/schemas/article/Section.schema.d.ts +5 -0
- package/dist/schemas/article/Section.schema.js +1 -0
- package/dist/sdk.css +1 -1
- package/dist/types/article/Section.d.ts +1 -0
- package/package.json +1 -5
|
@@ -1,54 +1,61 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
-
interface
|
|
2
|
+
interface SliderProps {
|
|
3
|
+
settings: SliderSettings;
|
|
4
|
+
content: SliderItem[];
|
|
5
|
+
styles: SliderStyles;
|
|
6
|
+
isEditor?: boolean;
|
|
7
|
+
}
|
|
8
|
+
export declare function ControlSlider({ settings, content, styles: sliderStyles, isEditor }: SliderProps): React.JSX.Element;
|
|
9
|
+
type SliderItem = {
|
|
3
10
|
image: {
|
|
4
11
|
url: string;
|
|
5
12
|
name?: string;
|
|
6
13
|
};
|
|
7
14
|
imageCaption: any[];
|
|
8
|
-
}
|
|
15
|
+
};
|
|
9
16
|
type Offset = {
|
|
10
17
|
x: number;
|
|
11
18
|
y: number;
|
|
12
19
|
};
|
|
13
|
-
|
|
20
|
+
type SliderControls = {
|
|
14
21
|
arrowsImgUrl: string | null;
|
|
15
22
|
isActive: boolean;
|
|
16
23
|
color: string;
|
|
17
24
|
hover: string;
|
|
18
25
|
offset: Offset;
|
|
19
26
|
scale: number;
|
|
20
|
-
}
|
|
21
|
-
|
|
27
|
+
};
|
|
28
|
+
type SliderPagination = {
|
|
22
29
|
position: 'outside-1' | 'outside-2' | 'inside-1' | 'inside-2';
|
|
23
30
|
isActive: boolean;
|
|
24
31
|
scale: number;
|
|
25
32
|
offset: Offset;
|
|
26
33
|
colors: string[];
|
|
27
34
|
hover: string;
|
|
28
|
-
}
|
|
35
|
+
};
|
|
29
36
|
type Alignment = 'top-left' | 'top-center' | 'top-right' | 'middle-left' | 'middle-center' | 'middle-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
|
|
30
|
-
|
|
37
|
+
type SliderCaption = {
|
|
31
38
|
alignment: Alignment;
|
|
32
39
|
isActive: boolean;
|
|
33
40
|
color: string;
|
|
34
41
|
offset: Offset;
|
|
35
42
|
hover: string;
|
|
36
|
-
}
|
|
43
|
+
};
|
|
37
44
|
type Triggers = {
|
|
38
45
|
triggersList: {
|
|
39
46
|
click: boolean;
|
|
40
47
|
drag: boolean;
|
|
41
|
-
auto: boolean;
|
|
42
48
|
};
|
|
49
|
+
autoPlay: string | null;
|
|
43
50
|
};
|
|
44
|
-
|
|
51
|
+
type SliderSettings = {
|
|
45
52
|
controls: SliderControls;
|
|
46
53
|
pagination: SliderPagination;
|
|
47
54
|
direction: 'horizontal' | 'vertical';
|
|
48
55
|
caption: SliderCaption;
|
|
49
56
|
triggers: Triggers;
|
|
50
|
-
}
|
|
51
|
-
|
|
57
|
+
};
|
|
58
|
+
type CaptionStyles = {
|
|
52
59
|
fontSettings: {
|
|
53
60
|
fontFamily: string;
|
|
54
61
|
fontWeight: number;
|
|
@@ -71,15 +78,8 @@ interface CaptionStyles {
|
|
|
71
78
|
fontVariant: 'normal' | 'small-caps';
|
|
72
79
|
};
|
|
73
80
|
color: string;
|
|
74
|
-
}
|
|
75
|
-
|
|
81
|
+
};
|
|
82
|
+
type SliderStyles = {
|
|
76
83
|
caption: CaptionStyles;
|
|
77
|
-
}
|
|
78
|
-
interface SliderProps {
|
|
79
|
-
settings: SliderSettings;
|
|
80
|
-
content: SliderItem[];
|
|
81
|
-
styles: SliderStyles;
|
|
82
|
-
isEditor?: boolean;
|
|
83
|
-
}
|
|
84
|
-
export declare function ControlSlider({ settings, content, styles: sliderStyles, isEditor }: SliderProps): React.JSX.Element;
|
|
84
|
+
};
|
|
85
85
|
export {};
|
|
@@ -31,11 +31,16 @@ export declare const ControlSliderComponent: {
|
|
|
31
31
|
drag: {
|
|
32
32
|
type: string;
|
|
33
33
|
};
|
|
34
|
-
auto: {
|
|
35
|
-
type: string;
|
|
36
|
-
};
|
|
37
34
|
};
|
|
38
35
|
};
|
|
36
|
+
autoPlay: {
|
|
37
|
+
type: string[];
|
|
38
|
+
label: string;
|
|
39
|
+
display: {
|
|
40
|
+
type: string;
|
|
41
|
+
};
|
|
42
|
+
enum: (string | null)[];
|
|
43
|
+
};
|
|
39
44
|
};
|
|
40
45
|
};
|
|
41
46
|
direction: {
|
|
@@ -218,8 +223,8 @@ export declare const ControlSliderComponent: {
|
|
|
218
223
|
triggersList: {
|
|
219
224
|
click: boolean;
|
|
220
225
|
drag: boolean;
|
|
221
|
-
auto: boolean;
|
|
222
226
|
};
|
|
227
|
+
autoPlay: null;
|
|
223
228
|
};
|
|
224
229
|
controls: {
|
|
225
230
|
isActive: boolean;
|
package/dist/index.js
CHANGED
|
@@ -532,7 +532,8 @@ const SectionSchema = zod.z.object({
|
|
|
532
532
|
media: zod.z.record(zod.z.object({
|
|
533
533
|
url: zod.z.string(),
|
|
534
534
|
size: zod.z.string(),
|
|
535
|
-
position: zod.z.string()
|
|
535
|
+
position: zod.z.string(),
|
|
536
|
+
offsetX: zod.z.number().nullable()
|
|
536
537
|
})).optional()
|
|
537
538
|
});
|
|
538
539
|
const TriggerSchema = zod.z.object({
|
|
@@ -1311,17 +1312,17 @@ const RichTextRenderer = ({ content }) => {
|
|
|
1311
1312
|
}) });
|
|
1312
1313
|
};
|
|
1313
1314
|
function getLeafCss(leaf) {
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
1315
|
+
return {
|
|
1316
|
+
...leaf.fontWeight && { fontWeight: leaf.fontWeight },
|
|
1317
|
+
...leaf.fontStyle && { fontStyle: leaf.fontStyle },
|
|
1318
|
+
...leaf.textDecoration && { textDecoration: leaf.textDecoration },
|
|
1319
|
+
...leaf.textTransform && { textTransform: leaf.textTransform },
|
|
1320
|
+
...leaf.fontVariant && { fontVariant: leaf.fontVariant },
|
|
1321
|
+
...leaf.verticalAlign && {
|
|
1322
|
+
verticalAlign: leaf.verticalAlign,
|
|
1323
|
+
lineHeight: "0px"
|
|
1324
|
+
}
|
|
1325
|
+
};
|
|
1325
1326
|
}
|
|
1326
1327
|
function scalingValue(value, isEditor = false) {
|
|
1327
1328
|
return isEditor ? `calc(var(--cntrl-article-width) * ${value})` : `${value * 100}vw`;
|
|
@@ -1405,12 +1406,14 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
|
|
|
1405
1406
|
children: content.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
1406
1407
|
"div",
|
|
1407
1408
|
{
|
|
1408
|
-
className: cn(styles$2.captionText, alignmentClassName[settings.caption.alignment], {
|
|
1409
|
+
className: cn(styles$2.captionText, alignmentClassName[settings.caption.alignment], {
|
|
1410
|
+
[styles$2.withPointerEvents]: index === currentSlideIndex && isEditor
|
|
1411
|
+
}),
|
|
1409
1412
|
style: {
|
|
1410
1413
|
fontFamily: fontSettings.fontFamily,
|
|
1411
1414
|
fontWeight: fontSettings.fontWeight,
|
|
1412
1415
|
fontStyle: fontSettings.fontStyle,
|
|
1413
|
-
width: widthSettings.sizing === "auto" ? "max-content" : widthSettings.width,
|
|
1416
|
+
width: widthSettings.sizing === "auto" ? "max-content" : scalingValue(widthSettings.width, isEditor),
|
|
1414
1417
|
letterSpacing: scalingValue(letterSpacing, isEditor),
|
|
1415
1418
|
wordSpacing: scalingValue(wordSpacing, isEditor),
|
|
1416
1419
|
textAlign,
|
|
@@ -1452,9 +1455,13 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
|
|
|
1452
1455
|
ref: setSliderRef,
|
|
1453
1456
|
options: {
|
|
1454
1457
|
arrows: false,
|
|
1455
|
-
autoplay: isEditor ? false : settings.triggers.
|
|
1458
|
+
autoplay: isEditor ? false : settings.triggers.autoPlay !== null,
|
|
1459
|
+
...settings.triggers.autoPlay !== null && {
|
|
1460
|
+
interval: parseInt(settings.triggers.autoPlay) * 1e3
|
|
1461
|
+
},
|
|
1456
1462
|
direction: direction === "horizontal" ? "ltr" : "ttb",
|
|
1457
1463
|
pagination: false,
|
|
1464
|
+
drag: settings.triggers.triggersList.drag,
|
|
1458
1465
|
perPage: 1,
|
|
1459
1466
|
width: sliderDimensions ? sliderDimensions == null ? void 0 : sliderDimensions.width : "100%",
|
|
1460
1467
|
height: sliderDimensions ? sliderDimensions == null ? void 0 : sliderDimensions.height : "100%",
|
|
@@ -1500,7 +1507,15 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
|
|
|
1500
1507
|
transform: `translate(${scalingValue(controlsOffsetX, isEditor)}, ${scalingValue(controlsOffsetY * (direction === "horizontal" ? 1 : -1), isEditor)}) scale(${settings.controls.scale / 100}) rotate(${direction === "horizontal" ? "180deg" : "-90deg"})`
|
|
1501
1508
|
},
|
|
1502
1509
|
children: [
|
|
1503
|
-
settings.controls.arrowsImgUrl && /* @__PURE__ */ jsxRuntime.jsx(
|
|
1510
|
+
settings.controls.arrowsImgUrl && /* @__PURE__ */ jsxRuntime.jsx(
|
|
1511
|
+
SvgImage,
|
|
1512
|
+
{
|
|
1513
|
+
url: settings.controls.arrowsImgUrl,
|
|
1514
|
+
fill: settings.controls.color,
|
|
1515
|
+
hoverFill: settings.controls.hover,
|
|
1516
|
+
className: styles$2.arrowImg
|
|
1517
|
+
}
|
|
1518
|
+
),
|
|
1504
1519
|
!settings.controls.arrowsImgUrl && /* @__PURE__ */ jsxRuntime.jsx(ArrowIcon, { color: settings.controls.color, className: cn(styles$2.arrowIcon, styles$2.arrowImg) })
|
|
1505
1520
|
]
|
|
1506
1521
|
}
|
|
@@ -1526,7 +1541,15 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
|
|
|
1526
1541
|
transform: `translate(${scalingValue(controlsOffsetX * (direction === "horizontal" ? -1 : 1), isEditor)}, ${scalingValue(controlsOffsetY, isEditor)}) scale(${settings.controls.scale / 100}) rotate(${direction === "horizontal" ? "0deg" : "90deg"})`
|
|
1527
1542
|
},
|
|
1528
1543
|
children: [
|
|
1529
|
-
settings.controls.arrowsImgUrl && /* @__PURE__ */ jsxRuntime.jsx(
|
|
1544
|
+
settings.controls.arrowsImgUrl && /* @__PURE__ */ jsxRuntime.jsx(
|
|
1545
|
+
SvgImage,
|
|
1546
|
+
{
|
|
1547
|
+
url: settings.controls.arrowsImgUrl,
|
|
1548
|
+
fill: settings.controls.color,
|
|
1549
|
+
hoverFill: settings.controls.hover,
|
|
1550
|
+
className: styles$2.arrowImg
|
|
1551
|
+
}
|
|
1552
|
+
),
|
|
1530
1553
|
!settings.controls.arrowsImgUrl && /* @__PURE__ */ jsxRuntime.jsx(ArrowIcon, { color: settings.controls.color, className: cn(styles$2.arrowIcon, styles$2.arrowImg) })
|
|
1531
1554
|
]
|
|
1532
1555
|
}
|
|
@@ -1623,7 +1646,7 @@ const ControlSliderComponent = {
|
|
|
1623
1646
|
triggersList: {
|
|
1624
1647
|
type: "object",
|
|
1625
1648
|
display: {
|
|
1626
|
-
type: "
|
|
1649
|
+
type: "toggle-ratio-group"
|
|
1627
1650
|
},
|
|
1628
1651
|
properties: {
|
|
1629
1652
|
click: {
|
|
@@ -1631,11 +1654,16 @@ const ControlSliderComponent = {
|
|
|
1631
1654
|
},
|
|
1632
1655
|
drag: {
|
|
1633
1656
|
type: "boolean"
|
|
1634
|
-
},
|
|
1635
|
-
auto: {
|
|
1636
|
-
type: "boolean"
|
|
1637
1657
|
}
|
|
1638
1658
|
}
|
|
1659
|
+
},
|
|
1660
|
+
autoPlay: {
|
|
1661
|
+
type: ["string", "null"],
|
|
1662
|
+
label: "Auto",
|
|
1663
|
+
display: {
|
|
1664
|
+
type: "step-selector"
|
|
1665
|
+
},
|
|
1666
|
+
enum: [null, "1s", "2s", "3s", "4s", "5s"]
|
|
1639
1667
|
}
|
|
1640
1668
|
}
|
|
1641
1669
|
},
|
|
@@ -1720,7 +1748,7 @@ const ControlSliderComponent = {
|
|
|
1720
1748
|
position: {
|
|
1721
1749
|
name: "nav position",
|
|
1722
1750
|
display: {
|
|
1723
|
-
type: "
|
|
1751
|
+
type: "socket",
|
|
1724
1752
|
direction: "horizontal"
|
|
1725
1753
|
},
|
|
1726
1754
|
type: "string",
|
|
@@ -1818,9 +1846,9 @@ const ControlSliderComponent = {
|
|
|
1818
1846
|
triggers: {
|
|
1819
1847
|
triggersList: {
|
|
1820
1848
|
click: true,
|
|
1821
|
-
drag: true
|
|
1822
|
-
|
|
1823
|
-
|
|
1849
|
+
drag: true
|
|
1850
|
+
},
|
|
1851
|
+
autoPlay: null
|
|
1824
1852
|
},
|
|
1825
1853
|
controls: {
|
|
1826
1854
|
isActive: true,
|
|
@@ -1856,16 +1884,6 @@ const ControlSliderComponent = {
|
|
|
1856
1884
|
}
|
|
1857
1885
|
},
|
|
1858
1886
|
displayRules: [
|
|
1859
|
-
{
|
|
1860
|
-
if: {
|
|
1861
|
-
name: "direction",
|
|
1862
|
-
value: "vertical"
|
|
1863
|
-
},
|
|
1864
|
-
then: {
|
|
1865
|
-
name: "properties.controls.properties.position.display.direction",
|
|
1866
|
-
value: "vertical"
|
|
1867
|
-
}
|
|
1868
|
-
},
|
|
1869
1887
|
{
|
|
1870
1888
|
if: {
|
|
1871
1889
|
name: "direction",
|
|
@@ -2063,7 +2081,7 @@ const ControlSliderComponent = {
|
|
|
2063
2081
|
default: {
|
|
2064
2082
|
caption: {
|
|
2065
2083
|
widthSettings: {
|
|
2066
|
-
width:
|
|
2084
|
+
width: 0.13,
|
|
2067
2085
|
sizing: "auto"
|
|
2068
2086
|
},
|
|
2069
2087
|
fontSettings: {
|
package/dist/index.mjs
CHANGED
|
@@ -513,7 +513,8 @@ const SectionSchema = z.object({
|
|
|
513
513
|
media: z.record(z.object({
|
|
514
514
|
url: z.string(),
|
|
515
515
|
size: z.string(),
|
|
516
|
-
position: z.string()
|
|
516
|
+
position: z.string(),
|
|
517
|
+
offsetX: z.number().nullable()
|
|
517
518
|
})).optional()
|
|
518
519
|
});
|
|
519
520
|
const TriggerSchema = z.object({
|
|
@@ -1292,17 +1293,17 @@ const RichTextRenderer = ({ content }) => {
|
|
|
1292
1293
|
}) });
|
|
1293
1294
|
};
|
|
1294
1295
|
function getLeafCss(leaf) {
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
1305
|
-
|
|
1296
|
+
return {
|
|
1297
|
+
...leaf.fontWeight && { fontWeight: leaf.fontWeight },
|
|
1298
|
+
...leaf.fontStyle && { fontStyle: leaf.fontStyle },
|
|
1299
|
+
...leaf.textDecoration && { textDecoration: leaf.textDecoration },
|
|
1300
|
+
...leaf.textTransform && { textTransform: leaf.textTransform },
|
|
1301
|
+
...leaf.fontVariant && { fontVariant: leaf.fontVariant },
|
|
1302
|
+
...leaf.verticalAlign && {
|
|
1303
|
+
verticalAlign: leaf.verticalAlign,
|
|
1304
|
+
lineHeight: "0px"
|
|
1305
|
+
}
|
|
1306
|
+
};
|
|
1306
1307
|
}
|
|
1307
1308
|
function scalingValue(value, isEditor = false) {
|
|
1308
1309
|
return isEditor ? `calc(var(--cntrl-article-width) * ${value})` : `${value * 100}vw`;
|
|
@@ -1386,12 +1387,14 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
|
|
|
1386
1387
|
children: content.map((item, index) => /* @__PURE__ */ jsx(
|
|
1387
1388
|
"div",
|
|
1388
1389
|
{
|
|
1389
|
-
className: cn(styles$2.captionText, alignmentClassName[settings.caption.alignment], {
|
|
1390
|
+
className: cn(styles$2.captionText, alignmentClassName[settings.caption.alignment], {
|
|
1391
|
+
[styles$2.withPointerEvents]: index === currentSlideIndex && isEditor
|
|
1392
|
+
}),
|
|
1390
1393
|
style: {
|
|
1391
1394
|
fontFamily: fontSettings.fontFamily,
|
|
1392
1395
|
fontWeight: fontSettings.fontWeight,
|
|
1393
1396
|
fontStyle: fontSettings.fontStyle,
|
|
1394
|
-
width: widthSettings.sizing === "auto" ? "max-content" : widthSettings.width,
|
|
1397
|
+
width: widthSettings.sizing === "auto" ? "max-content" : scalingValue(widthSettings.width, isEditor),
|
|
1395
1398
|
letterSpacing: scalingValue(letterSpacing, isEditor),
|
|
1396
1399
|
wordSpacing: scalingValue(wordSpacing, isEditor),
|
|
1397
1400
|
textAlign,
|
|
@@ -1433,9 +1436,13 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
|
|
|
1433
1436
|
ref: setSliderRef,
|
|
1434
1437
|
options: {
|
|
1435
1438
|
arrows: false,
|
|
1436
|
-
autoplay: isEditor ? false : settings.triggers.
|
|
1439
|
+
autoplay: isEditor ? false : settings.triggers.autoPlay !== null,
|
|
1440
|
+
...settings.triggers.autoPlay !== null && {
|
|
1441
|
+
interval: parseInt(settings.triggers.autoPlay) * 1e3
|
|
1442
|
+
},
|
|
1437
1443
|
direction: direction === "horizontal" ? "ltr" : "ttb",
|
|
1438
1444
|
pagination: false,
|
|
1445
|
+
drag: settings.triggers.triggersList.drag,
|
|
1439
1446
|
perPage: 1,
|
|
1440
1447
|
width: sliderDimensions ? sliderDimensions == null ? void 0 : sliderDimensions.width : "100%",
|
|
1441
1448
|
height: sliderDimensions ? sliderDimensions == null ? void 0 : sliderDimensions.height : "100%",
|
|
@@ -1481,7 +1488,15 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
|
|
|
1481
1488
|
transform: `translate(${scalingValue(controlsOffsetX, isEditor)}, ${scalingValue(controlsOffsetY * (direction === "horizontal" ? 1 : -1), isEditor)}) scale(${settings.controls.scale / 100}) rotate(${direction === "horizontal" ? "180deg" : "-90deg"})`
|
|
1482
1489
|
},
|
|
1483
1490
|
children: [
|
|
1484
|
-
settings.controls.arrowsImgUrl && /* @__PURE__ */ jsx(
|
|
1491
|
+
settings.controls.arrowsImgUrl && /* @__PURE__ */ jsx(
|
|
1492
|
+
SvgImage,
|
|
1493
|
+
{
|
|
1494
|
+
url: settings.controls.arrowsImgUrl,
|
|
1495
|
+
fill: settings.controls.color,
|
|
1496
|
+
hoverFill: settings.controls.hover,
|
|
1497
|
+
className: styles$2.arrowImg
|
|
1498
|
+
}
|
|
1499
|
+
),
|
|
1485
1500
|
!settings.controls.arrowsImgUrl && /* @__PURE__ */ jsx(ArrowIcon, { color: settings.controls.color, className: cn(styles$2.arrowIcon, styles$2.arrowImg) })
|
|
1486
1501
|
]
|
|
1487
1502
|
}
|
|
@@ -1507,7 +1522,15 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
|
|
|
1507
1522
|
transform: `translate(${scalingValue(controlsOffsetX * (direction === "horizontal" ? -1 : 1), isEditor)}, ${scalingValue(controlsOffsetY, isEditor)}) scale(${settings.controls.scale / 100}) rotate(${direction === "horizontal" ? "0deg" : "90deg"})`
|
|
1508
1523
|
},
|
|
1509
1524
|
children: [
|
|
1510
|
-
settings.controls.arrowsImgUrl && /* @__PURE__ */ jsx(
|
|
1525
|
+
settings.controls.arrowsImgUrl && /* @__PURE__ */ jsx(
|
|
1526
|
+
SvgImage,
|
|
1527
|
+
{
|
|
1528
|
+
url: settings.controls.arrowsImgUrl,
|
|
1529
|
+
fill: settings.controls.color,
|
|
1530
|
+
hoverFill: settings.controls.hover,
|
|
1531
|
+
className: styles$2.arrowImg
|
|
1532
|
+
}
|
|
1533
|
+
),
|
|
1511
1534
|
!settings.controls.arrowsImgUrl && /* @__PURE__ */ jsx(ArrowIcon, { color: settings.controls.color, className: cn(styles$2.arrowIcon, styles$2.arrowImg) })
|
|
1512
1535
|
]
|
|
1513
1536
|
}
|
|
@@ -1604,7 +1627,7 @@ const ControlSliderComponent = {
|
|
|
1604
1627
|
triggersList: {
|
|
1605
1628
|
type: "object",
|
|
1606
1629
|
display: {
|
|
1607
|
-
type: "
|
|
1630
|
+
type: "toggle-ratio-group"
|
|
1608
1631
|
},
|
|
1609
1632
|
properties: {
|
|
1610
1633
|
click: {
|
|
@@ -1612,11 +1635,16 @@ const ControlSliderComponent = {
|
|
|
1612
1635
|
},
|
|
1613
1636
|
drag: {
|
|
1614
1637
|
type: "boolean"
|
|
1615
|
-
},
|
|
1616
|
-
auto: {
|
|
1617
|
-
type: "boolean"
|
|
1618
1638
|
}
|
|
1619
1639
|
}
|
|
1640
|
+
},
|
|
1641
|
+
autoPlay: {
|
|
1642
|
+
type: ["string", "null"],
|
|
1643
|
+
label: "Auto",
|
|
1644
|
+
display: {
|
|
1645
|
+
type: "step-selector"
|
|
1646
|
+
},
|
|
1647
|
+
enum: [null, "1s", "2s", "3s", "4s", "5s"]
|
|
1620
1648
|
}
|
|
1621
1649
|
}
|
|
1622
1650
|
},
|
|
@@ -1701,7 +1729,7 @@ const ControlSliderComponent = {
|
|
|
1701
1729
|
position: {
|
|
1702
1730
|
name: "nav position",
|
|
1703
1731
|
display: {
|
|
1704
|
-
type: "
|
|
1732
|
+
type: "socket",
|
|
1705
1733
|
direction: "horizontal"
|
|
1706
1734
|
},
|
|
1707
1735
|
type: "string",
|
|
@@ -1799,9 +1827,9 @@ const ControlSliderComponent = {
|
|
|
1799
1827
|
triggers: {
|
|
1800
1828
|
triggersList: {
|
|
1801
1829
|
click: true,
|
|
1802
|
-
drag: true
|
|
1803
|
-
|
|
1804
|
-
|
|
1830
|
+
drag: true
|
|
1831
|
+
},
|
|
1832
|
+
autoPlay: null
|
|
1805
1833
|
},
|
|
1806
1834
|
controls: {
|
|
1807
1835
|
isActive: true,
|
|
@@ -1837,16 +1865,6 @@ const ControlSliderComponent = {
|
|
|
1837
1865
|
}
|
|
1838
1866
|
},
|
|
1839
1867
|
displayRules: [
|
|
1840
|
-
{
|
|
1841
|
-
if: {
|
|
1842
|
-
name: "direction",
|
|
1843
|
-
value: "vertical"
|
|
1844
|
-
},
|
|
1845
|
-
then: {
|
|
1846
|
-
name: "properties.controls.properties.position.display.direction",
|
|
1847
|
-
value: "vertical"
|
|
1848
|
-
}
|
|
1849
|
-
},
|
|
1850
1868
|
{
|
|
1851
1869
|
if: {
|
|
1852
1870
|
name: "direction",
|
|
@@ -2044,7 +2062,7 @@ const ControlSliderComponent = {
|
|
|
2044
2062
|
default: {
|
|
2045
2063
|
caption: {
|
|
2046
2064
|
widthSettings: {
|
|
2047
|
-
width:
|
|
2065
|
+
width: 0.13,
|
|
2048
2066
|
sizing: "auto"
|
|
2049
2067
|
},
|
|
2050
2068
|
fontSettings: {
|
|
@@ -25,14 +25,17 @@ export declare const ArticleSchema: z.ZodObject<{
|
|
|
25
25
|
url: z.ZodString;
|
|
26
26
|
size: z.ZodString;
|
|
27
27
|
position: z.ZodString;
|
|
28
|
+
offsetX: z.ZodNullable<z.ZodNumber>;
|
|
28
29
|
}, "strip", z.ZodTypeAny, {
|
|
29
30
|
url: string;
|
|
30
31
|
position: string;
|
|
31
32
|
size: string;
|
|
33
|
+
offsetX: number | null;
|
|
32
34
|
}, {
|
|
33
35
|
url: string;
|
|
34
36
|
position: string;
|
|
35
37
|
size: string;
|
|
38
|
+
offsetX: number | null;
|
|
36
39
|
}>>>;
|
|
37
40
|
}, "strip", z.ZodTypeAny, {
|
|
38
41
|
color: Record<string, string | null>;
|
|
@@ -50,6 +53,7 @@ export declare const ArticleSchema: z.ZodObject<{
|
|
|
50
53
|
url: string;
|
|
51
54
|
position: string;
|
|
52
55
|
size: string;
|
|
56
|
+
offsetX: number | null;
|
|
53
57
|
}> | undefined;
|
|
54
58
|
}, {
|
|
55
59
|
color: Record<string, string | null>;
|
|
@@ -67,6 +71,7 @@ export declare const ArticleSchema: z.ZodObject<{
|
|
|
67
71
|
url: string;
|
|
68
72
|
position: string;
|
|
69
73
|
size: string;
|
|
74
|
+
offsetX: number | null;
|
|
70
75
|
}> | undefined;
|
|
71
76
|
}>, "many">;
|
|
72
77
|
interactions: z.ZodArray<z.ZodObject<{
|
|
@@ -164,6 +169,7 @@ export declare const ArticleSchema: z.ZodObject<{
|
|
|
164
169
|
url: string;
|
|
165
170
|
position: string;
|
|
166
171
|
size: string;
|
|
172
|
+
offsetX: number | null;
|
|
167
173
|
}> | undefined;
|
|
168
174
|
}[];
|
|
169
175
|
interactions: {
|
|
@@ -201,6 +207,7 @@ export declare const ArticleSchema: z.ZodObject<{
|
|
|
201
207
|
url: string;
|
|
202
208
|
position: string;
|
|
203
209
|
size: string;
|
|
210
|
+
offsetX: number | null;
|
|
204
211
|
}> | undefined;
|
|
205
212
|
}[];
|
|
206
213
|
interactions: {
|
|
@@ -37,14 +37,17 @@ export declare const SectionSchema: z.ZodObject<{
|
|
|
37
37
|
url: z.ZodString;
|
|
38
38
|
size: z.ZodString;
|
|
39
39
|
position: z.ZodString;
|
|
40
|
+
offsetX: z.ZodNullable<z.ZodNumber>;
|
|
40
41
|
}, "strip", z.ZodTypeAny, {
|
|
41
42
|
url: string;
|
|
42
43
|
position: string;
|
|
43
44
|
size: string;
|
|
45
|
+
offsetX: number | null;
|
|
44
46
|
}, {
|
|
45
47
|
url: string;
|
|
46
48
|
position: string;
|
|
47
49
|
size: string;
|
|
50
|
+
offsetX: number | null;
|
|
48
51
|
}>>>;
|
|
49
52
|
}, "strip", z.ZodTypeAny, {
|
|
50
53
|
color: Record<string, string | null>;
|
|
@@ -62,6 +65,7 @@ export declare const SectionSchema: z.ZodObject<{
|
|
|
62
65
|
url: string;
|
|
63
66
|
position: string;
|
|
64
67
|
size: string;
|
|
68
|
+
offsetX: number | null;
|
|
65
69
|
}> | undefined;
|
|
66
70
|
}, {
|
|
67
71
|
color: Record<string, string | null>;
|
|
@@ -79,5 +83,6 @@ export declare const SectionSchema: z.ZodObject<{
|
|
|
79
83
|
url: string;
|
|
80
84
|
position: string;
|
|
81
85
|
size: string;
|
|
86
|
+
offsetX: number | null;
|
|
82
87
|
}> | undefined;
|
|
83
88
|
}>;
|
package/dist/sdk.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ControlSlider-module__wrapper___sHEkd{position:relative;width:100%;height:100%}.ControlSlider-module__slider___R3i9-{width:100%;height:100%}.ControlSlider-module__sliderItems___1MgPL{display:flex;overflow:hidden;width:100%;height:100%;transition:transform .3s ease-in-out}.ControlSlider-module__sliderItem___QQSkR{width:100%;height:100%;display:flex;position:relative}.ControlSlider-module__sliderImage___9hRl-{width:100%;height:100%;object-fit:cover}.ControlSlider-module__arrow___05ghY{position:absolute;display:flex;align-items:center;justify-content:center;border:none;background-color:transparent;top:50%;left:0;z-index:1;transform:translate(-50%,-50%);padding:0;width:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw);height:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw)}.ControlSlider-module__arrow___05ghY.ControlSlider-module__arrowVertical___tBfVN{left:50%;top:0;transform:translate(-50%,-50%)}.ControlSlider-module__nextArrow___-30Yc{left:unset;right:0;transform:translate(50%,-50%)}.ControlSlider-module__nextArrow___-30Yc.ControlSlider-module__arrowVertical___tBfVN{left:50%;right:unset;top:unset;bottom:0;transform:translate(-50%,50%)}.ControlSlider-module__arrowInner___aEra3{all:unset;cursor:pointer;width:100%;height:100%}.ControlSlider-module__arrowInner___aEra3:hover .ControlSlider-module__arrowIcon___S4ztF path{stroke:var(--arrow-hover-color)!important}.ControlSlider-module__arrowImg___2dwJW{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ControlSlider-module__arrowIcon___S4ztF{width:100%;height:100%}.ControlSlider-module__arrowIcon___S4ztF path{transition:stroke .15s ease-in-out}.ControlSlider-module__prevIcon___v8NAK{transform:rotate(180deg)}.ControlSlider-module__pagination___bicLF{position:absolute;z-index:1;border-radius:50%}.ControlSlider-module__paginationInner___bT-P-{display:flex;gap:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);padding-top:calc(var(--is-editor, 0) * .6944444444vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * .6944444444vw);padding-bottom:calc(var(--is-editor, 0) * .6944444444vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * .6944444444vw);padding-left:calc(var(--is-editor, 0) * 1.25vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.25vw);padding-right:calc(var(--is-editor, 0) * 1.25vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.25vw);border-radius:calc(var(--is-editor, 0) * 2.3611111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.3611111111vw)}.ControlSlider-module__paginationVertical___zYqKw{flex-direction:column}.ControlSlider-module__paginationItem___nTRbk{all:unset;width:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);height:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);
|
|
1
|
+
.ControlSlider-module__wrapper___sHEkd{position:relative;width:100%;height:100%}.ControlSlider-module__slider___R3i9-{width:100%;height:100%}.ControlSlider-module__sliderItems___1MgPL{display:flex;overflow:hidden;width:100%;height:100%;transition:transform .3s ease-in-out}.ControlSlider-module__sliderItem___QQSkR{width:100%;height:100%;display:flex;position:relative}.ControlSlider-module__sliderImage___9hRl-{width:100%;height:100%;object-fit:cover}.ControlSlider-module__arrow___05ghY{position:absolute;display:flex;align-items:center;justify-content:center;border:none;background-color:transparent;top:50%;left:0;z-index:1;transform:translate(-50%,-50%);padding:0;width:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw);height:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw)}.ControlSlider-module__arrow___05ghY.ControlSlider-module__arrowVertical___tBfVN{left:50%;top:0;transform:translate(-50%,-50%)}.ControlSlider-module__nextArrow___-30Yc{left:unset;right:0;transform:translate(50%,-50%)}.ControlSlider-module__nextArrow___-30Yc.ControlSlider-module__arrowVertical___tBfVN{left:50%;right:unset;top:unset;bottom:0;transform:translate(-50%,50%)}.ControlSlider-module__arrowInner___aEra3{all:unset;cursor:pointer;width:100%;height:100%}.ControlSlider-module__arrowInner___aEra3:hover .ControlSlider-module__arrowIcon___S4ztF path{stroke:var(--arrow-hover-color)!important}.ControlSlider-module__arrowImg___2dwJW{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ControlSlider-module__arrowIcon___S4ztF{width:100%;height:100%}.ControlSlider-module__arrowIcon___S4ztF path{transition:stroke .15s ease-in-out}.ControlSlider-module__prevIcon___v8NAK{transform:rotate(180deg)}.ControlSlider-module__pagination___bicLF{position:absolute;z-index:1;border-radius:50%}.ControlSlider-module__paginationInner___bT-P-{display:flex;gap:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);padding-top:calc(var(--is-editor, 0) * .6944444444vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * .6944444444vw);padding-bottom:calc(var(--is-editor, 0) * .6944444444vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * .6944444444vw);padding-left:calc(var(--is-editor, 0) * 1.25vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.25vw);padding-right:calc(var(--is-editor, 0) * 1.25vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.25vw);border-radius:calc(var(--is-editor, 0) * 2.3611111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.3611111111vw)}.ControlSlider-module__paginationVertical___zYqKw{flex-direction:column}.ControlSlider-module__paginationItem___nTRbk{all:unset;flex-shrink:0;position:relative;width:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);height:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);cursor:pointer}.ControlSlider-module__paginationItem___nTRbk:hover .ControlSlider-module__dot___p1Qun{background-color:var(--pagination-hover-color)!important}.ControlSlider-module__dot___p1Qun{border-radius:50%;scale:.5;transition:background-color .3s ease-in-out,transform .3s ease-in-out;width:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);height:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw)}.ControlSlider-module__activeDot___LHFaj{transform:scale(2)}.ControlSlider-module__paginationInsideBottom___R3FWn{bottom:0;left:50%;transform:translate(-50%)}.ControlSlider-module__paginationInsideTop___V-qb-{left:50%;transform:translate(-50%);top:0}.ControlSlider-module__paginationOutsideBottom___14w8D{left:50%;transform:translate(-50%);bottom:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationOutsideTop___SCLqB{left:50%;transform:translate(-50%);top:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationInsideLeft___yOBRZ{top:50%;transform:translateY(-50%);left:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationInsideRight___Rtt3o{top:50%;transform:translateY(-50%);right:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationOutsideLeft___lahaw{top:50%;transform:translateY(-50%);left:calc(var(--is-editor, 0) * -5.4861111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -5.4861111111vw)}.ControlSlider-module__paginationOutsideRight___EtuQa{top:50%;transform:translateY(-50%);right:calc(var(--is-editor, 0) * -5.4861111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -5.4861111111vw)}.ControlSlider-module__imgWrapper___UjEgB,.ControlSlider-module__wrapperInner___DLAWV{width:100%;height:100%}.ControlSlider-module__captionBlock___dJ6-j{pointer-events:none;position:absolute;top:0;z-index:1;left:0;right:0;bottom:0}.ControlSlider-module__captionTextWrapper___HFlpf{position:relative;width:100%;height:100%}.ControlSlider-module__captionText___uGBVc{pointer-events:none;max-width:100%;transition:opacity .3s ease-in-out;position:absolute;display:inline-block;white-space:pre-wrap;overflow-wrap:break-word}.ControlSlider-module__withPointerEvents___t-18M{pointer-events:auto}.ControlSlider-module__absolute___KxmYB{position:absolute}.ControlSlider-module__topLeftAlignment___zjnGM{top:0;left:0}.ControlSlider-module__topCenterAlignment___gD1xW{top:0;left:50%;transform:translate(-50%)}.ControlSlider-module__topRightAlignment___NMapS{top:0;right:0}.ControlSlider-module__middleLeftAlignment___OnUrY{top:50%;transform:translateY(-50%);left:0}.ControlSlider-module__middleCenterAlignment___Tdkl0{top:50%;transform:translate(-50%,-50%);left:50%}.ControlSlider-module__middleRightAlignment___wEbfX{top:50%;transform:translateY(-50%);right:0}.ControlSlider-module__bottomLeftAlignment___cTP2-{bottom:0;left:0}.ControlSlider-module__bottomCenterAlignment___c54fB{bottom:0;left:50%;transform:translate(-50%)}.ControlSlider-module__bottomRightAlignment___kEwrz{bottom:0;right:0}.ControlSlider-module__clickOverlay___DZA28{position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer}@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide__track--draggable{-webkit-touch-callout:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.splide__track--fade>.splide__list>.splide__slide{margin:0!important;opacity:0;z-index:0}.splide__track--fade>.splide__list>.splide__slide.is-active{opacity:1;z-index:1}.splide--rtl{direction:rtl}.splide__track--ttb>.splide__list{display:block}.splide__container{box-sizing:border-box;position:relative}.splide__list{backface-visibility:hidden;display:-ms-flexbox;display:flex;height:100%;margin:0!important;padding:0!important}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide:not(.is-overflow) .splide__pagination{display:none}.splide__progress__bar{width:0}.splide{position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{backface-visibility:hidden;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0;list-style-type:none!important;margin:0;position:relative}.splide__slide img{vertical-align:bottom}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;bottom:0;contain:strict;display:inline-block;height:20px;left:0;margin:auto;position:absolute;right:0;top:0;width:20px}.splide__sr{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause{display:none}.splide__toggle.is-active .splide__toggle__pause{display:inline}.splide__track{overflow:hidden;position:relative;z-index:0}.RichTextRenderer-module__link___BWeZ2{color:inherit;cursor:pointer;pointer-events:auto;transition:color .2s ease}.RichTextRenderer-module__link___BWeZ2:hover{color:var(--link-hover-color)}.SvgImage-module__svg___q3xE-{width:100%;height:100%;color:transparent;display:inline-block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:var(--fill);transition:background-color .2s;-webkit-mask:var(--svg) no-repeat center/contain;mask:var(--svg) no-repeat center/contain}.SvgImage-module__svg___q3xE-:hover{background-color:var(--hover-fill)}.SvgImage-module__img___VsTm-{width:100%;height:100%;object-fit:contain}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cntrl-site/sdk",
|
|
3
|
-
"version": "1.21.0
|
|
3
|
+
"version": "1.21.0",
|
|
4
4
|
"description": "Generic SDK for use in public websites.",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.mjs",
|
|
@@ -74,9 +74,5 @@
|
|
|
74
74
|
"typescript": "^5.2.2",
|
|
75
75
|
"vite": "^6.2.5",
|
|
76
76
|
"vite-plugin-dts": "^4.5.3"
|
|
77
|
-
},
|
|
78
|
-
"peerDependencies": {
|
|
79
|
-
"react": "^18",
|
|
80
|
-
"react-dom": "^18"
|
|
81
77
|
}
|
|
82
78
|
}
|