@levo-so/blocks 0.1.100 → 0.1.102

package/src/blocks/profile/profile-5.schema.ts

@@ -1,27 +1,84 @@
 import type { IBlock } from "@levo-so/studio";
 
+const IMG_PROFILE = {
+  id: "7453456612690627010",
+  kind: "image",
+  location: "https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg",
+  mimetype: "image/jpeg",
+  srcset: {
+    "320w":
+      "https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=320",
+    "640w":
+      "https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=640",
+    "750w":
+      "https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=750",
+    "828w":
+      "https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=828",
+    "1080w":
+      "https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=1080",
+    "1200w":
+      "https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=1200",
+    "1920w":
+      "https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=1920",
+    path: "https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=320 320w, https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=640 640w, https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=750 750w, https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=828 828w, https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=1080 1080w, https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=1200 1200w, https://images.pexels.com/photos/8353832/pexels-photo-8353832.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&w=1920 1920w",
+  },
+};
+
+const ICON_LINKEDIN = {
+  kind: "icon",
+  data: {
+    id: "linkedin",
+    label: "Linkedin",
+    svgCode:
+      '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<g clip-path="url(#clip0_37_4945)">\n<path d="M22.2234 0H1.77187C0.792187 0 0 0.773438 0 1.72969V22.2656C0 23.2219 0.792187 24 1.77187 24H22.2234C23.2031 24 24 23.2219 24 22.2703V1.72969C24 0.773438 23.2031 0 22.2234 0ZM7.12031 20.4516H3.55781V8.99531H7.12031V20.4516ZM5.33906 7.43438C4.19531 7.43438 3.27188 6.51094 3.27188 5.37187C3.27188 4.23281 4.19531 3.30937 5.33906 3.30937C6.47813 3.30937 7.40156 4.23281 7.40156 5.37187C7.40156 6.50625 6.47813 7.43438 5.33906 7.43438ZM20.4516 20.4516H16.8937V14.8828C16.8937 13.5562 16.8703 11.8453 15.0422 11.8453C13.1906 11.8453 12.9094 13.2937 12.9094 14.7891V20.4516H9.35625V8.99531H12.7687V10.5609H12.8156C13.2891 9.66094 14.4516 8.70938 16.1813 8.70938C19.7859 8.70938 20.4516 11.0813 20.4516 14.1656V20.4516Z" fill="white"/>\n</g>\n<defs>\n<clipPath id="clip0_37_4945">\n<rect width="24" height="24" fill="white"/>\n</clipPath>\n</defs>\n</svg>',
+  },
+};
+
+const ICON_TWITTER = {
+  kind: "icon",
+  data: {
+    id: "twitter",
+    label: "Twitter",
+    svgCode:
+      '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M7.55016 21.75C16.6045 21.75 21.5583 14.2468 21.5583 7.74192C21.5583 7.53098 21.5536 7.31536 21.5442 7.10442C22.5079 6.40752 23.3395 5.54432 24 4.55536C23.1025 4.95466 22.1496 5.21544 21.1739 5.3288C22.2013 4.71297 22.9705 3.74553 23.3391 2.60583C22.3726 3.17862 21.3156 3.58267 20.2134 3.80067C19.4708 3.01162 18.489 2.48918 17.4197 2.31411C16.3504 2.13905 15.2532 2.32111 14.2977 2.83216C13.3423 3.3432 12.5818 4.15477 12.1338 5.14137C11.6859 6.12798 11.5754 7.23468 11.8195 8.29036C9.86249 8.19215 7.94794 7.68377 6.19998 6.79816C4.45203 5.91255 2.90969 4.6695 1.67297 3.14958C1.0444 4.2333 0.852057 5.51571 1.13503 6.73615C1.418 7.9566 2.15506 9.02351 3.19641 9.72005C2.41463 9.69523 1.64998 9.48474 0.965625 9.10598V9.16692C0.964925 10.3042 1.3581 11.4066 2.07831 12.2868C2.79852 13.167 3.80132 13.7706 4.91625 13.995C4.19206 14.1932 3.43198 14.2221 2.69484 14.0794C3.00945 15.0575 3.62157 15.913 4.44577 16.5264C5.26997 17.1398 6.26512 17.4807 7.29234 17.5013C5.54842 18.8712 3.39417 19.6142 1.17656 19.6107C0.783287 19.6101 0.390399 19.586 0 19.5385C2.25286 20.9838 4.87353 21.7514 7.55016 21.75Z" fill="white"/>\n</svg>',
+  },
+};
+
+const ICON_GITHUB = {
+  kind: "icon",
+  data: {
+    id: "github",
+    label: "Github",
+    svgCode:
+      '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<g clip-path="url(#clip0_37_5133)">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M12 0C5.3724 0 0 5.3808 0 12.0204C0 17.3304 3.438 21.8364 8.2068 23.4252C8.8068 23.5356 9.0252 23.1648 9.0252 22.8456C9.0252 22.5612 9.0156 21.804 9.0096 20.802C5.6712 21.528 4.9668 19.1904 4.9668 19.1904C4.422 17.8008 3.6348 17.4312 3.6348 17.4312C2.5452 16.6872 3.7176 16.7016 3.7176 16.7016C4.9212 16.7856 5.5548 17.94 5.5548 17.94C6.6252 19.776 8.364 19.2456 9.0468 18.9384C9.1572 18.162 9.4668 17.6328 9.81 17.3328C7.146 17.0292 4.344 15.9972 4.344 11.3916C4.344 10.08 4.812 9.006 5.5788 8.166C5.4552 7.8624 5.0436 6.6396 5.6964 4.986C5.6964 4.986 6.7044 4.662 8.9964 6.2172C9.97532 5.95022 10.9853 5.81423 12 5.8128C13.02 5.8176 14.046 5.9508 15.0048 6.2172C17.2956 4.662 18.3012 4.9848 18.3012 4.9848C18.9564 6.6396 18.5436 7.8624 18.4212 8.166C19.1892 9.006 19.6548 10.08 19.6548 11.3916C19.6548 16.0092 16.848 17.0256 14.1756 17.3232C14.6064 17.694 14.9892 18.4272 14.9892 19.5492C14.9892 21.1548 14.9748 22.452 14.9748 22.8456C14.9748 23.1672 15.1908 23.5416 15.8004 23.424C18.19 22.6225 20.2672 21.0904 21.7386 19.0441C23.2099 16.9977 24.001 14.5408 24 12.0204C24 5.3808 18.6264 0 12 0Z" fill="white"/>\n</g>\n<defs>\n<clipPath id="clip0_37_5133">\n<rect width="24" height="24" fill="white"/>\n</clipPath>\n</defs>\n</svg>',
+  },
+};
+
 const DEFAULT_CONTENT = {
   layout: null,
   container: null,
   main_container: null,
   left_container: null,
-  image: null,
+  image: IMG_PROFILE,
   social_icons: null,
-  social_icon_1: null,
-  social_icon_2: null,
-  social_icon_3: null,
-  ctas: [],
+  social_icon_1: ICON_LINKEDIN,
+  social_icon_2: ICON_TWITTER,
+  social_icon_3: ICON_GITHUB,
+  ctas: [{ button: "Book a demo" }, { button: "Read trust report" }],
   right_container: null,
-  experience_container: null,
-  experience_title: "15 Years of Experience",
+  main_text_container: null,
+  name: "Priya Raghavan",
+  experience_wrapper: null,
+  expertise_wrapper: null,
+  experience_title: "12 years shipping payments infra",
   experience_description:
-    "Leading digital transformation initiatives for Fortune 500 companies worldwide",
-  expertise_title: "Technical Expertise",
+    "Led settlement and risk platforms at two PCI DSS Level 1 processors, moving over $40B annually across 27 markets.",
+  expertise_title: "Where I go deep",
   expertise_description:
-    "Specializing in cloud architecture, AI integration, and scalable web solutions",
+    "Card tokenization, ISO 20022 migrations, real-time ledgers, KYC orchestration, and fraud models that clear under a 200ms SLA.",
   content_container: null,
   content_description:
-    "Our team of expert developers and designers work collaboratively to deliver innovative solutions that drive business growth. We combine cutting-edge technology with industry best practices to create digital experiences that engage and inspire users.",
+    "I build the quiet plumbing behind money movement — the ledgers that reconcile to the penny, the auth flows that block fraud without blocking customers, the settlement jobs that run at 3am so nobody has to think about them. Most recently I led the payments platform rewrite at a Series C neobank, cutting chargeback losses by 38% and launching card issuing in five new markets without a single audit finding. Before that, five years at a global processor owning the tokenization stack that serves three of the top ten issuers in North America.",
 };
 
 export type IProfile5Content = typeof DEFAULT_CONTENT;
