@levo-so/blocks 0.1.101 → 0.1.103

package/src/blocks/stats/stats-2.schema.ts

@@ -1,7 +1,13 @@
 import type { IBlock } from "@levo-so/studio";
 
 import type { DEFAULT_CONTENT } from "./variants";
-import { defaultStats2Variant, heroStats2Variant } from "./variants";
+import {
+  cardGridStats2Variant,
+  defaultStats2Variant,
+  heroStats2Variant,
+  horizontalBarStats2Variant,
+  splitEditorialStats2Variant,
+} from "./variants";
 
 export type IStats2Content = typeof DEFAULT_CONTENT;
 
@@ -115,5 +121,11 @@ export const Stats2: IBlock = {
       ],
     },
   ],
-  layouts: [defaultStats2Variant, heroStats2Variant],
+  layouts: [
+    defaultStats2Variant,
+    heroStats2Variant,
+    horizontalBarStats2Variant,
+    cardGridStats2Variant,
+    splitEditorialStats2Variant,
+  ],
 };

package/src/blocks/stats/variants/default.ts

@@ -5,37 +5,37 @@ export const DEFAULT_CONTENT = {
   container: null,
   content_wrapper: null,
   text_content: null,
-  small_title: "About Us",
-  main_title: "Where bold ideas meet flawless execution",
+  small_title: "Our Results",
+  main_title: "Settlement that scales with you",
   description:
-    "We are a modern venture studio dedicated to building world-class products and companies from the ground up.",
+    "From first authorization to same-day payouts, our rails keep moving — even when volume triples on Black Friday.",
   ctas_levoGroup: null,
-  ctas: [{ cta: "Built With Us" }, { cta: "Learn More" }],
+  ctas: [{ cta: "Book a demo" }, { cta: "Read trust report" }],
   stats_section: null,
   header_section: null,
-  section_title: "Who we are",
+  section_title: "By the numbers",
   section_description:
-    "We specialize in smart real estate solutions that enhance efficiency, streamline operations, and unlock growth potential. Our expert team and integrated services support developers, investors, and property owners across the real estate lifecycle.",
+    "Four metrics we optimize every sprint — because the thing your finance team trusts is the only thing that matters.",
   stats: [
     {
       stat_card: null,
-      number: "1200+",
-      label: "Active Members",
+      number: "$420B+",
+      label: "Processed in 2025",
     },
     {
       stat_card: null,
-      number: "88%",
-      label: "Member Retention Rate",
+      number: "180+",
+      label: "Countries supported",
     },
     {
       stat_card: null,
-      number: "30+",
-      label: "Weekly Classes",
+      number: "99.99%",
+      label: "Settlement success rate",
     },
     {
       stat_card: null,
-      number: "95%",
-      label: "Satisfaction Rating",
+      number: "<80ms",
+      label: "Median auth latency",
     },
   ],
 };
@@ -161,26 +161,6 @@ export const defaultStats2Variant: IBlockLayouts = {
       "padding-bottom": "none",
       "padding-top": "2xl",
     },
-    "stats.$.stat_card": {
-      "text-align": "center",
-    },
-    "stats.$.number": {
-      "font-size": "4xl",
-      "font-weight": "700",
-      color: "text-1",
-      "margin-bottom": "xs",
-      mobile: {
-        "font-size": "3xl",
-      },
-    },
-    "stats.$.label": {
-      "font-size": "base",
-      "font-weight": "500",
-      color: "text-2",
-      mobile: {
-        "font-size": "sm",
-      },
-    },
     small_title: {
       display: "none",
     },
@@ -198,9 +178,6 @@ export const defaultStats2Variant: IBlockLayouts = {
       "flex-wrap": "wrap",
       "align-items": "center",
     },
-    ctas: Array(2)
-      .fill(0)
-      .map(() => ({})),
     stats: [{}, {}, {}, {}],
   },
 };

package/src/blocks/stats/variants/extra.ts

