@cntrl-site/sdk-nextjs 1.4.1 → 1.4.3
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/cntrl-site-sdk-nextjs-1.2.0.tgz +0 -0
- package/cntrl-site-sdk-nextjs-1.3.3.tgz +0 -0
- package/lib/components/items/CompoundItem/CompoundChild.js +3 -3
- package/lib/components/items/Item.js +3 -3
- package/lib/utils/getCompoundBondaryStyles.js +4 -4
- package/package.json +1 -1
- package/src/components/items/CompoundItem/CompoundChild.tsx +5 -5
- package/src/components/items/Item.tsx +5 -5
- package/src/utils/getCompoundBondaryStyles.ts +4 -4
- package/.idea/codeStyles/codeStyleConfig.xml +0 -5
- package/.idea/inspectionProfiles/Project_Default.xml +0 -15
- package/cntrl-site-sdk-nextjs-1.4.1.tgz +0 -0
|
Binary file
|
|
Binary file
|
|
@@ -61,15 +61,15 @@ const CompoundChild = ({ item, sectionId, isParentVisible = true }) => {
|
|
|
61
61
|
var _a;
|
|
62
62
|
e.stopPropagation();
|
|
63
63
|
(_a = interactionCtrl === null || interactionCtrl === void 0 ? void 0 : interactionCtrl.handleTransitionEnd) === null || _a === void 0 ? void 0 : _a.call(interactionCtrl, e.propertyName);
|
|
64
|
-
}, style: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (top && compoundSettings ? { top: (0, getCompoundBondaryStyles_1.getCompoundTop)(compoundSettings, top) } : {})), (left && compoundSettings ? { left: (0, getCompoundBondaryStyles_1.getCompoundLeft)(compoundSettings, left) } : {})), (width && compoundSettings
|
|
64
|
+
}, style: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (top !== undefined && compoundSettings ? { top: (0, getCompoundBondaryStyles_1.getCompoundTop)(compoundSettings, top) } : {})), (left !== undefined && compoundSettings ? { left: (0, getCompoundBondaryStyles_1.getCompoundLeft)(compoundSettings, left) } : {})), (width !== undefined && compoundSettings
|
|
65
65
|
? { width: `${sizingAxis.x === 'manual'
|
|
66
66
|
? (0, getCompoundBondaryStyles_1.getCompoundWidth)(compoundSettings, width, isRichText, exemplary)
|
|
67
67
|
: 'max-content'}` }
|
|
68
|
-
: {})), (height && compoundSettings
|
|
68
|
+
: {})), (height !== undefined && compoundSettings
|
|
69
69
|
? { height: `${sizingAxis.y === 'manual'
|
|
70
70
|
? (0, getCompoundBondaryStyles_1.getCompoundHeight)(compoundSettings, height)
|
|
71
71
|
: 'unset'}` }
|
|
72
|
-
: {})), (scale && compoundSettings ? { transform: `scale(${scale}) ${(0, getCompoundBondaryStyles_1.getCompoundTransform)(compoundSettings)}` } : {})), { transition: (_k = stateProps === null || stateProps === void 0 ? void 0 : stateProps.transition) !== null && _k !== void 0 ? _k : 'none', cursor: hasClickTriggers ? 'pointer' : 'unset', pointerEvents: allowPointerEvents ? 'auto' : 'none' }) }, triggers, { children: [(0, jsx_runtime_1.jsx)(RichTextWrapper_1.RichTextWrapper, { isRichText: isRichText, transformOrigin: transformOrigin, children: (0, jsx_runtime_1.jsx)(ItemComponent, { item: item, sectionId: sectionId, interactionCtrl: interactionCtrl, onVisibilityChange: handleVisibilityChange }) }), (0, jsx_runtime_1.jsx)(style_1.default, { id: id, children: `
|
|
72
|
+
: {})), (scale !== undefined && compoundSettings ? { transform: `scale(${scale}) ${(0, getCompoundBondaryStyles_1.getCompoundTransform)(compoundSettings)}` } : {})), { transition: (_k = stateProps === null || stateProps === void 0 ? void 0 : stateProps.transition) !== null && _k !== void 0 ? _k : 'none', cursor: hasClickTriggers ? 'pointer' : 'unset', pointerEvents: allowPointerEvents ? 'auto' : 'none' }) }, triggers, { children: [(0, jsx_runtime_1.jsx)(RichTextWrapper_1.RichTextWrapper, { isRichText: isRichText, transformOrigin: transformOrigin, children: (0, jsx_runtime_1.jsx)(ItemComponent, { item: item, sectionId: sectionId, interactionCtrl: interactionCtrl, onVisibilityChange: handleVisibilityChange }) }), (0, jsx_runtime_1.jsx)(style_1.default, { id: id, children: `
|
|
73
73
|
${(0, sdk_1.getLayoutStyles)(layouts, layoutValues, ([area, hidden, compoundSettings, layoutParams]) => {
|
|
74
74
|
const sizingAxis = (0, useSizing_1.parseSizing)(layoutParams.sizing);
|
|
75
75
|
const scaleAnchor = area.scaleAnchor;
|
|
@@ -95,11 +95,11 @@ const Item = ({ item, sectionId, articleHeight, isParentVisible = true, isInGrou
|
|
|
95
95
|
var _a;
|
|
96
96
|
e.stopPropagation();
|
|
97
97
|
(_a = interactionCtrl === null || interactionCtrl === void 0 ? void 0 : interactionCtrl.handleTransitionEnd) === null || _a === void 0 ? void 0 : _a.call(interactionCtrl, e.propertyName);
|
|
98
|
-
}, style: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (top ? { top: isScreenBasedBottom ? 'unset' : (0, getItemTopStyle_1.getItemTopStyle)(top, anchorSide) } : {})), (left ? { left: `${left * 100}vw` } : {})), (top ? { bottom: isScreenBasedBottom ? `${-top * 100}vw` : 'unset' } : {})), (wrapperHeight !== undefined ? { height: `${wrapperHeight * 100}vw` } : {})), { transition: (_k = wrapperStateProps === null || wrapperStateProps === void 0 ? void 0 : wrapperStateProps.transition) !== null && _k !== void 0 ? _k : 'none' }), children: [(0, jsx_runtime_1.jsx)("div", { suppressHydrationWarning: true, className: `item-${item.id}`, style: {
|
|
98
|
+
}, style: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (top !== undefined ? { top: isScreenBasedBottom ? 'unset' : (0, getItemTopStyle_1.getItemTopStyle)(top, anchorSide) } : {})), (left !== undefined ? { left: `${left * 100}vw` } : {})), (top !== undefined ? { bottom: isScreenBasedBottom ? `${-top * 100}vw` : 'unset' } : {})), (wrapperHeight !== undefined ? { height: `${wrapperHeight * 100}vw` } : {})), { transition: (_k = wrapperStateProps === null || wrapperStateProps === void 0 ? void 0 : wrapperStateProps.transition) !== null && _k !== void 0 ? _k : 'none' }), children: [(0, jsx_runtime_1.jsx)("div", { suppressHydrationWarning: true, className: `item-${item.id}`, style: {
|
|
99
99
|
opacity: (keyframes.length !== 0 && !layout) ? 0 : 1,
|
|
100
100
|
top: `${stickyTop * 100}vw`,
|
|
101
|
-
height: isRichText && itemHeight ? `${itemHeight * 100}vw` : 'unset',
|
|
102
|
-
}, children: (0, jsx_runtime_1.jsx)(RichTextWrapper_1.RichTextWrapper, { isRichText: isRichText, children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `item-${item.id}-inner`, ref: itemInnerRef, style: Object.assign(Object.assign(Object.assign({}, ((width && height)
|
|
101
|
+
height: isRichText && itemHeight !== undefined ? `${itemHeight * 100}vw` : 'unset',
|
|
102
|
+
}, children: (0, jsx_runtime_1.jsx)(RichTextWrapper_1.RichTextWrapper, { isRichText: isRichText, children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `item-${item.id}-inner`, ref: itemInnerRef, style: Object.assign(Object.assign(Object.assign({}, ((width !== undefined && height !== undefined)
|
|
103
103
|
? {
|
|
104
104
|
width: `${sizingAxis.x === 'manual'
|
|
105
105
|
? isRichText
|
|
@@ -14,7 +14,7 @@ const positionMatrix = {
|
|
|
14
14
|
[sdk_1.AreaAnchor.BottomRight]: [1, 1]
|
|
15
15
|
};
|
|
16
16
|
function getCompoundHeight(compoundSettings, height) {
|
|
17
|
-
if (
|
|
17
|
+
if (height === undefined || !compoundSettings)
|
|
18
18
|
return;
|
|
19
19
|
if (compoundSettings.heightMode === 'relative') {
|
|
20
20
|
return `${height * 100}%`;
|
|
@@ -23,7 +23,7 @@ function getCompoundHeight(compoundSettings, height) {
|
|
|
23
23
|
}
|
|
24
24
|
exports.getCompoundHeight = getCompoundHeight;
|
|
25
25
|
function getCompoundWidth(compoundSettings, width, isRichText, exemplary) {
|
|
26
|
-
if (
|
|
26
|
+
if (width === undefined || !compoundSettings)
|
|
27
27
|
return;
|
|
28
28
|
if (compoundSettings.widthMode === 'relative') {
|
|
29
29
|
return `${width * 100}%`;
|
|
@@ -32,7 +32,7 @@ function getCompoundWidth(compoundSettings, width, isRichText, exemplary) {
|
|
|
32
32
|
}
|
|
33
33
|
exports.getCompoundWidth = getCompoundWidth;
|
|
34
34
|
function getCompoundTop(compoundSettings, top) {
|
|
35
|
-
if (
|
|
35
|
+
if (top === undefined || !compoundSettings)
|
|
36
36
|
return;
|
|
37
37
|
if (compoundSettings.heightMode === 'relative') {
|
|
38
38
|
return `${top * 100}%`;
|
|
@@ -42,7 +42,7 @@ function getCompoundTop(compoundSettings, top) {
|
|
|
42
42
|
}
|
|
43
43
|
exports.getCompoundTop = getCompoundTop;
|
|
44
44
|
function getCompoundLeft(compoundSettings, left) {
|
|
45
|
-
if (
|
|
45
|
+
if (left === undefined || !compoundSettings)
|
|
46
46
|
return;
|
|
47
47
|
if (compoundSettings.widthMode === 'relative') {
|
|
48
48
|
return `${left * 100}%`;
|
package/package.json
CHANGED
|
@@ -80,19 +80,19 @@ export const CompoundChild: FC<ChildItemProps> = ({ item, sectionId, isParentVis
|
|
|
80
80
|
interactionCtrl?.handleTransitionEnd?.(e.propertyName);
|
|
81
81
|
}}
|
|
82
82
|
style={{
|
|
83
|
-
...(top && compoundSettings ? { top: getCompoundTop(compoundSettings, top) } : {}),
|
|
84
|
-
...(left && compoundSettings ? { left: getCompoundLeft(compoundSettings, left) } : {}),
|
|
85
|
-
...(width && compoundSettings
|
|
83
|
+
...(top !== undefined && compoundSettings ? { top: getCompoundTop(compoundSettings, top) } : {}),
|
|
84
|
+
...(left !== undefined && compoundSettings ? { left: getCompoundLeft(compoundSettings, left) } : {}),
|
|
85
|
+
...(width !== undefined && compoundSettings
|
|
86
86
|
? { width: `${sizingAxis.x === 'manual'
|
|
87
87
|
? getCompoundWidth(compoundSettings, width, isRichText, exemplary)
|
|
88
88
|
: 'max-content'}` }
|
|
89
89
|
: {}),
|
|
90
|
-
...(height && compoundSettings
|
|
90
|
+
...(height !== undefined && compoundSettings
|
|
91
91
|
? { height: `${sizingAxis.y === 'manual'
|
|
92
92
|
? getCompoundHeight(compoundSettings, height)
|
|
93
93
|
: 'unset'}` }
|
|
94
94
|
: {}),
|
|
95
|
-
...(scale && compoundSettings ? { transform: `scale(${scale}) ${getCompoundTransform(compoundSettings)}` } : {}),
|
|
95
|
+
...(scale !== undefined && compoundSettings ? { transform: `scale(${scale}) ${getCompoundTransform(compoundSettings)}` } : {}),
|
|
96
96
|
transition: stateProps?.transition ?? 'none',
|
|
97
97
|
cursor: hasClickTriggers ? 'pointer' : 'unset',
|
|
98
98
|
pointerEvents: allowPointerEvents ? 'auto' : 'none'
|
|
@@ -130,9 +130,9 @@ export const Item: FC<ItemWrapperProps> = ({ item, sectionId, articleHeight, isP
|
|
|
130
130
|
interactionCtrl?.handleTransitionEnd?.(e.propertyName);
|
|
131
131
|
}}
|
|
132
132
|
style={{
|
|
133
|
-
...(top ? { top: isScreenBasedBottom ? 'unset' : getItemTopStyle(top, anchorSide) } : {}),
|
|
134
|
-
...(left ? { left: `${left * 100}vw` } : {}),
|
|
135
|
-
...(top ? { bottom: isScreenBasedBottom ? `${-top * 100}vw` : 'unset' } : {}),
|
|
133
|
+
...(top !== undefined ? { top: isScreenBasedBottom ? 'unset' : getItemTopStyle(top, anchorSide) } : {}),
|
|
134
|
+
...(left !== undefined ? { left: `${left * 100}vw` } : {}),
|
|
135
|
+
...(top !== undefined ? { bottom: isScreenBasedBottom ? `${-top * 100}vw` : 'unset' } : {}),
|
|
136
136
|
...(wrapperHeight !== undefined ? { height: `${wrapperHeight * 100}vw` } : {}),
|
|
137
137
|
transition: wrapperStateProps?.transition ?? 'none'
|
|
138
138
|
}}
|
|
@@ -143,7 +143,7 @@ export const Item: FC<ItemWrapperProps> = ({ item, sectionId, articleHeight, isP
|
|
|
143
143
|
style={{
|
|
144
144
|
opacity: (keyframes.length !== 0 && !layout) ? 0 : 1,
|
|
145
145
|
top: `${stickyTop * 100}vw`,
|
|
146
|
-
height: isRichText && itemHeight ? `${itemHeight * 100}vw` : 'unset',
|
|
146
|
+
height: isRichText && itemHeight !== undefined ? `${itemHeight * 100}vw` : 'unset',
|
|
147
147
|
}}
|
|
148
148
|
>
|
|
149
149
|
<RichTextWrapper isRichText={isRichText}>
|
|
@@ -151,7 +151,7 @@ export const Item: FC<ItemWrapperProps> = ({ item, sectionId, articleHeight, isP
|
|
|
151
151
|
className={`item-${item.id}-inner`}
|
|
152
152
|
ref={itemInnerRef}
|
|
153
153
|
style={{
|
|
154
|
-
...((width && height)
|
|
154
|
+
...((width !== undefined && height !== undefined)
|
|
155
155
|
? {
|
|
156
156
|
width: `${sizingAxis.x === 'manual'
|
|
157
157
|
? isRichText
|
|
@@ -14,7 +14,7 @@ const positionMatrix: Record<AreaAnchor, [number, number]> = {
|
|
|
14
14
|
};
|
|
15
15
|
|
|
16
16
|
export function getCompoundHeight(compoundSettings: CompoundSettings | undefined, height: number | undefined) {
|
|
17
|
-
if (
|
|
17
|
+
if (height === undefined || !compoundSettings) return;
|
|
18
18
|
if (compoundSettings.heightMode === 'relative') {
|
|
19
19
|
return `${height * 100}%`;
|
|
20
20
|
}
|
|
@@ -22,7 +22,7 @@ export function getCompoundHeight(compoundSettings: CompoundSettings | undefined
|
|
|
22
22
|
}
|
|
23
23
|
|
|
24
24
|
export function getCompoundWidth(compoundSettings: CompoundSettings | undefined, width: number | undefined, isRichText: boolean, exemplary?: number) {
|
|
25
|
-
if (
|
|
25
|
+
if (width === undefined || !compoundSettings) return;
|
|
26
26
|
if (compoundSettings.widthMode === 'relative') {
|
|
27
27
|
return `${width * 100}%`;
|
|
28
28
|
}
|
|
@@ -30,7 +30,7 @@ export function getCompoundWidth(compoundSettings: CompoundSettings | undefined,
|
|
|
30
30
|
}
|
|
31
31
|
|
|
32
32
|
export function getCompoundTop(compoundSettings: CompoundSettings | undefined, top: number | undefined) {
|
|
33
|
-
if (
|
|
33
|
+
if (top === undefined || !compoundSettings) return;
|
|
34
34
|
if (compoundSettings.heightMode === 'relative') {
|
|
35
35
|
return `${top * 100}%`;
|
|
36
36
|
}
|
|
@@ -39,7 +39,7 @@ export function getCompoundTop(compoundSettings: CompoundSettings | undefined, t
|
|
|
39
39
|
}
|
|
40
40
|
|
|
41
41
|
export function getCompoundLeft(compoundSettings: CompoundSettings | undefined, left: number | undefined) {
|
|
42
|
-
if (
|
|
42
|
+
if (left === undefined || !compoundSettings) return;
|
|
43
43
|
if (compoundSettings.widthMode === 'relative') {
|
|
44
44
|
return `${left * 100}%`;
|
|
45
45
|
}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
<component name="InspectionProjectProfileManager">
|
|
2
|
-
<profile version="1.0">
|
|
3
|
-
<option name="myName" value="Project Default" />
|
|
4
|
-
<inspection_tool class="HtmlUnknownAttribute" enabled="true" level="WARNING" enabled_by_default="true">
|
|
5
|
-
<option name="myValues">
|
|
6
|
-
<value>
|
|
7
|
-
<list size="1">
|
|
8
|
-
<item index="0" class="java.lang.String" itemvalue="jsx" />
|
|
9
|
-
</list>
|
|
10
|
-
</value>
|
|
11
|
-
</option>
|
|
12
|
-
<option name="myCustomValuesEnabled" value="true" />
|
|
13
|
-
</inspection_tool>
|
|
14
|
-
</profile>
|
|
15
|
-
</component>
|
|
Binary file
|