@levo-so/blocks 0.1.1 → 0.1.2

package/src/blocks/testimonial/testimonial-6.tsx

@@ -0,0 +1,128 @@
+import type { CarouselApi } from "@levo-so/studio";
+import {
+  type ILevoBlockBaseProps,
+  Box,
+  Button,
+  Carousel,
+  CarouselContent,
+  CarouselItem,
+  Container,
+  Heading,
+  Icon,
+  Image,
+  Section,
+  Typography,
+} from "@levo-so/studio";
+import { useEffect, useState } from "react";
+
+import type { ITestimonial6Content } from "./testimonial-6.schema";
+
+const Testimonial6: React.FC<ILevoBlockBaseProps<ITestimonial6Content>> = ({
+  content,
+}) => {
+  const [api, setApi] = useState<CarouselApi>();
+  const [current, setCurrent] = useState(0);
+  const [count, setCount] = useState(0);
+
+  useEffect(() => {
+    if (!api) {
+      return;
+    }
+
+    setCount(api.scrollSnapList().length);
+    setCurrent(api.selectedScrollSnap());
+
+    api.on("select", () => {
+      setCurrent(api.selectedScrollSnap());
+    });
+  }, [api]);
+
+  // Add disabled state logic
+  const isFirstSlide = current === 0;
+  const isLastSlide = current === count - 1;
+
+  const handlePrevious = () => {
+    if (api && !isFirstSlide) {
+      api.scrollTo(current - 1);
+    }
+  };
+
+  const handleNext = () => {
+    if (api && !isLastSlide) {
+      api.scrollTo(current + 1);
+    }
+  };
+
+  return (
+    <Section elementKey="layout">
+      <Container elementKey="container">
+        <Carousel
+          elementKey="testimonials_levoGroup"
+          className="w-full"
+          setApi={setApi}
+          data-levo_group
+        >
+          <CarouselContent>
+            {(content?.testimonials ?? [])?.map((_: any, index: number) => (
+              <CarouselItem key={index} data-levo_group_item>
+                <Box elementKey={`testimonials.${index}.testimonial`}>
+                  <Box elementKey={`testimonials.${index}.icon-container`}>
+                    <Icon elementKey={`testimonials.${index}.icon`} />
+                  </Box>
+                  <Box elementKey={`testimonials.${index}.content-container`}>
+                    <Box
+                      elementKey={`testimonials.${index}.testimonial-content`}
+                    >
+                      <Typography
+                        elementKey={`testimonials.${index}.testimonial-text`}
+                      />
+                    </Box>
+                    <Box elementKey={`testimonials.${index}.bottom-section`}>
+                      <Box elementKey={`testimonials.${index}.author-section`}>
+                        <Icon
+                          elementKey={`testimonials.${index}.author-avatar`}
+                        />
+                        <Box elementKey={`testimonials.${index}.author-info`}>
+                          <Heading
+                            elementKey={`testimonials.${index}.author-name`}
+                          />
+                          <Typography
+                            elementKey={`testimonials.${index}.author-position`}
+                          />
+                        </Box>
+                      </Box>
+                      {count > 0 && index === current && (
+                        <Box elementKey="carousel-navigation">
+                          <Button
+                            elementKey="carousel-navigation-arrow-left"
+                            onClick={handlePrevious}
+                            disabled={isFirstSlide}
+                            style={{
+                              opacity: isFirstSlide ? 0.5 : 1,
+                              cursor: isFirstSlide ? "not-allowed" : "pointer",
+                            }}
+                          ></Button>
+                          <Button
+                            elementKey="carousel-navigation-arrow-right"
+                            onClick={handleNext}
+                            disabled={isLastSlide}
+                            style={{
+                              opacity: isLastSlide ? 0.5 : 1,
+                              cursor: isLastSlide ? "not-allowed" : "pointer",
+                            }}
+                          ></Button>
+                        </Box>
+                      )}
+                    </Box>
+                  </Box>
+                </Box>
+              </CarouselItem>
+            ))}
+          </CarouselContent>
+        </Carousel>
+      </Container>
+    </Section>
+  );
+};
+
+export default Testimonial6;

package/{dist/index.js → src/index.ts}

@@ -1,9 +1,12 @@
 import { blocksRegistry } from "@levo-so/studio";
+
 import * as schemas from "./schemas";
 import * as components from "./blocks";
+
 export { components };
 export { schemas };
+
 export const registerLibrary = () => {
-    blocksRegistry.registerBlocksToStudio(schemas.BlockList);
-    blocksRegistry.registerCategoriesToStudio(schemas.BlockCategoryList);
+  blocksRegistry.registerBlocksToStudio(schemas.BlockList);
+  blocksRegistry.registerCategoriesToStudio(schemas.BlockCategoryList);
 };