@@ -0,0 +1,232 @@
+import type { IBlockLayouts } from "@levo-so/studio";
+
+import { DEFAULT_CONTENT } from "./default";
+
+const statsConfig = {
+  stats: Array(4)
+    .fill(0)
+    .map(() => ({
+      number: { selectedVariants: { Heading_Level: "H2" } },
+    })),
+};
+
+export const horizontalBarStats2Variant: IBlockLayouts = {
+  title: "Horizontal Bar",
+  key: "horizontal-bar",
+  content: DEFAULT_CONTENT,
+  config: {
+    ...statsConfig,
+    section_title: { selectedVariants: { Typography_Variants: "Small" } },
+    section_description: { selectedVariants: { Typography_Variants: "Large" } },
+  },
+  styles: {
+    layout: { "background-color": "background-1" },
+    container: {},
+    content_wrapper: { display: "block" },
+    text_content: { display: "none" },
+    stats_section: { display: "block" },
+    header_section: {
+      "margin-bottom": "3xl",
+      "text-align": "center",
+      display: "flex",
+      "flex-direction": "column",
+      "align-items": "center",
+    },
+    section_title: {
+      color: "brand",
+      "margin-bottom": "base",
+      "font-weight": 600,
+      "font-size": "xs",
+      "text-transform": "uppercase",
+      "letter-spacing": "0.08em",
+    },
+    section_description: {
+      "font-size": "2xl",
+      color: "text-1",
+      "text-align": "center",
+      "max-width": "640px",
+    },
+    stats_levoGroup: {
+      display: "flex",
+      "flex-direction": "row",
+      width: "100%",
+      "border-width": "1px",
+      "border-style": "solid",
+      "border-color": "border",
+      "border-radius": "xl",
+      overflow: "hidden",
+      "background-color": "background-1",
+      "column-gap": "none",
+      tablet: { "flex-wrap": "wrap" },
+      mobile: { "flex-direction": "column" },
+    },
+    stats_levoGroupItem: {
+      number: { "font-weight": 700, color: "text-1" },
+      label: { color: "text-2", "font-weight": 500 },
+    },
+    small_title: { display: "none" },
+    main_title: { display: "none" },
+    description: { display: "none" },
+    ctas_levoGroup: { display: "none" },
+    stats: Array(4)
+      .fill(0)
+      .map((_, i) => ({
+        stat_card: {
+          flex: "1",
+          display: "flex",
+          "flex-direction": "column",
+          "align-items": "flex-start",
+          "row-gap": "2xs",
+          "padding-top": "xl",
+          "padding-bottom": "xl",
+          "padding-left": "xl",
+          "padding-right": "xl",
+          ...(i > 0
+            ? {
+                "border-left-width": "1px",
+                "border-left-style": "solid",
+                "border-color": "border",
+              }
+            : {}),
+          mobile: {
+            "border-left-width": "0",
+            "border-top-width": i > 0 ? "1px" : "0",
+            "border-top-style": "solid",
+            "border-color": "border",
+          },
+        },
+      })),
+  },
+};
+
+export const cardGridStats2Variant: IBlockLayouts = {
+  title: "Card Grid",
+  key: "card-grid",
+  content: DEFAULT_CONTENT,
+  config: {
+    ...statsConfig,
+    section_title: { selectedVariants: { Typography_Variants: "Small" } },
+    section_description: { selectedVariants: { Typography_Variants: "Large" } },
+  },
+  styles: {
+    layout: { "background-color": "background-2" },
+    container: {},
+    content_wrapper: { display: "block" },
+    text_content: { display: "none" },
+    stats_section: { display: "block" },
+    header_section: {
+      "margin-bottom": "3xl",
+      "text-align": "center",
+      display: "flex",
+      "flex-direction": "column",
+      "align-items": "center",
+    },
+    section_title: {
+      color: "brandSecondaryForeground",
+      "background-color": "brandSecondary",
+      "padding-top": "xs",
+      "padding-bottom": "xs",
+      "padding-left": "base",
+      "padding-right": "base",
+      "border-radius": "100px",
+      "margin-bottom": "lg",
+      "font-weight": 600,
+      display: "inline-block",
+    },
+    section_description: {
+      "font-size": "2xl",
+      color: "text-1",
+      "text-align": "center",
+      "max-width": "640px",
+    },
+    stats_levoGroup: {
+      display: "grid",
+      "grid-template-columns": "repeat(4, minmax(0, 1fr))",
+      "column-gap": "lg",
+      "row-gap": "lg",
+      width: "100%",
+      tablet: { "grid-template-columns": "repeat(2, minmax(0, 1fr))" },
+      mobile: { "grid-template-columns": "repeat(1, minmax(0, 1fr))" },
+    },
+    stats_levoGroupItem: {
+      stat_card: {
+        "background-color": "background-1",
+        "border-radius": "xl",
+        "box-shadow": "default",
+        display: "flex",
+        "flex-direction": "column",
+        "row-gap": "2xs",
+        "padding-top": "xl",
+        "padding-bottom": "xl",
+        "padding-left": "xl",
+        "padding-right": "xl",
+        height: "100%",
+      },
+      number: { "font-weight": 700, color: "text-1" },
+      label: { color: "text-2", "font-weight": 500 },
+    },
+    small_title: { display: "none" },
+    main_title: { display: "none" },
+    description: { display: "none" },
+    ctas_levoGroup: { display: "none" },
+    stats: [{}, {}, {}, {}],
+  },
+};
+
+export const splitEditorialStats2Variant: IBlockLayouts = {
+  title: "Split Editorial",
+  key: "split-editorial",
+  content: DEFAULT_CONTENT,
+  config: {
+    ...statsConfig,
+    section_title: { selectedVariants: { Typography_Variants: "Small" } },
+    section_description: { selectedVariants: { Typography_Variants: "Large" } },
+  },
+  styles: {
+    layout: {},
+    container: {},
+    content_wrapper: { display: "block" },
+    text_content: { display: "none" },
+    stats_section: {
+      display: "grid",
+      "grid-template-columns": "1fr 2fr",
+      "column-gap": "4xl",
+      "align-items": "start",
+      tablet: { "grid-template-columns": "repeat(1, minmax(0, 1fr))", "row-gap": "2xl" },
+      mobile: { "grid-template-columns": "repeat(1, minmax(0, 1fr))", "row-gap": "2xl" },
+    },
+    header_section: {
+      display: "flex",
+      "flex-direction": "column",
+      "align-items": "flex-start",
+      "text-align": "left",
+    },
+    section_title: {
+      color: "brand",
+      "margin-bottom": "base",
+      "font-weight": 600,
+      "font-size": "xs",
+      "text-transform": "uppercase",
+      "letter-spacing": "0.08em",
+    },
+    section_description: {
+      "font-size": "3xl",
+      color: "text-1",
+      "font-weight": 600,
+      "line-height": "1.2",
+    },
+    stats_levoGroup: {
+      display: "grid",
+      "grid-template-columns": "repeat(2, minmax(0, 1fr))",
+      "column-gap": "2xl",
+      "row-gap": "2xl",
+      width: "100%",
+      mobile: { "grid-template-columns": "repeat(2, minmax(0, 1fr))" },
+    },
+    small_title: { display: "none" },
+    main_title: { display: "none" },
+    description: { display: "none" },
+    ctas_levoGroup: { display: "none" },
+    stats: [{}, {}, {}, {}],
+  },
+};