@@ -145,7 +202,7 @@ export const Profile5: IBlock = {
           "Description elaborating on the experience or achievement mentioned in the title. Should provide context and details.",
         usecase: "description",
         min_characters: 40,
-        max_characters: 150,
+        max_characters: 200,
       },
     },
     {
@@ -169,7 +226,7 @@ export const Profile5: IBlock = {
           "Description detailing areas of expertise or specialization. Should be informative and highlight key skills.",
         usecase: "description",
         min_characters: 40,
-        max_characters: 150,
+        max_characters: 200,
       },
     },
     {
@@ -186,7 +243,7 @@ export const Profile5: IBlock = {
           "Main content paragraph providing comprehensive information about the team, services, or offerings. Should be engaging and informative.",
         usecase: "description",
         min_characters: 100,
-        max_characters: 500,
+        max_characters: 800,
       },
     },
   ],
@@ -196,116 +253,166 @@ export const Profile5: IBlock = {
       title: "Default",
       styles: {
         layout: {
-          "padding-top": "48px",
-          "padding-bottom": "48px",
-          "padding-left": "48px",
-          "padding-right": "48px",
+          "padding-top": "3xl",
+          "padding-bottom": "3xl",
+          "padding-left": "xl",
+          "padding-right": "xl",
+          "media:min:768px": {
+            "padding-top": "5xl",
+            "padding-bottom": "5xl",
+            "padding-left": "3xl",
+            "padding-right": "3xl",
+          },
         },
         container: {
-          "max-width": "1280px",
+          "max-width": "1200px",
           "margin-left": "auto",
           "margin-right": "auto",
         },
         main_container: {
           display: "flex",
-          "flex-direction": "row",
+          "flex-direction": "column",
           "align-items": "flex-start",
-          "column-gap": "48px",
-          tablet: {
-            "flex-direction": "column",
+          "row-gap": "2xl",
+          "media:min:1024px": {
+            "flex-direction": "row",
+            "align-items": "flex-start",
+            "column-gap": "4xl",
+            "row-gap": "0",
           },
         },
         left_container: {
           display: "flex",
           "flex-direction": "column",
-          "align-items": "center",
+          "align-items": "stretch",
           flex: "1",
-          "max-width": "400px",
-          tablet: {
-            "max-width": "100%",
+          width: "100%",
+          "row-gap": "lg",
+          "media:min:1024px": {
+            "max-width": "360px",
+            "flex-shrink": "0",
           },
         },
         image: {
-          "border-radius": "12px",
-          "margin-bottom": "24px",
+          "border-radius": "lg",
           width: "100%",
-          height: "300px",
+          "aspect-ratio": "3 / 4",
           "object-fit": "cover",
         },
         social_icons: {
           display: "flex",
           "flex-direction": "row",
-          "column-gap": "16px",
+          "column-gap": "sm",
           "align-items": "center",
-          "justify-content": "center",
+          "justify-content": "flex-start",
         },
         social_icon_1: {
-          "background-color": "background-1",
-          color: "text-1",
-          "padding-top": "12px",
-          "padding-bottom": "12px",
-          "padding-left": "12px",
-          "padding-right": "12px",
-          "border-radius": "50%",
-          "border-color": "border",
-          "border-width": "2px",
+          "background-color": "foreground",
+          color: "background",
+          "padding-top": "sm",
+          "padding-bottom": "sm",
+          "padding-left": "sm",
+          "padding-right": "sm",
+          "border-radius": "full",
+          width: "18px",
+          height: "18px",
+          "font-size": "18px",
         },
         social_icon_2: {
-          "background-color": "background-1",
-          color: "text-1",
-          "padding-top": "12px",
-          "padding-bottom": "12px",
-          "padding-left": "12px",
-          "padding-right": "12px",
-          "border-radius": "50%",
-          "border-color": "border",
-          "border-width": "2px",
+          "background-color": "foreground",
+          color: "background",
+          "padding-top": "sm",
+          "padding-bottom": "sm",
+          "padding-left": "sm",
+          "padding-right": "sm",
+          "border-radius": "full",
+          width: "18px",
+          height: "18px",
+          "font-size": "18px",
         },
         social_icon_3: {
-          "background-color": "background-1",
-          color: "text-1",
-          "padding-top": "12px",
-          "padding-bottom": "12px",
-          "padding-left": "12px",
-          "padding-right": "12px",
-          "border-radius": "50%",
-          "border-color": "border",
-          "border-width": "2px",
+          "background-color": "foreground",
+          color: "background",
+          "padding-top": "sm",
+          "padding-bottom": "sm",
+          "padding-left": "sm",
+          "padding-right": "sm",
+          "border-radius": "full",
+          width: "18px",
+          height: "18px",
+          "font-size": "18px",
         },
+        ctas_levoGroup: {
+          display: "flex",
+          "flex-direction": "row",
+          "flex-wrap": "wrap",
+          "column-gap": "sm",
+          "row-gap": "sm",
+          "margin-top": "xs",
+        },
+        ctas: [
+          { button: { selectedVariants: {} } },
+          { button: { selectedVariants: { Button_Variants: "Secondary" } } },
+        ],
         right_container: {
           display: "flex",
           "flex-direction": "column",
           "align-items": "flex-start",
-          flex: "2",
-          "row-gap": "32px",
+          flex: "1",
+          "row-gap": "xl",
+        },
+        name: {
+          "font-size": "4xl",
+          "font-weight": "700",
+          color: "foreground",
+          "line-height": "1.1",
+          "letter-spacing": "-0.02em",
+        },
+        main_text_container: {
+          display: "grid",
+          "grid-template-columns": "1fr",
+          "column-gap": "xl",
+          "row-gap": "xl",
+          width: "100%",
+          "padding-top": "lg",
+          "padding-bottom": "lg",
+          "border-top": "1px solid",
+          "border-bottom": "1px solid",
+          "border-color": "border",
+          "media:min:640px": {
+            "grid-template-columns": "1fr 1fr",
+          },
         },
-        experience_container: {
+        experience_wrapper: {
           display: "flex",
           "flex-direction": "column",
-          "align-items": "flex-start",
-          "row-gap": "16px",
+          "row-gap": "xs",
+        },
+        expertise_wrapper: {
+          display: "flex",
+          "flex-direction": "column",
+          "row-gap": "xs",
         },
         experience_title: {
-          "font-size": "24px",
-          "font-weight": "700",
-          color: "text-1",
-          "margin-bottom": "8px",
+          "font-size": "lg",
+          "font-weight": "600",
+          color: "foreground",
+          "line-height": "1.3",
         },
         experience_description: {
-          "font-size": "16px",
-          color: "text-2",
+          "font-size": "sm",
+          color: "muted-foreground",
           "line-height": "1.6",
-          "margin-bottom": "16px",
         },
         expertise_title: {
-          "font-size": "20px",
+          "font-size": "lg",
           "font-weight": "600",
-          color: "text-1",
-          "margin-bottom": "8px",
+          color: "foreground",
+          "line-height": "1.3",
         },
         expertise_description: {
-          "font-size": "16px",
-          color: "text-2",
+          "font-size": "sm",
+          color: "muted-foreground",
           "line-height": "1.6",
         },
         content_container: {
@@ -314,9 +421,9 @@ export const Profile5: IBlock = {
           "align-items": "flex-start",
         },
         content_description: {
-          "font-size": "16px",
-          color: "text-2",
-          "line-height": "1.6",
+          "font-size": "base",
+          color: "muted-foreground",
+          "line-height": "1.7",
         },
       },
       content: DEFAULT_CONTENT,