@cntrl-site/sdk-nextjs 0.8.1 → 0.8.3

package/lib/components/LinkWrapper.js

@@ -4,7 +4,7 @@ exports.LinkWrapper = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const LinkWrapper = ({ url, children }) => {
     const validUrl = url && buildValidUrl(url);
-    return url ? ((0, jsx_runtime_1.jsx)("a", { href: validUrl, target: url.startsWith('/') ? '_self' : '_blank', rel: "noreferrer", children: children })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children }));
+    return url ? ((0, jsx_runtime_1.jsx)("a", { href: validUrl, target: url.startsWith('/') || url.startsWith('#') ? '_self' : '_blank', rel: "noreferrer", children: children })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children }));
 };
 exports.LinkWrapper = LinkWrapper;
 function buildValidUrl(url) {

package/lib/components/Section.js

@@ -22,7 +22,7 @@ const Section = ({ section, children }) => {
           }`;
         }, '');
     };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: `section-${section.id}`, style: {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: `section-${section.id}`, id: section.name, style: {
                     backgroundColor: backgroundColor
                 }, children: children }), (0, jsx_runtime_1.jsx)("style", { jsx: true, children: `
       ${(0, sdk_1.getLayoutStyles)(layouts, [section.height], ([height]) => (`

package/lib/utils/RichTextConverter/RichTextConverter.js

@@ -54,13 +54,14 @@ class RichTextConverter {
                 const kids = [];
                 layouts.forEach(l => {
                     const ta = richText.layoutParams[l.id].textAlign;
+                    const whiteSpace = ta === sdk_1.TextAlign.Right ? 'normal' : 'pre-wrap';
                     styleRules[l.id].push(`
             .${blockClass} {
               display: ${group.some(g => g.layout === l.id) ? 'block' : 'none'};
               text-align: ${ta};
-              white-space: normal;
+              white-space: ${whiteSpace};
               overflow-wrap: break-word;
-              ${!hasPreset && 'line-height: 0;'}
+              ${!hasPreset ? 'line-height: 0;' : ''}
             }
           `);
                 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cntrl-site/sdk-nextjs",
-  "version": "0.8.1",
+  "version": "0.8.3",
   "description": "SDK for Next.js",
   "main": "lib/index.js",
   "types": "src/index.js",

package/src/components/LinkWrapper.tsx

@@ -10,7 +10,7 @@ export const LinkWrapper: React.FC<Props> = ({ url, children }) => {
   return url ? (
     <a
       href={validUrl}
-      target={url.startsWith('/') ? '_self' : '_blank'}
+      target={url.startsWith('/') || url.startsWith('#') ? '_self' : '_blank'}
       rel="noreferrer"
     >
       {children}

package/src/components/Section.tsx

@@ -4,8 +4,7 @@ import {
   getLayoutStyles,
   TArticleSection,
   TSectionHeight,
-  SectionHeightMode,
-  CntrlColor
+  SectionHeightMode
 } from '@cntrl-site/sdk';
 import { useCntrlContext } from '../provider/useCntrlContext';
 import { useSectionColor } from './useSectionColor';
@@ -39,6 +38,7 @@ export const Section: FC<Props> = ({ section, children }) => {
     <>
       <div
         className={`section-${section.id}`}
+        id={section.name}
         style={{
           backgroundColor: backgroundColor
         }}

package/src/utils/RichTextConverter/RichTextConverter.tsx

@@ -6,7 +6,8 @@ import {
   TextTransform,
   TLayout,
   TRichTextItem,
-  VerticalAlign
+  VerticalAlign,
+  TextAlign
 } from '@cntrl-site/sdk';
 import { LinkWrapper } from '../../components/LinkWrapper';
 
@@ -84,13 +85,14 @@ export class RichTextConverter {
         const kids: ReactNode[] = [];
         layouts.forEach(l => {
           const ta = richText.layoutParams[l.id].textAlign;
+          const whiteSpace = ta === TextAlign.Right ? 'normal' : 'pre-wrap';
           styleRules[l.id].push(`
             .${blockClass} {
               display: ${group.some(g => g.layout === l.id) ? 'block' : 'none'};
               text-align: ${ta};
-              white-space: normal;
+              white-space: ${whiteSpace};
               overflow-wrap: break-word;
-              ${!hasPreset && 'line-height: 0;'}
+              ${!hasPreset ? 'line-height: 0;' : ''}
             }
           `);
         });