package/{dist/schemas/blocks.js → src/schemas/blocks.ts}

@@ -1,3 +1,5 @@
+import type { IBlock } from "@levo-so/studio";
+
 import { AboutUs1 } from "../blocks/about-us/about-us-1.schema";
 import { BlogListing1 } from "../blocks/blogs/blog-listing-1.schema";
 import { BlogListing2 } from "../blocks/blogs/blog-listing-2.schema";
@@ -69,76 +71,77 @@ import { Testimonial3 } from "../blocks/testimonial/testimonial-3.schema";
 import { Testimonial4 } from "../blocks/testimonial/testimonial-4.schema";
 import { Testimonial5 } from "../blocks/testimonial/testimonial-5.schema";
 import { Testimonial6 } from "../blocks/testimonial/testimonial-6.schema";
-export const BlockList = [
-    AboutUs1,
-    BlogListing1,
-    BlogListing2,
-    BlogPost1,
-    BlogPost2,
-    Cards2,
-    Cards3,
-    Cards4,
-    Cards5,
-    Cards6,
-    Cards7,
-    Cards9,
-    Cards10,
-    Cards11,
-    Cards12,
-    ContactUs1,
-    ContactUs2,
-    Content1,
-    Content2,
-    Content3,
-    Content4,
-    Content5,
-    Content6,
-    Cta1,
-    Cta2,
-    Cta3,
-    Embed1,
-    EventListing,
-    EventListing2,
-    EventListing3,
-    EventDetails,
-    Faq1,
-    Faq2,
-    Faq3,
-    Features1,
-    Features2,
-    Features3,
-    Features4,
-    Features5,
-    Features6,
-    Footer1,
-    Footer2,
-    Footer3,
-    Footer4,
-    Footer5,
-    Hero1,
-    Hero2,
-    Hero4,
-    Hero5,
-    Hero6,
-    Hero7,
-    Hero8,
-    Hero9,
-    Logos1,
-    Navbar1,
-    Navbar2,
-    Pricing1,
-    ProductsListing1,
-    Stats1,
-    Stats2,
-    Team1,
-    Team2,
-    Team3,
-    Testimonial1,
-    Testimonial2,
-    Testimonial3,
-    Testimonial4,
-    Testimonial5,
-    Testimonial6,
-    TermsAndConditions1,
-    Carousel1,
+
+export const BlockList: IBlock[] = [
+  AboutUs1,
+  BlogListing1,
+  BlogListing2,
+  BlogPost1,
+  BlogPost2,
+  Cards2,
+  Cards3,
+  Cards4,
+  Cards5,
+  Cards6,
+  Cards7,
+  Cards9,
+  Cards10,
+  Cards11,
+  Cards12,
+  ContactUs1,
+  ContactUs2,
+  Content1,
+  Content2,
+  Content3,
+  Content4,
+  Content5,
+  Content6,
+  Cta1,
+  Cta2,
+  Cta3,
+  Embed1,
+  EventListing,
+  EventListing2,
+  EventListing3,
+  EventDetails,
+  Faq1,
+  Faq2,
+  Faq3,
+  Features1,
+  Features2,
+  Features3,
+  Features4,
+  Features5,
+  Features6,
+  Footer1,
+  Footer2,
+  Footer3,
+  Footer4,
+  Footer5,
+  Hero1,
+  Hero2,
+  Hero4,
+  Hero5,
+  Hero6,
+  Hero7,
+  Hero8,
+  Hero9,
+  Logos1,
+  Navbar1,
+  Navbar2,
+  Pricing1,
+  ProductsListing1,
+  Stats1,
+  Stats2,
+  Team1,
+  Team2,
+  Team3,
+  Testimonial1,
+  Testimonial2,
+  Testimonial3,
+  Testimonial4,
+  Testimonial5,
+  Testimonial6,
+  TermsAndConditions1,
+  Carousel1,
 ];

package/src/schemas/categories.ts

@@ -0,0 +1,134 @@
+import type { IBlockCategory } from "@levo-so/studio";
+
+const categories: IBlockCategory[] = [
+  {
+    id: "about-us",
+    title: "About Us",
+    description: "",
+    media: [],
+  },
+  {
+    id: "cards",
+    title: "Cards",
+    description: "",
+    media: [],
+  },
+  {
+    id: "contact-us",
+    title: "Contact Us",
+    description: "",
+    media: [],
+  },
+  {
+    id: "content",
+    title: "Content",
+    description: "",
+    media: [],
+  },
+  {
+    id: "cta",
+    title: "CTA",
+    description: "",
+    media: [],
+  },
+  {
+    id: "embed",
+    title: "Embed",
+    description: "",
+    media: [],
+  },
+  {
+    id: "event",
+    title: "Events",
+    description: "",
+    media: [],
+  },
+  {
+    id: "faqs",
+    title: "FAQs",
+    description: "",
+    media: [],
+  },
+  {
+    id: "features",
+    title: "Features",
+    description: "",
+    media: [],
+  },
+  {
+    id: "footer",
+    title: "Footer",
+    description: "",
+    media: [],
+  },
+  {
+    id: "hero",
+    title: "Hero",
+    description: "",
+    media: [],
+  },
+  {
+    id: "logos",
+    title: "Logos",
+    description: "",
+    media: [],
+  },
+  {
+    id: "navbar",
+    title: "Navbar",
+    description: "",
+    media: [],
+  },
+  {
+    id: "pricing",
+    title: "Pricing",
+    description: "",
+    media: [],
+  },
+  {
+    id: "products",
+    title: "Products",
+    description: "",
+    media: [],
+  },
+  {
+    id: "stats",
+    title: "Stats",
+    description: "",
+    media: [],
+  },
+  {
+    id: "team",
+    title: "Team",
+    description: "",
+    media: [],
+  },
+  {
+    id: "testimonial",
+    title: "Testimonial",
+    description: "",
+    media: [],
+  },
+  {
+    id: "blogs",
+    title: "Blogs",
+    description: "",
+    media: [],
+  },
+  {
+    id: "termsAndPrivacy",
+    title: "Terms and Conditions and Privacy Policy",
+    description: "",
+    media: [],
+  },
+  {
+    id: "carousel",
+    title: "Carousel",
+    description: "",
+    media: [],
+  },
+];
+
+export const BlockCategoryList: IBlockCategory[] = [...categories].sort(
+  (a, b) => a.title.localeCompare(b.title),
+);

package/src/styles.d.ts

@@ -0,0 +1,4 @@
+declare module "*.module.css" {
+  const classes: { [key: string]: string };
+  export default classes;
+}

package/dist/blocks/about-us/about-us-1.d.ts

@@ -1,5 +0,0 @@
-import { type ILevoBlockBaseProps } from "@levo-so/studio";
-import type { IAboutUs1Content } from "./about-us-1.schema";
-declare const AboutUs1: React.FC<ILevoBlockBaseProps<IAboutUs1Content>>;
-export default AboutUs1;
-//# sourceMappingURL=about-us-1.d.ts.map

package/dist/blocks/about-us/about-us-1.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Button, Container, Heading, Icon, Media, Section, Typography, } from "@levo-so/studio";
-const AboutUs1 = ({ content, }) => (_jsx(Section, { elementKey: "layout", children: _jsxs(Container, { elementKey: "container", children: [_jsx(Media, { alt: "media", elementKey: "media" }), _jsxs(Box, { elementKey: "contentWrapper", children: [_jsx(Typography, { elementKey: "label" }), _jsx(Heading, { elementKey: "title" }), _jsx(Typography, { elementKey: "description" }), _jsx(Box, { elementKey: "features_levoGroup", "data-levo_group": true, children: Array.isArray(content?.features) &&
-                            content?.features.map((feature, index) => (_jsxs(Box, { elementKey: `features.${index}.featureWrapper`, children: [_jsx(Icon, { elementKey: `features.${index}.icon` }), _jsx(Typography, { elementKey: `features.${index}.feature` })] }, `about-us-1-feature-${index}`))) }), _jsx(Box, { elementKey: "ctas_levoGroup", "data-levo_group": true, children: (content.ctas ?? []).map((_, index) => (_jsx(Button, { elementKey: `ctas.${index}.cta`, "data-levo_group_item": true }, `logos-1-cta-${index}`))) })] })] }) }));
-export default AboutUs1;

package/dist/blocks/about-us/about-us-1.schema.d.ts

@@ -1,38 +0,0 @@
-import type { IBlock } from "@levo-so/studio";
-declare const DEFAULT_CONTENT: {
-    layout: null;
-    container: null;
-    media: {
-        kind: string;
-        data: {
-            id: string;
-            label: string;
-            tags: string[];
-            svgCode: string;
-        };
-    };
-    contentWrapper: null;
-    label: string;
-    title: string;
-    description: string;
-    features: {
-        featureWrapper: null;
-        icon: {
-            kind: string;
-            data: {
-                id: string;
-                label: string;
-                tags: string[];
-                svgCode: string;
-            };
-        };
-        feature: string;
-    }[];
-    ctas: {
-        cta: string;
-    }[];
-};
-export type IAboutUs1Content = typeof DEFAULT_CONTENT;
-export declare const AboutUs1: IBlock;
-export {};
-//# sourceMappingURL=about-us-1.schema.d.ts.map