@levo-so/blocks 0.1.75 → 0.1.77

package/src/blocks/blogs/blog-listing-1.schema.ts

@@ -52,6 +52,8 @@ const DEFAULT_CONTENT = {
   title: "Building Wealth Together",
   description:
     "Our comprehensive financial services help you achieve your goals through expert guidance and innovative solutions.",
+  ctas_LevoGroup: null,
+  ctas: [{ cta: "Learn More" }, { cta: "View All" }],
   blogs: Array(3)
     ?.fill(0)
     ?.map((_) => BLOG_CONTENT),
@@ -61,95 +63,174 @@ const DEFAULT_CONTENT = {
   "pagination-right": "Next",
 };
 
-const BLOG_STYLE = {
-  blog: {
-    display: "flex",
-    "column-gap": "lg",
-    "border-radius": "base",
-    "border-width": "1.5px",
-    "border-style": "solid",
-    "border-color": "border",
-    "padding-left": "xl",
-    "padding-right": "xl",
-    "padding-top": "lg",
-    "padding-bottom": "lg",
-    "box-shadow": "md",
-  },
-  cover_image: {
-    height: "184px",
-    width: "64",
-    "border-radius": "base",
-    "object-fit": "cover",
-  },
-  blog_content_wrapper: {
-    display: "flex",
-    width: "100%",
-    flex: "1",
-    "align-items": "center",
-    "column-gap": "lg",
-  },
-  text_content_wrapper: {
-    display: "flex",
-    flex: "1",
-    "flex-direction": "column",
-    "row-gap": "xs",
-  },
-  timestamp_icon: {},
-  timestamp_wrapper: {
-    display: "flex",
-    width: "fit-content",
-    "align-items": "center",
-    "column-gap": "2xs",
-    "border-radius": "xl",
-    "background-color": "#e9e9eb",
-    "padding-left": "xs",
-    "padding-right": "xs",
-    "padding-top": "5xs",
-    "padding-bottom": "5xs",
-  },
-  timestamp: {
-    "font-size": "sm",
-    "font-weight": "semibold",
-    color: "text-2",
-  },
-  blog_info_wrapper: {
-    display: "flex",
-    width: "100%",
-    "flex-direction": "column",
-    "row-gap": "3xs",
-  },
-  title: {
-    color: "text-1",
-  },
-  description: {
-    "font-size": "base",
-    color: "text-2",
-  },
-  author_wrapper: {
-    display: "flex",
-    "align-items": "center",
-    "column-gap": "base",
-  },
-  author_image: {
-    height: "36px",
-    width: "36px",
-    "border-radius": "100%",
-    "object-fit": "cover",
-  },
-  author_name: {
-    color: "text-1",
-  },
-  author_description: {
-    "font-size": "sm",
-    color: "text-2",
-  },
-  cta: {},
+const DEFAULT_CONTENT_NO_BORDER = {
+  layout: null,
+  container: null,
+  text_wrapper: null,
+  title: "Building Wealth Together",
+  description:
+    "Our comprehensive financial services help you achieve your goals through expert guidance and innovative solutions.",
+  ctas_LevoGroup: null,
+  ctas: [
+    {
+      cta: "Learn More",
+    },
+    {
+      cta: "View All",
+    },
+  ],
+  blogs: [
+    {
+      blog: null,
+      cover_image: {
+        id: "7141014160938075687",
+        location: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH.png",
+        kind: "image",
+        mimetype: "image/png",
+        srcset: {
+          "1080w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp",
+          "1200w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp",
+          "1920w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp",
+          "320w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp",
+          "640w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp",
+          "750w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp",
+          "828w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp",
+          path: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp 640w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp 1080w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp 1200w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp 1920w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp 320w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp 750w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp 828w",
+        },
+      },
+      blog_content_wrapper: null,
+      text_content_wrapper: null,
+      timestamp_wrapper: null,
+      timestamp_icon: null,
+      timestamp: "Today, 12:00",
+      title:
+        "Our comprehensive financial services help you achieve your goals through expert guidance and innovative solutions.",
+      description:
+        "Our comprehensive financial services help you achieve your goals through expert guidance and innovative solutions.",
+      author_wrapper: null,
+      author_image: {
+        kind: "icon",
+        data: {
+          id: "archive-minus",
+          label: "Archive Minus",
+          tags: ["archive", "custom", "directional", "minus"],
+          svgCode:
+            '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M14.5 11.4H9.5C9.09 11.4 8.75 11.06 8.75 10.65C8.75 10.24 9.09 9.90002 9.5 9.90002H14.5C14.91 9.90002 15.25 10.24 15.25 10.65C15.25 11.06 14.91 11.4 14.5 11.4Z" fill="var(--color-icon-primary)"/>\n<path d="M4.92957 22.75C4.50957 22.75 4.11957 22.65 3.76957 22.45C2.99957 22 2.55957 21.09 2.55957 19.96V5.86C2.55957 3.32 4.62957 1.25 7.16957 1.25H16.8196C19.3596 1.25 21.4296 3.32 21.4296 5.86V19.95C21.4296 21.08 20.9896 21.99 20.2196 22.44C19.4496 22.89 18.4396 22.84 17.4496 22.29L12.5696 19.58C12.2796 19.42 11.7096 19.42 11.4196 19.58L6.53957 22.29C5.99957 22.59 5.44957 22.75 4.92957 22.75ZM7.17957 2.75C5.46957 2.75 4.06957 4.15 4.06957 5.86V19.95C4.06957 20.54 4.23957 20.98 4.53957 21.15C4.83957 21.33 5.30957 21.27 5.81957 20.98L10.6996 18.27C11.4396 17.86 12.5596 17.86 13.2996 18.27L18.1796 20.98C18.6896 21.27 19.1596 21.33 19.4596 21.15C19.7596 20.97 19.9296 20.53 19.9296 19.95V5.86C19.9296 4.15 18.5296 2.75 16.8196 2.75H7.17957Z" fill="var(--color-icon-primary)"/>\n</svg>',
+        },
+      },
+      author_name: "John Doe",
+      author_description: "Marketing Coordinator",
+      cta: "Read more",
+    },
+    {
+      blog: null,
+      cover_image: {
+        id: "7141014160938075687",
+        location: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH.png",
+        kind: "image",
+        mimetype: "image/png",
+        srcset: {
+          "1080w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp",
+          "1200w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp",
+          "1920w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp",
+          "320w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp",
+          "640w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp",
+          "750w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp",
+          "828w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp",
+          path: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp 640w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp 1080w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp 1200w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp 1920w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp 320w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp 750w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp 828w",
+        },
+      },
+      blog_content_wrapper: null,
+      text_content_wrapper: null,
+      timestamp_wrapper: null,
+      timestamp_icon: {
+        kind: "icon",
+        data: {
+          id: "archive-minus",
+          label: "Archive Minus",
+          tags: ["archive", "custom", "directional", "minus"],
+          svgCode:
+            '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M14.5 11.4H9.5C9.09 11.4 8.75 11.06 8.75 10.65C8.75 10.24 9.09 9.90002 9.5 9.90002H14.5C14.91 9.90002 15.25 10.24 15.25 10.65C15.25 11.06 14.91 11.4 14.5 11.4Z" fill="var(--color-icon-primary)"/>\n<path d="M4.92957 22.75C4.50957 22.75 4.11957 22.65 3.76957 22.45C2.99957 22 2.55957 21.09 2.55957 19.96V5.86C2.55957 3.32 4.62957 1.25 7.16957 1.25H16.8196C19.3596 1.25 21.4296 3.32 21.4296 5.86V19.95C21.4296 21.08 20.9896 21.99 20.2196 22.44C19.4496 22.89 18.4396 22.84 17.4496 22.29L12.5696 19.58C12.2796 19.42 11.7096 19.42 11.4196 19.58L6.53957 22.29C5.99957 22.59 5.44957 22.75 4.92957 22.75ZM7.17957 2.75C5.46957 2.75 4.06957 4.15 4.06957 5.86V19.95C4.06957 20.54 4.23957 20.98 4.53957 21.15C4.83957 21.33 5.30957 21.27 5.81957 20.98L10.6996 18.27C11.4396 17.86 12.5596 17.86 13.2996 18.27L18.1796 20.98C18.6896 21.27 19.1596 21.33 19.4596 21.15C19.7596 20.97 19.9296 20.53 19.9296 19.95V5.86C19.9296 4.15 18.5296 2.75 16.8196 2.75H7.17957Z" fill="var(--color-icon-primary)"/>\n</svg>',
+        },
+      },
+      timestamp: "Today, 12:00",
+      title:
+        "Our comprehensive financial services help you achieve your goals through expert guidance and innovative solutions.",
+      description:
+        "Our comprehensive financial services help you achieve your goals through expert guidance and innovative solutions.",
+      author_wrapper: null,
+      author_image: {
+        kind: "icon",
+        data: {
+          id: "archive-minus",
+          label: "Archive Minus",
+          tags: ["archive", "custom", "directional", "minus"],
+          svgCode:
+            '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M14.5 11.4H9.5C9.09 11.4 8.75 11.06 8.75 10.65C8.75 10.24 9.09 9.90002 9.5 9.90002H14.5C14.91 9.90002 15.25 10.24 15.25 10.65C15.25 11.06 14.91 11.4 14.5 11.4Z" fill="var(--color-icon-primary)"/>\n<path d="M4.92957 22.75C4.50957 22.75 4.11957 22.65 3.76957 22.45C2.99957 22 2.55957 21.09 2.55957 19.96V5.86C2.55957 3.32 4.62957 1.25 7.16957 1.25H16.8196C19.3596 1.25 21.4296 3.32 21.4296 5.86V19.95C21.4296 21.08 20.9896 21.99 20.2196 22.44C19.4496 22.89 18.4396 22.84 17.4496 22.29L12.5696 19.58C12.2796 19.42 11.7096 19.42 11.4196 19.58L6.53957 22.29C5.99957 22.59 5.44957 22.75 4.92957 22.75ZM7.17957 2.75C5.46957 2.75 4.06957 4.15 4.06957 5.86V19.95C4.06957 20.54 4.23957 20.98 4.53957 21.15C4.83957 21.33 5.30957 21.27 5.81957 20.98L10.6996 18.27C11.4396 17.86 12.5596 17.86 13.2996 18.27L18.1796 20.98C18.6896 21.27 19.1596 21.33 19.4596 21.15C19.7596 20.97 19.9296 20.53 19.9296 19.95V5.86C19.9296 4.15 18.5296 2.75 16.8196 2.75H7.17957Z" fill="var(--color-icon-primary)"/>\n</svg>',
+        },
+      },
+      author_name: "John Doe",
+      author_description: "Marketing Coordinator",
+      cta: "Read more",
+    },
+    {
+      blog: null,
+      cover_image: {
+        id: "7141014160938075687",
+        location: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH.png",
+        kind: "image",
+        mimetype: "image/png",
+        srcset: {
+          "1080w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp",
+          "1200w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp",
+          "1920w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp",
+          "320w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp",
+          "640w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp",
+          "750w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp",
+          "828w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp",
+          path: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp 640w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp 1080w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp 1200w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp 1920w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp 320w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp 750w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp 828w",
+        },
+      },
+      blog_content_wrapper: null,
+      text_content_wrapper: null,
+      timestamp_wrapper: null,
+      timestamp_icon: {
+        kind: "icon",
+        data: {
+          id: "archive-minus",
+          label: "Archive Minus",
+          tags: ["archive", "custom", "directional", "minus"],
+          svgCode:
+            '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M14.5 11.4H9.5C9.09 11.4 8.75 11.06 8.75 10.65C8.75 10.24 9.09 9.90002 9.5 9.90002H14.5C14.91 9.90002 15.25 10.24 15.25 10.65C15.25 11.06 14.91 11.4 14.5 11.4Z" fill="var(--color-icon-primary)"/>\n<path d="M4.92957 22.75C4.50957 22.75 4.11957 22.65 3.76957 22.45C2.99957 22 2.55957 21.09 2.55957 19.96V5.86C2.55957 3.32 4.62957 1.25 7.16957 1.25H16.8196C19.3596 1.25 21.4296 3.32 21.4296 5.86V19.95C21.4296 21.08 20.9896 21.99 20.2196 22.44C19.4496 22.89 18.4396 22.84 17.4496 22.29L12.5696 19.58C12.2796 19.42 11.7096 19.42 11.4196 19.58L6.53957 22.29C5.99957 22.59 5.44957 22.75 4.92957 22.75ZM7.17957 2.75C5.46957 2.75 4.06957 4.15 4.06957 5.86V19.95C4.06957 20.54 4.23957 20.98 4.53957 21.15C4.83957 21.33 5.30957 21.27 5.81957 20.98L10.6996 18.27C11.4396 17.86 12.5596 17.86 13.2996 18.27L18.1796 20.98C18.6896 21.27 19.1596 21.33 19.4596 21.15C19.7596 20.97 19.9296 20.53 19.9296 19.95V5.86C19.9296 4.15 18.5296 2.75 16.8196 2.75H7.17957Z" fill="var(--color-icon-primary)"/>\n</svg>',
+        },
+      },
+      timestamp: "Today, 12:00",
+      title:
+        "Our comprehensive financial services help you achieve your goals through expert guidance and innovative solutions.",
+      description:
+        "Our comprehensive financial services help you achieve your goals through expert guidance and innovative solutions.",
+      author_wrapper: null,
+      author_image: {
+        kind: "icon",
+        data: {
+          id: "archive-minus",
+          label: "Archive Minus",
+          tags: ["archive", "custom", "directional", "minus"],
+          svgCode:
+            '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M14.5 11.4H9.5C9.09 11.4 8.75 11.06 8.75 10.65C8.75 10.24 9.09 9.90002 9.5 9.90002H14.5C14.91 9.90002 15.25 10.24 15.25 10.65C15.25 11.06 14.91 11.4 14.5 11.4Z" fill="var(--color-icon-primary)"/>\n<path d="M4.92957 22.75C4.50957 22.75 4.11957 22.65 3.76957 22.45C2.99957 22 2.55957 21.09 2.55957 19.96V5.86C2.55957 3.32 4.62957 1.25 7.16957 1.25H16.8196C19.3596 1.25 21.4296 3.32 21.4296 5.86V19.95C21.4296 21.08 20.9896 21.99 20.2196 22.44C19.4496 22.89 18.4396 22.84 17.4496 22.29L12.5696 19.58C12.2796 19.42 11.7096 19.42 11.4196 19.58L6.53957 22.29C5.99957 22.59 5.44957 22.75 4.92957 22.75ZM7.17957 2.75C5.46957 2.75 4.06957 4.15 4.06957 5.86V19.95C4.06957 20.54 4.23957 20.98 4.53957 21.15C4.83957 21.33 5.30957 21.27 5.81957 20.98L10.6996 18.27C11.4396 17.86 12.5596 17.86 13.2996 18.27L18.1796 20.98C18.6896 21.27 19.1596 21.33 19.4596 21.15C19.7596 20.97 19.9296 20.53 19.9296 19.95V5.86C19.9296 4.15 18.5296 2.75 16.8196 2.75H7.17957Z" fill="var(--color-icon-primary)"/>\n</svg>',
+        },
+      },
+      author_name: "John Doe",
+      author_description: "Marketing Coordinator",
+      cta: "Read more",
+    },
+  ],
+  "pagination-wrapper": null,
+  "pagination-left": "Back",
+  "pagination-text": "",
+  "pagination-right": "Next",
 };
 
-const BLOGS_STYLES = Array(3)
-  ?.fill(0)
-  ?.map((_) => BLOG_STYLE);
-
 export type IBlogListing1Content = typeof DEFAULT_CONTENT;
 
 export const BlogListing1: IBlock = {
@@ -170,6 +251,12 @@ export const BlogListing1: IBlock = {
       field_interface: "ContainerWidget",
       // No hint needed: visual/container only
     },
+    {
+      key: "header",
+      label: "Header",
+      field_interface: "BoxWidget",
+      // No hint needed: layout grouping only
+    },
     {
       key: "text_wrapper",
       label: "Text Wrapper",
@@ -200,6 +287,20 @@ export const BlogListing1: IBlock = {
         max_characters: 140,
       },
     },
+    {
+      key: "ctas",
+      label: "CTAs",
+      kind: "group",
+      field_interface: "BoxWidget",
+      fields: [
+        {
+          key: "cta",
+          label: "CTA",
+          field_interface: "ButtonWidget",
+        },
+      ],
+      // No hint needed: layout grouping only
+    },
     {
       key: "blogs",
       label: "Blogs",
@@ -207,9 +308,9 @@ export const BlogListing1: IBlock = {
       field_interface: "BoxWidget",
       hint: {
         prompt_description:
-          "A repeating grid of featured blog article cards for the month. Each card highlights a blog with image, headline, excerpt, author, and meta info. Should feel lively and inviting.",
-        min_items: 6, // as per screenshot; six visible cards in a 3x2 grid
-        max_items: 9, // allow pagination flexibility
+          "Auto-populated grid of blog article cards. Each card displays real blog data (cover image, title, excerpt, published date, author info) with automatic click handling. Styling remains configurable.",
+        min_items: 6,
+        max_items: 9,
       },
       fields: [
         {
@@ -224,11 +325,17 @@ export const BlogListing1: IBlock = {
           field_interface: "ImageWidget",
           hint: {
             prompt_description:
-              "Blog post main thumbnail image. Should clearly represent the article or theme, visually engaging, and high quality. Prefer landscape orientation to fit card.",
+              "Automatically populated from blog cover_image. Styling remains configurable.",
             orientation: "landscape",
             size: "large",
             usecase: "hero",
           },
+          options: {
+            module_field: {
+              module: "blog",
+              key: "cover_image",
+            },
+          },
         },
         {
           key: "blog_content_wrapper",
@@ -242,6 +349,12 @@ export const BlogListing1: IBlock = {
           field_interface: "BoxWidget",
           // No hint needed: layout only
         },
+        {
+          key: "content_header",
+          label: "Content Header",
+          field_interface: "BoxWidget",
+          // No hint needed: layout only
+        },
         {
           key: "timestamp_wrapper",
           label: "Timestamp Wrapper",
@@ -266,11 +379,46 @@ export const BlogListing1: IBlock = {
           field_interface: "TypographyWidget",
           hint: {
             prompt_description:
-              "Publish time information for the blog post. Should be brief (e.g. 'Today', '6 minutes ago', or 'June 5'). Neutral, clear style.",
+              "Automatically populated from blog published_at date in 'DD MMM, YYYY' format. Styling remains configurable.",
             usecase: "date",
             min_characters: 8,
             max_characters: 20,
           },
+          options: {
+            module_field: {
+              module: "blog",
+              key: "published_at",
+            },
+          },
+        },
+        {
+          key: "category_wrapper",
+          label: "Category Wrapper",
+          field_interface: "BoxWidget",
+          // No hint needed: layout only
+        },
+        {
+          key: "category_icon",
+          label: "Category Icon",
+          field_interface: "IconWidget",
+          hint: {
+            prompt_description:
+              "Small icon representing time or date, displayed next to the category. Should be simple, clear, and easily recognizable at small sizes.",
+            size: "icon",
+            orientation: "square",
+            usecase: "icon",
+          },
+        },
+        {
+          key: "category",
+          label: "Timestamp",
+          field_interface: "TypographyWidget",
+          options: {
+            module_field: {
+              module: "blog",
+              key: "categories",
+            },
+          },
         },
         {
           key: "blog_info_wrapper",
@@ -284,11 +432,17 @@ export const BlogListing1: IBlock = {
           field_interface: "HeadingWidget",
           hint: {
             prompt_description:
-              "Blog article headline. Clear, bold, and appealing. Should entice users to read. Ideally not more than one line in the card, use a friendly, magazine-like tone.",
+              "Automatically populated from blog title. Styling remains configurable.",
             usecase: "title",
             min_characters: 35,
             max_characters: 60,
           },
+          options: {
+            module_field: {
+              module: "blog",
+              key: "title",
+            },
+          },
         },
         {
           key: "description",
@@ -296,11 +450,17 @@ export const BlogListing1: IBlock = {
           field_interface: "TypographyWidget",
           hint: {
             prompt_description:
-              "Short excerpt or summary of the blog post content. Should be 1-2 sentences, informative, and prompt curiosity. Keep it concise and editorial.",
+              "Automatically populated from blog excerpt. Styling remains configurable.",
             usecase: "description",
             min_characters: 60,
             max_characters: 130,
           },
+          options: {
+            module_field: {
+              module: "blog",
+              key: "summary",
+            },
+          },
         },
         {
           key: "author_wrapper",
@@ -332,11 +492,17 @@ export const BlogListing1: IBlock = {
           field_interface: "HeadingWidget",
           hint: {
             prompt_description:
-              "Author's full name, as displayed in byline. Preferably real or realistic names.",
+              "Automatically populated from blog author data. Styling remains configurable.",
             usecase: "author",
             min_characters: 5,
             max_characters: 25,
           },
+          options: {
+            module_field: {
+              module: "blog",
+              key: "authors",
+            },
+          },
         },
         {
           key: "author_description",
@@ -344,11 +510,17 @@ export const BlogListing1: IBlock = {
           field_interface: "TypographyWidget",
           hint: {
             prompt_description:
-              "Short description or job title of the author, e.g., 'Content Strategist', 'Lifestyle Editor'. Keep it short and professional.",
+              "Short description or job title of the author, e.g., 'Content Strategist', 'Lifestyle Editor'. Keep it short and professional. Automatically populated from blog author data.",
             usecase: "designation",
             min_characters: 10,
             max_characters: 30,
           },
+          options: {
+            module_field: {
+              module: "blog",
+              key: "authors",
+            },
+          },
         },
         {
           key: "cta",
@@ -356,7 +528,7 @@ export const BlogListing1: IBlock = {
           field_interface: "ButtonWidget",
           hint: {
             prompt_description:
-              "Primary action button label for each article card. Should prompt the user to read or learn more, concise (1-3 words), action-oriented.",
+              "Call-to-action button for manual user interaction. Can be configured to link to blog details or other actions.",
             usecase: "button",
             min_characters: 6,
             max_characters: 16,
@@ -407,6 +579,7 @@ export const BlogListing1: IBlock = {
       },
     },
   ],
+  source: [{ required: true, module: "blog", type: "block", field_key: "blogs" }],
   layouts: [
     {
       key: "default",
@@ -419,39 +592,418 @@ export const BlogListing1: IBlock = {
           "justify-content": "center",
           gap: "xl",
           "border-radius": "base",
-          "background-color": "white",
-          "padding-left": "8xl",
-          "padding-right": "8xl",
-          "padding-top": "5xl",
-          "padding-bottom": "5xl",
           "box-shadow": "lg",
         },
         container: {
           display: "flex",
-          width: "100%",
-          "max-width": "screen-lg",
           "flex-direction": "column",
           "row-gap": "xl",
         },
         text_wrapper: {
           display: "flex",
           "flex-direction": "column",
-          "row-gap": "2xs",
+          "row-gap": "none",
         },
+        ctas_levoGroup: {
+          display: "flex",
+          "column-gap": "md",
+          "align-items": "center",
+        },
+        ctas: [],
         title: {
-          color: "text-1",
+          mobile: {
+            "text-align": "center",
+          },
         },
         description: {
-          "font-size": "base",
-          color: "text-2",
+          mobile: {
+            "text-align": "center",
+          },
         },
         blogs_levoGroup: {
           display: "flex",
           width: "100%",
           "flex-direction": "column",
+          "row-gap": "9xl",
+        },
+        blogs_levoGroupItem: {
+          blog: {
+            display: "flex",
+            "column-gap": "4xl",
+            "border-radius": "base",
+            "align-items": "stretch",
+          },
+          cover_image: {
+            height: "auto",
+            "border-radius": "xl",
+            "object-fit": "cover",
+            tablet: {
+              width: "100%",
+            },
+            width: "100%",
+            "max-width": "256px",
+          },
+          blog_content_wrapper: {
+            display: "flex",
+            width: "100%",
+            flex: "1 1 0",
+            "align-items": "start",
+            "column-gap": "lg",
+            tablet: {
+              "flex-direction": "column",
+              "align-items": "start",
+              "row-gap": "sm",
+            },
+          },
+          text_content_wrapper: {
+            flex: "1 1 0%",
+            display: "flex",
+            "flex-direction": "column",
+            "row-gap": "none",
+            width: "auto",
+          },
+          content_header: {
+            display: "flex",
+            "column-gap": "base",
+            "align-items": "center",
+            "margin-bottom": "4xs",
+          },
+          timestamp_icon: {
+            display: "block",
+          },
+          timestamp_wrapper: {},
+          timestamp: {
+            "font-weight": 600,
+            color: "text-2",
+            "font-size": "xs",
+          },
+          category_wrapper: {
+            display: "flex",
+            width: "fit-content",
+            "align-items": "center",
+            "column-gap": "2px",
+            "border-radius": "36px",
+            "background-color": "brandSecondary",
+            color: "brandSecondaryForeground",
+            "padding-left": "sm",
+            "padding-right": "sm",
+            "padding-top": "3xs",
+            "padding-bottom": "3xs",
+          },
+          category_icon: {
+            display: "none",
+          },
+          category: {
+            "font-size": "xs",
+            color: "brandSecondaryForeground",
+            "font-weight": 600,
+          },
+          blog_info_wrapper: {
+            display: "flex",
+            width: "100%",
+            "flex-direction": "column",
+            "row-gap": "2xs",
+          },
+          title: {
+            "font-weight": 600,
+            "font-size": "lg",
+          },
+          description: {},
+          author_wrapper: {
+            display: "flex",
+            "align-items": "center",
+            "column-gap": "base",
+            "margin-top": "xl",
+            "padding-top": "md",
+            "border-right-width": "0px",
+            "border-bottom-width": "0px",
+            "border-left-width": "0px",
+            "border-top-width": "1.5px",
+          },
+          author_image: {
+            height: "36px",
+            width: "36px",
+            "border-radius": "100%",
+            "object-fit": "cover",
+          },
+          author_name: {
+            "font-size": "sm",
+            "font-weight": 600,
+          },
+          author_description: {},
+          cta: {
+            display: "none",
+          },
+        },
+        "pagination-wrapper": {
+          display: "flex",
+          width: "full",
+          "justify-content": "center",
+          "align-items": "center",
+          "column-gap": "md",
+        },
+        blogs: [],
+        header: {
+          display: "flex",
+          "column-gap": "base",
+          "justify-content": "space-between",
+          "align-items": "center",
+          tablet: {
+            "flex-direction": "column",
+            "align-items": "start",
+            "row-gap": "sm",
+          },
+          mobile: {
+            "align-items": "center",
+          },
+          "background-image": 'url("")',
+          "background-position": "50% 50%",
+          "background-size": "cover",
+          "margin-bottom": "4xl",
+        },
+      },
+      content: DEFAULT_CONTENT_NO_BORDER,
+      config: {
+        title: {
+          heading: {
+            level: 2,
+          },
+          selectedVariants: {
+            Heading_Level: "H4",
+          },
+        },
+        blogs: [
+          {
+            title: {
+              heading: {
+                level: "4",
+              },
+              selectedVariants: {
+                Heading_Level: "H6",
+              },
+            },
+            description: {
+              selectedVariants: {
+                Typography_Variants: "Small",
+              },
+            },
+            author_name: {
+              heading: {
+                level: "4",
+              },
+              selectedVariants: {
+                Heading_Level: "H6",
+              },
+            },
+            author_description: {
+              selectedVariants: {
+                Typography_Variants: "Small",
+              },
+            },
+            cover_image: {
+              image: {
+                width: 256,
+              },
+            },
+            timestamp: {
+              selectedVariants: {
+                Typography_Variants: "Small",
+              },
+            },
+          },
+          {
+            author_name: {
+              selectedVariants: {
+                Heading_Level: "H6",
+              },
+            },
+          },
+          {
+            author_name: {
+              selectedVariants: {
+                Heading_Level: "H6",
+              },
+            },
+          },
+        ],
+        ctas: [
+          {
+            cta: {
+              selectedVariants: {},
+            },
+          },
+          {
+            cta: {
+              selectedVariants: {
+                Button_Variants: "Secondary",
+              },
+            },
+          },
+        ],
+      },
+    },
+    {
+      key: "cards_with_border",
+      title: "Cards With Border",
+      styles: {
+        layout: {
+          display: "flex",
+          "flex-direction": "column",
+          "align-items": "center",
+          "justify-content": "center",
+          gap: "xl",
+          "border-radius": "base",
+          "box-shadow": "lg",
+        },
+        container: {
+          display: "flex",
+          "flex-direction": "column",
           "row-gap": "xl",
         },
-        blogs: BLOGS_STYLES,
+        text_wrapper: {
+          display: "flex",
+          "flex-direction": "column",
+          "row-gap": "none",
+        },
+        ctas_levoGroup: {
+          display: "flex",
+          "column-gap": "md",
+          "align-items": "center",
+        },
+        ctas: [],
+        title: {
+          mobile: {
+            "text-align": "center",
+          },
+        },
+        description: {
+          mobile: {
+            "text-align": "center",
+          },
+        },
+        blogs_levoGroup: {
+          display: "flex",
+          width: "100%",
+          "flex-direction": "column",
+          "row-gap": "9xl",
+        },
+        blogs_levoGroupItem: {
+          blog: {
+            display: "flex",
+            "border-radius": "lg",
+            "align-items": "stretch",
+            "padding-left": "base",
+            "padding-right": "base",
+            "padding-top": "base",
+            "padding-bottom": "base",
+            "border-style": "solid",
+            "border-width": "1px",
+            "column-gap": "lg",
+          },
+          cover_image: {
+            height: "auto",
+            "border-radius": "lg",
+            "object-fit": "cover",
+            tablet: {
+              width: "100%",
+            },
+            width: "100%",
+            "max-width": "256px",
+          },
+          blog_content_wrapper: {
+            display: "flex",
+            width: "100%",
+            flex: "1 1 0",
+            "align-items": "start",
+            "column-gap": "lg",
+            tablet: {
+              "flex-direction": "column",
+              "align-items": "start",
+              "row-gap": "sm",
+            },
+          },
+
+          text_content_wrapper: {
+            flex: "1 1 0%",
+            display: "flex",
+
+            "flex-direction": "column",
+            "row-gap": "none",
+            width: "auto",
+          },
+          timestamp_icon: {
+            display: "block",
+          },
+          timestamp_wrapper: {},
+          timestamp: {
+            "font-weight": 600,
+            color: "text-2",
+            "font-size": "xs",
+          },
+          blog_info_wrapper: {
+            display: "flex",
+            width: "100%",
+            "flex-direction": "column",
+            "row-gap": "2xs",
+          },
+          title: {
+            "font-weight": 600,
+            "font-size": "lg",
+          },
+          description: {},
+          author_wrapper: {
+            display: "flex",
+            "align-items": "center",
+            "column-gap": "base",
+            "margin-top": "xl",
+            "padding-top": "md",
+            "border-right-width": "0px",
+            "border-bottom-width": "0px",
+            "border-left-width": "0px",
+            "border-top-width": "1.5px",
+          },
+          author_image: {
+            height: "36px",
+            width: "36px",
+            "border-radius": "100%",
+            "object-fit": "cover",
+          },
+          author_name: {
+            "font-weight": 600,
+            "font-size": "sm",
+          },
+          author_description: {},
+          cta: {
+            display: "none",
+          },
+          content_header: {
+            display: "flex",
+            "column-gap": "base",
+            "align-items": "center",
+            "margin-bottom": "4xs",
+          },
+          category_wrapper: {
+            display: "flex",
+            width: "fit-content",
+            "align-items": "center",
+            "column-gap": "2px",
+            "border-radius": "36px",
+            "background-color": "brandSecondary",
+            color: "brandSecondaryForeground",
+            "padding-left": "sm",
+            "padding-right": "sm",
+            "padding-top": "3xs",
+            "padding-bottom": "3xs",
+          },
+          category_icon: {
+            display: "none",
+          },
+          category: {
+            "font-size": "xs",
+            color: "brandSecondaryForeground",
+            "font-weight": 600,
+          },
+        },
         "pagination-wrapper": {
           display: "flex",
           width: "full",
@@ -459,17 +1011,104 @@ export const BlogListing1: IBlock = {
           "align-items": "center",
           "column-gap": "md",
         },
+        blogs: [],
+        header: {
+          display: "flex",
+          "column-gap": "base",
+          "justify-content": "space-between",
+          "align-items": "center",
+          tablet: {
+            "flex-direction": "column",
+            "align-items": "start",
+            "row-gap": "sm",
+          },
+          mobile: {
+            "align-items": "center",
+          },
+          "background-image": 'url("")',
+          "background-position": "50% 50%",
+          "background-size": "cover",
+          "margin-bottom": "4xl",
+        },
       },
-      content: DEFAULT_CONTENT,
+      content: DEFAULT_CONTENT_NO_BORDER,
       config: {
         title: {
           heading: {
             level: 2,
           },
           selectedVariants: {
-            Heading_Level: "H2",
+            Heading_Level: "H4",
           },
         },
+        blogs: [
+          {
+            title: {
+              heading: {
+                level: "4",
+              },
+              selectedVariants: {
+                Heading_Level: "H6",
+              },
+            },
+            description: {
+              selectedVariants: {
+                Typography_Variants: "Small",
+              },
+            },
+            author_name: {
+              heading: {
+                level: "4",
+              },
+              selectedVariants: {
+                Heading_Level: "H6",
+              },
+            },
+            author_description: {
+              selectedVariants: {
+                Typography_Variants: "Small",
+              },
+            },
+            cover_image: {
+              image: {
+                width: 256,
+              },
+            },
+            timestamp: {
+              selectedVariants: {
+                Typography_Variants: "Small",
+              },
+            },
+          },
+          {
+            author_name: {
+              selectedVariants: {
+                Heading_Level: "H6",
+              },
+            },
+          },
+          {
+            author_name: {
+              selectedVariants: {
+                Heading_Level: "H6",
+              },
+            },
+          },
+        ],
+        ctas: [
+          {
+            cta: {
+              selectedVariants: {},
+            },
+          },
+          {
+            cta: {
+              selectedVariants: {
+                Button_Variants: "Secondary",
+              },
+            },
+          },
+        ],
       },
     },
   ],