@cntrl-site/sdk-nextjs 1.9.79 → 1.9.80-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/lib/common/useCurrentLayout.js +5 -3
- package/lib/components/StructuredBlockItem/StructuredComponent/StructuredComponent.js +3 -1
- package/package.json +2 -2
- package/src/common/useCurrentLayout.ts +4 -3
- package/src/components/StructuredBlockItem/StructuredComponent/StructuredComponent.tsx +2 -0
- package/.idea/codeStyles/codeStyleConfig.xml +0 -5
- package/.idea/modules.xml +0 -8
- package/.idea/sdk-nextjs.iml +0 -12
- package/.idea/vcs.xml +0 -6
|
@@ -33,9 +33,11 @@ function useCurrentLayout() {
|
|
|
33
33
|
return;
|
|
34
34
|
return articleRectObserver.on('resize', () => {
|
|
35
35
|
const articleWidth = articleRectObserver.width;
|
|
36
|
-
const
|
|
37
|
-
|
|
38
|
-
|
|
36
|
+
const layout = getCurrentLayout(articleWidth);
|
|
37
|
+
if (!layout)
|
|
38
|
+
return;
|
|
39
|
+
setLayoutId(layout.layoutId);
|
|
40
|
+
setDeviation(articleWidth / layout.exemplary);
|
|
39
41
|
});
|
|
40
42
|
}, [articleRectObserver, getCurrentLayout]);
|
|
41
43
|
return { layoutId, layoutDeviation: deviation };
|
|
@@ -26,7 +26,9 @@ const StructuredComponent = ({ block }) => {
|
|
|
26
26
|
const layoutParameters = effectiveLayout ? (_b = block.layoutParams[effectiveLayout]) === null || _b === void 0 ? void 0 : _b.parameters : undefined;
|
|
27
27
|
const commonParameters = block.commonParams.parameters;
|
|
28
28
|
const parameters = layoutParameters ? Object.assign(Object.assign({}, layoutParameters), { settings: Object.assign(Object.assign({}, layoutParameters.settings), commonParameters === null || commonParameters === void 0 ? void 0 : commonParameters.settings) }) : undefined;
|
|
29
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: `custom-component-${block.id}`, ref: setRef,
|
|
29
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: `custom-component-${block.id}`, ref: setRef,
|
|
30
|
+
// preventing layout shift while supporting SSG for proper SEO
|
|
31
|
+
style: { opacity: layout == null ? 0 : undefined }, children: parameters && Element && ((0, jsx_runtime_1.jsx)(Element, Object.assign({ metadata: {
|
|
30
32
|
itemId: block.id,
|
|
31
33
|
submitUrl: sdk.getSubmitUrl(commonParameters === null || commonParameters === void 0 ? void 0 : commonParameters.pluginConfigId)
|
|
32
34
|
}, portalId: "component-portal", content: block.commonParams.content }, parameters))) }), (0, jsx_runtime_1.jsx)(style_1.default, { id: block.id, children: `
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cntrl-site/sdk-nextjs",
|
|
3
|
-
"version": "1.9.
|
|
3
|
+
"version": "1.9.80-0",
|
|
4
4
|
"description": "SDK for Next.js",
|
|
5
5
|
"author": "arsen@momdesign.nyc",
|
|
6
6
|
"license": "MIT",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"dependencies": {
|
|
32
32
|
"@antfu/eslint-config": "^3.8.0",
|
|
33
33
|
"@cntrl-site/color": "^1.0.0",
|
|
34
|
-
"@cntrl-site/components": "^1.0.
|
|
34
|
+
"@cntrl-site/components": "^1.0.23",
|
|
35
35
|
"@cntrl-site/effects": "^1.4.2",
|
|
36
36
|
"@cntrl-site/sdk": "^1.28.0",
|
|
37
37
|
"@types/vimeo__player": "^2.18.0",
|
|
@@ -42,9 +42,10 @@ export function useCurrentLayout(): UseCurrentLayoutReturn {
|
|
|
42
42
|
if (!articleRectObserver) return;
|
|
43
43
|
return articleRectObserver.on('resize', () => {
|
|
44
44
|
const articleWidth = articleRectObserver.width;
|
|
45
|
-
const
|
|
46
|
-
|
|
47
|
-
|
|
45
|
+
const layout = getCurrentLayout(articleWidth);
|
|
46
|
+
if (!layout) return;
|
|
47
|
+
setLayoutId(layout.layoutId);
|
|
48
|
+
setDeviation(articleWidth / layout.exemplary);
|
|
48
49
|
});
|
|
49
50
|
}, [articleRectObserver, getCurrentLayout]);
|
|
50
51
|
|
|
@@ -32,6 +32,8 @@ export const StructuredComponent: FC<Props> = ({ block }) => {
|
|
|
32
32
|
<div
|
|
33
33
|
className={`custom-component-${block.id}`}
|
|
34
34
|
ref={setRef}
|
|
35
|
+
// preventing layout shift while supporting SSG for proper SEO
|
|
36
|
+
style={{ opacity: layout == null ? 0 : undefined }}
|
|
35
37
|
>
|
|
36
38
|
{parameters && Element && (
|
|
37
39
|
<Element
|
package/.idea/modules.xml
DELETED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
-
<project version="4">
|
|
3
|
-
<component name="ProjectModuleManager">
|
|
4
|
-
<modules>
|
|
5
|
-
<module fileurl="file://$PROJECT_DIR$/.idea/sdk-nextjs.iml" filepath="$PROJECT_DIR$/.idea/sdk-nextjs.iml" />
|
|
6
|
-
</modules>
|
|
7
|
-
</component>
|
|
8
|
-
</project>
|
package/.idea/sdk-nextjs.iml
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
-
<module type="WEB_MODULE" version="4">
|
|
3
|
-
<component name="NewModuleRootManager">
|
|
4
|
-
<content url="file://$MODULE_DIR$">
|
|
5
|
-
<excludeFolder url="file://$MODULE_DIR$/temp" />
|
|
6
|
-
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
|
|
7
|
-
<excludeFolder url="file://$MODULE_DIR$/tmp" />
|
|
8
|
-
</content>
|
|
9
|
-
<orderEntry type="inheritedJdk" />
|
|
10
|
-
<orderEntry type="sourceFolder" forTests="false" />
|
|
11
|
-
</component>
|
|
12
|
-
</module>
|