package/src/blocks/stats/variants/hero.ts

@@ -118,36 +118,10 @@ export const heroStats2Variant: IBlockLayouts = {
         "row-gap": "base",
       },
     },
-    "stats.$.stat_card": {
-      "text-align": "left",
-      "padding-top": "base",
-      "padding-bottom": "base",
-      "padding-left": "base",
-      "padding-right": "base",
-      "background-color": "background-2",
-      "border-radius": "8px",
-    },
-    "stats.$.number": {
-      "font-size": "3xl",
-      "font-weight": "700",
-      color: "text-1",
-      "margin-bottom": "xs",
-      mobile: {
-        "font-size": "2xl",
-      },
-    },
-    "stats.$.label": {
-      "font-size": "sm",
-      "font-weight": "500",
-      color: "text-2",
-      mobile: {
-        "font-size": "xs",
-      },
-    },
     horizontal_divider: {
       width: "60px",
       height: "2px",
-      "background-color": " brand",
+      "background-color": "brand",
       "padding-top": "none",
       "padding-bottom": "none",
       "margin-top": "none",
@@ -168,8 +142,5 @@ export const heroStats2Variant: IBlockLayouts = {
       "flex-wrap": "wrap",
       "align-items": "center",
     },
-    ctas: Array(2)
-      .fill(0)
-      .map(() => ({})),
   },
 };

package/src/blocks/stats/variants/index.ts

@@ -1,4 +1,16 @@
 import { DEFAULT_CONTENT, defaultStats2Variant } from "./default";
+import {
+  cardGridStats2Variant,
+  horizontalBarStats2Variant,
+  splitEditorialStats2Variant,
+} from "./extra";
 import { heroStats2Variant } from "./hero";
 
-export { defaultStats2Variant, heroStats2Variant, DEFAULT_CONTENT };
+export {
+  defaultStats2Variant,
+  heroStats2Variant,
+  horizontalBarStats2Variant,
+  cardGridStats2Variant,
+  splitEditorialStats2Variant,
+  DEFAULT_CONTENT,
+};