@levo-so/blocks 0.1.59 → 0.1.61

package/src/blocks/content/content-3.tsx

@@ -3,17 +3,15 @@ import {
   Button,
   Container,
   Heading,
+  type ILevoBlockBaseProps,
   Section,
   Typography,
-  type ILevoBlockBaseProps,
 } from "@levo-so/studio";
 import React from "react";
 
-import { type IContent3Content } from "./content-3.schema";
+import type { IContent3Content } from "./content-3.schema";
 
-const Content3: React.FC<ILevoBlockBaseProps<IContent3Content>> = ({
-  content,
-}) => (
+const Content3: React.FC<ILevoBlockBaseProps<IContent3Content>> = ({ content }) => (
   <Section elementKey="layout">
     <Container elementKey="container">
       <Box elementKey="header_wrapper">
@@ -23,27 +21,25 @@ const Content3: React.FC<ILevoBlockBaseProps<IContent3Content>> = ({
       <Box elementKey="services_levoGroup" data-levo_group>
         {(content.services ?? []).map((_: any, index: number) => (
           <React.Fragment key={`service-${index}`}>
-            <Box
-              key={index}
-              data-levo_group_item
-              elementKey={`services.${index}.service_item`}
-            >
+            <Box key={index} data-levo_group_item elementKey={`services.${index}.service_item`}>
               <Box elementKey={`services.${index}.number_wrapper`}>
                 <Typography elementKey={`services.${index}.number`} />
               </Box>
               {/* <Box elementKey={`services.${index}.content_wrapper`}> */}
               <Heading elementKey={`services.${index}.service_title`} />
-              <Typography
-                elementKey={`services.${index}.service_description`}
-              />
-              <Button elementKey={`services.${index}.cta`} />
+              <Typography elementKey={`services.${index}.service_description`} />
+              <Box elementKey={`services.${index}.ctas_levoGroup`} data-levo_group>
+                {content?.services?.[index]?.ctas?.map((_: unknown, buttonIndex: number) => (
+                  <Button
+                    key={buttonIndex}
+                    elementKey={`services.${index}.ctas.${buttonIndex}.cta`}
+                  />
+                ))}
+              </Box>
             </Box>
             {/* </Box> */}
             {index < (content.services?.length ?? 0) - 1 && (
-              <Box
-                elementKey={`services.${index}.separator`}
-                data-levo_group_item
-              />
+              <Box elementKey={`services.${index}.separator`} data-levo_group_item />
             )}
           </React.Fragment>
         ))}

package/src/blocks/content/content-4.schema.ts

@@ -1,41 +1,71 @@
 import type { IBlock } from "@levo-so/studio";
 
+const MEDIA_1 = {
+  id: "FUGzXfuqLJcO",
+  filename: "content-4-1.png",
+  kind: "image",
+  location: "https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD.png",
+  srcset: {
+    "1080w": "https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-1080w.webp",
+    "1200w": "https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-1200w.webp",
+    "1920w": "https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-1920w.webp",
+    "320w": "https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-320w.webp",
+    "640w": "https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-640w.webp",
+    "750w": "https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-750w.webp",
+    "828w": "https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-828w.webp",
+    path: "https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-320w.webp 320w, https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-640w.webp 640w, https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-750w.webp 750w, https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-828w.webp 828w, https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-1080w.webp 1080w, https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-1200w.webp 1200w, https://static.levocdn.com/WLZ1TXTD/content-4-1-WT0prEuNWdrD-1920w.webp 1920w",
+  },
+  mimetype: "image/png",
+};
+const MEDIA_2 = {
+  id: "n3qKfSsUBdOV",
+  filename: "content-4-2.png",
+  kind: "image",
+  location: "https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr.png",
+  srcset: {
+    "1080w": "https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-1080w.webp",
+    "1200w": "https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-1200w.webp",
+    "1920w": "https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-1920w.webp",
+    "320w": "https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-320w.webp",
+    "640w": "https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-640w.webp",
+    "750w": "https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-750w.webp",
+    "828w": "https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-828w.webp",
+    path: "https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-828w.webp 828w, https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-1200w.webp 1200w, https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-1080w.webp 1080w, https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-1920w.webp 1920w, https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-320w.webp 320w, https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-640w.webp 640w, https://static.levocdn.com/WLZ1TXTD/content-4-2-c2uLaNTV0Lsr-750w.webp 750w",
+  },
+  mimetype: "image/png",
+};
+const MEDIA_3 = {
+  id: "74ddDI5SHVXv",
+  filename: "content-4-3.png",
+  kind: "image",
+  location: "https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I.png",
+  srcset: {
+    "1080w": "https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-1080w.webp",
+    "1200w": "https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-1200w.webp",
+    "1920w": "https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-1920w.webp",
+    "320w": "https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-320w.webp",
+    "640w": "https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-640w.webp",
+    "750w": "https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-750w.webp",
+    "828w": "https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-828w.webp",
+    path: "https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-1920w.webp 1920w, https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-320w.webp 320w, https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-640w.webp 640w, https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-750w.webp 750w, https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-828w.webp 828w, https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-1080w.webp 1080w, https://static.levocdn.com/WLZ1TXTD/content-4-3-MqnFyg8y4T3I-1200w.webp 1200w",
+  },
+  mimetype: "image/png",
+};
+
 const DEFAULT_CONTENT = {
   layout: null,
   container: null,
   header_section: null,
   title: "Why Choose Our Platform",
+  description:
+    "Why Choose Our Platform Why Choose Our Platform Why Choose Our Platform Why Choose Our Platform",
   items: [
     {
       wrapper: null,
       text_container: null,
       item_title: "Personalized Training Plans",
-      description:
-        "No one-size-fits-all workouts here. Your goals, your body, your pace.",
-      image: {
-        id: "7141014160938075687",
-        location:
-          "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH.png",
-        kind: "image",
-        mimetype: "image/png",
-        srcset: {
-          "1080w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp",
-          "1200w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp",
-          "1920w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp",
-          "320w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp",
-          "640w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp",
-          "750w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp",
-          "828w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp",
-          path: "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp 640w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp 1080w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp 1200w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp 1920w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp 320w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp 750w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp 828w",
-        },
-      },
+      description: "No one-size-fits-all workouts here. Your goals, your body, your pace.",
+      image: MEDIA_1,
     },
     {
       wrapper: null,
@@ -43,61 +73,14 @@ const DEFAULT_CONTENT = {
       item_title: "Real Accountability",
       description:
         "Get the support and motivation you need to stay on track with your fitness journey.",
-      image: {
-        id: "7141014160938075687",
-        location:
-          "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH.png",
-        kind: "image",
-        mimetype: "image/png",
-        srcset: {
-          "1080w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp",
-          "1200w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp",
-          "1920w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp",
-          "320w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp",
-          "640w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp",
-          "750w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp",
-          "828w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp",
-          path: "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp 640w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp 1080w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp 1200w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp 1920w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp 320w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp 750w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp 828w",
-        },
-      },
+      image: MEDIA_2,
     },
     {
       wrapper: null,
       text_container: null,
       item_title: "Train Anywhere, Anytime",
-      description:
-        "Access your workouts from anywhere with our mobile-first platform design.",
-      image: {
-        id: "7141014160938075687",
-        location:
-          "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH.png",
-        kind: "image",
-        mimetype: "image/png",
-        srcset: {
-          "1080w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp",
-          "1200w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp",
-          "1920w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp",
-          "320w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp",
-          "640w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp",
-          "750w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp",
-          "828w":
-            "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp",
-          path: "https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp 640w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp 1080w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp 1200w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp 1920w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp 320w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp 750w, https://static.levocdn.com/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp 828w",
-        },
-      },
+      description: "Access your workouts from anywhere with our mobile-first platform design.",
+      image: MEDIA_3,
     },
   ],
 };
@@ -132,7 +115,11 @@ export const Content4: IBlock = {
       label: "Title",
       field_interface: "HeadingWidget",
     },
-
+    {
+      key: "description",
+      label: "Description",
+      field_interface: "TypographyWidget",
+    },
     {
       key: "items",
       label: "Content Items",
@@ -151,7 +138,7 @@ export const Content4: IBlock = {
         {
           key: "item_title",
           label: "Item Title",
-          field_interface: "TypographyWidget",
+          field_interface: "HeadingWidget",
         },
         {
           key: "description",
@@ -171,15 +158,12 @@ export const Content4: IBlock = {
       key: "default",
       title: "Default",
       styles: {
-        layout: {
-          "padding-top": "3xl",
-          "padding-bottom": "3xl",
-        },
+        layout: {},
+        container: {},
         header_section: {
           "margin-bottom": "2xl",
           "text-align": "center",
         },
-
         items_levoGroup: {
           display: "flex",
           "flex-direction": "column",
@@ -238,8 +222,7 @@ export const Content4: IBlock = {
               "justify-content": "space-between",
             },
             item_title: {
-              "font-size": "4xl",
-              "padding-bottom": "xs",
+              "padding-bottom": "2xs",
             },
             image: {
               width: "300px",
@@ -252,8 +235,7 @@ export const Content4: IBlock = {
             },
             text_container: {},
             item_title: {
-              "font-size": "4xl",
-              "padding-bottom": "xs",
+              "padding-bottom": "2xs",
             },
             image: {
               width: "300px",
@@ -265,8 +247,7 @@ export const Content4: IBlock = {
               "justify-content": "space-between",
             },
             item_title: {
-              "font-size": "4xl",
-              "padding-bottom": "xs",
+              "padding-bottom": "2xs",
             },
             image: {
               width: "300px",
@@ -281,6 +262,41 @@ export const Content4: IBlock = {
             Heading_Level: "H2",
           },
         },
+        items: [
+          {
+            item_title: {
+              heading: {
+                level: "4",
+              },
+              selectedVariants: {
+                Heading_Level: "H3",
+              },
+            },
+            description: {
+              selectedVariants: {},
+            },
+          },
+          {
+            item_title: {
+              selectedVariants: {
+                Heading_Level: "H3",
+              },
+            },
+            description: {
+              selectedVariants: {},
+            },
+          },
+          {
+            item_title: {
+              selectedVariants: {
+                Heading_Level: "H3",
+              },
+            },
+            description: {
+              selectedVariants: {},
+            },
+          },
+        ],
       },
     },
   ],

package/src/blocks/content/content-4.tsx

@@ -1,41 +1,33 @@
-import React from "react";
 import {
-  type ILevoBlockBaseProps,
+  Box,
+  Container,
   Heading,
+  type ILevoBlockBaseProps,
   Image,
-  Typography,
-  Container,
   Section,
-  Box,
+  Typography,
 } from "@levo-so/studio";
+import type React from "react";
 
 import type { IContent4Content } from "./content-4.schema";
 
-const Content4: React.FC<ILevoBlockBaseProps<IContent4Content>> = ({
-  content,
-}) => {
+const Content4: React.FC<ILevoBlockBaseProps<IContent4Content>> = ({ content }) => {
   return (
     <Section elementKey="layout">
       <Container elementKey="container">
         <Box elementKey="header_section">
           <Heading elementKey="title" />
+          <Typography elementKey="description" />
         </Box>
 
         <Box elementKey="items_levoGroup" data-levo_group>
           {(content.items ?? []).map((_, index: number) => (
-            <Box
-              key={index}
-              elementKey={`items.${index}.wrapper`}
-              data-levo_group_item
-            >
+            <Box key={index} elementKey={`items.${index}.wrapper`} data-levo_group_item>
               <Box elementKey={`items.${index}.text_container`}>
-                <Typography elementKey={`items.${index}.item_title`} />
+                <Heading elementKey={`items.${index}.item_title`} />
                 <Typography elementKey={`items.${index}.description`} />
               </Box>
-              <Image
-                elementKey={`items.${index}.image`}
-                alt={`Content item ${index + 1}`}
-              />
+              <Image elementKey={`items.${index}.image`} alt={`Content item ${index + 1}`} />
             </Box>
           ))}
         </Box>