@cntrl-site/sdk-nextjs 1.9.71-0 → 1.9.71-2

package/lib/components/Section/Section.js

@@ -27,7 +27,7 @@ const Section = ({ section, data, zIndex, articleHeight }) => {
     const layout = (0, useLayoutContext_1.useLayoutContext)();
     const [sectionHeight, setSectionHeight] = (0, react_1.useState)(0);
     const layoutValues = [
-        section.type === 'freehand' ? section.height : section.minHeight,
+        section.minHeight,
         section.color,
         (_a = section.media) !== null && _a !== void 0 ? _a : {}
     ];
@@ -65,14 +65,13 @@ const Section = ({ section, data, zIndex, articleHeight }) => {
         observer.observe(sectionRef.current);
         return () => observer.disconnect();
     }, []);
-    const children = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [section.type !== 'freehand' && ((0, jsx_runtime_1.jsx)(StructuredContent_1.StructuredContent, { section: section })), section.items.map(item => ((0, jsx_runtime_1.jsx)(Item_1.Item, { sectionHeight: sectionHeight, item: item, sectionId: section.id, articleHeight: articleHeight }, item.id)))] }));
+    const children = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(StructuredContent_1.StructuredContent, { section: section }), section.items.map(item => ((0, jsx_runtime_1.jsx)(Item_1.Item, { sectionHeight: sectionHeight, item: item, sectionId: section.id, articleHeight: articleHeight }, item.id)))] }));
     if (SectionComponent)
         return (0, jsx_runtime_1.jsx)("div", { ref: sectionRef, children: (0, jsx_runtime_1.jsx)(SectionComponent, { data: data, children: children }) });
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: `section-${section.id}`, id: section.name, ref: sectionRef, style: { zIndex }, children: [media && media.size !== 'none' && sectionRef.current && ((0, jsx_runtime_1.jsx)("div", { className: `section-background-overlay-${section.id}`, children: (0, jsx_runtime_1.jsxs)("div", { className: `section-background-wrapper-${section.id}`, style: Object.assign({ transform: media.position === 'fixed' ? 'translateY(-100vh)' : 'unset' }, (sectionHeight && { height: media.position === 'fixed' ? `calc(${sectionHeight}px + 200vh)` : `${sectionHeight}px` })), children: [media.type === 'video' && ((0, jsx_runtime_1.jsx)(SectionVideo_1.SectionVideo, { container: sectionRef.current, sectionId: section.id, media: media })), media.type === 'image' && ((0, jsx_runtime_1.jsx)(SectionImage_1.SectionImage, { media: media, sectionId: section.id }))] }, `section-background-wrapper-${section.id}`) })), children] }), (0, jsx_runtime_1.jsx)(style_1.default, { id: id, children: `
       ${(0, sdk_1.getLayoutStyles)(layouts, layoutValues, ([height, color, media]) => (`
          .section-${section.id} {
-            height: ${section.type === 'freehand' ? getSectionHeight(height) : 'auto'};
-            min-height: ${section.type !== 'freehand' ? getSectionHeight(height) : 'unset'};
+            min-height: ${getSectionHeight(height)};
             position: relative;
             background-color: ${color_1.CntrlColor.parse(color !== null && color !== void 0 ? color : DEFAULT_COLOR).fmt('rgba')};
          }

package/lib/components/StructuredContent/StructuredContent.js

@@ -14,10 +14,10 @@ const StructuredContent = ({ section }) => {
     const reactId = (0, react_1.useId)();
     const id = `${reactId}-structured-content-${section.id}`;
     const { layouts } = (0, useCntrlContext_1.useCntrlContext)();
-    const paddingBottomRecord = section.type !== 'freehand' ? section.structuredContentSettings.paddingBottom : {};
+    const structuredContentLength = section.structuredContent.length;
     const defaultWidthRecord = section.type === 'content-based' ? section.structuredContentSettings.defaultWidth : {};
-    const layoutValues = [paddingBottomRecord, defaultWidthRecord];
-    if (section.type === 'freehand')
+    const layoutValues = [section.structuredContentSettings.paddingBottom, defaultWidthRecord];
+    if (structuredContentLength === 0)
         return null;
     return ((0, jsx_runtime_1.jsxs)("div", { className: `structured-content-${section.id}`, children: [section.structuredContent.map(block => ((0, jsx_runtime_1.jsx)(StructuredBlockItem_1.StructuredBlockItem, { block: block, maxWidthMap: defaultWidthRecord }, block.id))), (0, jsx_runtime_1.jsx)(style_1.default, { id: id, children: `
           ${(0, sdk_1.getLayoutStyles)(layouts, layoutValues, ([paddingBottom, defaultWidth]) => {

package/lib/provider/CntrlSdkContext.js

@@ -78,7 +78,7 @@ class CntrlSdkContext {
     }
     setSectionsHeight(sections) {
         for (const section of sections) {
-            this.sectionHeightMap.set(section.id, section.type === 'freehand' ? section.height : section.minHeight);
+            this.sectionHeightMap.set(section.id, section.minHeight);
         }
     }
     getSectionHeightData(sectionId) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cntrl-site/sdk-nextjs",
-  "version": "1.9.71-0",
+  "version": "1.9.71-2",
   "description": "SDK for Next.js",
   "author": "arsen@momdesign.nyc",
   "license": "MIT",
@@ -31,9 +31,9 @@
   "dependencies": {
     "@antfu/eslint-config": "^3.8.0",
     "@cntrl-site/color": "^1.0.0",
-    "@cntrl-site/components": "^1.0.9",
+    "@cntrl-site/components": "^1.0.12-alpha.1",
     "@cntrl-site/effects": "^1.4.2",
-    "@cntrl-site/sdk": "^1.28.0-5",
+    "@cntrl-site/sdk": "1.28.0-6",
     "@types/vimeo__player": "^2.18.0",
     "@vimeo/player": "^2.25.0",
     "html-react-parser": "^3.0.1",

package/src/components/Section/Section.tsx

@@ -34,10 +34,11 @@ export const Section: FC<PropsWithChildren<Props>> = ({ section, data, zIndex, a
   const layout = useLayoutContext();
   const [sectionHeight, setSectionHeight] = useState(0);
   const layoutValues: Record<string, any>[] = [
-    section.type === 'freehand' ? section.height : section.minHeight,
+    section.minHeight,
     section.color,
     section.media ?? {}
   ];
+
   const SectionComponent = section.name ? customSections.getComponent(section.name) : undefined;
   useSectionRegistry(section.id, sectionRef.current);
   const layoutMedia = layout && section.media && section.media[layout] ? section.media[layout] : undefined;
@@ -80,9 +81,7 @@ export const Section: FC<PropsWithChildren<Props>> = ({ section, data, zIndex, a
 
   const children = (
     <>
-      {section.type !== 'freehand' && (
-        <StructuredContent section={section} />
-      )}
+      <StructuredContent section={section} />
       {section.items.map(item => (
         <Item
           sectionHeight={sectionHeight}
@@ -130,8 +129,7 @@ export const Section: FC<PropsWithChildren<Props>> = ({ section, data, zIndex, a
       ${
     getLayoutStyles(layouts, layoutValues, ([height, color, media]) => (`
          .section-${section.id} {
-            height: ${section.type === 'freehand' ? getSectionHeight(height) : 'auto'};
-            min-height: ${section.type !== 'freehand' ? getSectionHeight(height) : 'unset'};
+            min-height: ${getSectionHeight(height)};
             position: relative;
             background-color: ${CntrlColor.parse(color ?? DEFAULT_COLOR).fmt('rgba')};
          }

package/src/components/StructuredContent/StructuredContent.tsx

@@ -3,7 +3,6 @@ import { FC, useId } from 'react';
 import JSXStyle from 'styled-jsx/style';
 import { useCntrlContext } from '../../provider/useCntrlContext';
 import { StructuredBlockItem } from '../StructuredBlockItem/StructuredBlockItem';
-import { useLayoutContext } from '../useLayoutContext';
 
 interface Props {
   section: Section;
@@ -13,10 +12,10 @@ export const StructuredContent: FC<Props> = ({ section }) => {
   const reactId = useId();
   const id = `${reactId}-structured-content-${section.id}`;
   const { layouts } = useCntrlContext();
-  const paddingBottomRecord = section.type !== 'freehand' ? section.structuredContentSettings.paddingBottom : {};
+  const structuredContentLength = section.structuredContent.length;
   const defaultWidthRecord = section.type === 'content-based' ? section.structuredContentSettings.defaultWidth : {};
-  const layoutValues: Record<string, any>[] = [paddingBottomRecord, defaultWidthRecord];
-  if (section.type === 'freehand') return null;
+  const layoutValues: Record<string, any>[] = [section.structuredContentSettings.paddingBottom, defaultWidthRecord];
+  if (structuredContentLength === 0) return null;
   return (
     <div className={`structured-content-${section.id}`}>
       {section.structuredContent.map(block => (

package/src/provider/CntrlSdkContext.ts

@@ -86,7 +86,7 @@ export class CntrlSdkContext {
 
   setSectionsHeight(sections: Section[]) {
     for (const section of sections) {
-      this.sectionHeightMap.set(section.id, section.type === 'freehand' ? section.height : section.minHeight);
+      this.sectionHeightMap.set(section.id, section.minHeight);
     }
   }