@openuidev/react-ui 0.9.16

package/dist/components/Carousel/Carousel.js

@@ -0,0 +1,124 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import { createContext, forwardRef, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState, } from "react";
+import { IconButton } from "../IconButton";
+const CarouselContext = createContext(null);
+const useCarousel = () => {
+    const context = useContext(CarouselContext);
+    if (!context)
+        throw new Error("useCarousel must be used within a Carousel");
+    return context;
+};
+export const Carousel = forwardRef(({ itemsToScroll = 1, noSnap, showButtons = true, variant = "card", className, children, onScrollLeftEnabled, onScrollRightEnabled, ...props }, ref) => {
+    const scrollDivRef = useRef(null);
+    const [isPrevVisible, setIsPrevVisible] = useState(false);
+    const [isNextVisible, setIsNextVisible] = useState(false);
+    const scroll = useCallback((direction) => {
+        if (!scrollDivRef.current) {
+            return;
+        }
+        const container = scrollDivRef.current;
+        const items = noSnap
+            ? Array.from(container.children[0]?.children ?? [])
+            : Array.from(container.children);
+        if (items.length === 0) {
+            return;
+        }
+        const containerRect = container.getBoundingClientRect();
+        const visibleIndex = items.findIndex((child) => {
+            const rect = child.getBoundingClientRect();
+            return rect.left >= containerRect.left;
+        });
+        let currentIndex = visibleIndex;
+        if (visibleIndex === -1) {
+            // Scrolled to the far right, so the last item is the current one
+            currentIndex = items.length - 1;
+        }
+        const targetIndex = direction === "left"
+            ? Math.max(0, currentIndex - itemsToScroll)
+            : Math.min(items.length - 1, currentIndex + itemsToScroll);
+        const targetElement = items[targetIndex];
+        if (targetElement) {
+            container.scrollTo({
+                left: targetElement.offsetLeft,
+                behavior: "smooth",
+            });
+        }
+    }, [noSnap, itemsToScroll]);
+    useEffect(() => {
+        if (!scrollDivRef.current)
+            return;
+        const container = scrollDivRef.current;
+        const handleScroll = () => {
+            const canScrollLeft = container.scrollLeft > 0;
+            const canScrollRight = Math.ceil(container.scrollLeft) + container.offsetWidth < container.scrollWidth;
+            setIsPrevVisible(canScrollLeft);
+            setIsNextVisible(canScrollRight);
+        };
+        handleScroll();
+        const resizeObserver = new ResizeObserver(handleScroll);
+        resizeObserver.observe(container);
+        const mutationObserver = new MutationObserver(handleScroll);
+        mutationObserver.observe(container, { childList: true, subtree: true });
+        container.addEventListener("scroll", handleScroll);
+        return () => {
+            container.removeEventListener("scroll", handleScroll);
+            resizeObserver.disconnect();
+            mutationObserver.disconnect();
+        };
+    }, []);
+    useEffect(() => {
+        onScrollLeftEnabled?.(isPrevVisible);
+    }, [isPrevVisible, onScrollLeftEnabled]);
+    useEffect(() => {
+        onScrollRightEnabled?.(isNextVisible);
+    }, [isNextVisible, onScrollRightEnabled]);
+    useImperativeHandle(ref, () => {
+        return {
+            scroll,
+            scrollDivRef,
+        };
+    }, [scroll]);
+    const contextValue = useMemo(() => ({
+        scrollDivRef,
+        scroll,
+        itemsToScroll,
+        noSnap,
+        showButtons,
+        variant,
+        isPrevVisible,
+        isNextVisible,
+    }), [
+        scrollDivRef,
+        scroll,
+        itemsToScroll,
+        noSnap,
+        showButtons,
+        variant,
+        isPrevVisible,
+        isNextVisible,
+    ]);
+    return (_jsx(CarouselContext.Provider, { value: contextValue, children: _jsx("div", { className: clsx("openui-carousel", `openui-carousel--${variant}`, className), ...props, children: children }) }));
+});
+export const CarouselContent = forwardRef(({ className, children, ...props }, _ref) => {
+    const { scrollDivRef, noSnap, isPrevVisible, isNextVisible } = useCarousel();
+    const content = noSnap ? (_jsx("div", { className: "openui-carousel-content-wrapper", children: children })) : (children);
+    return (_jsx("div", { ref: scrollDivRef, className: clsx("openui-carousel-content", {
+            "openui-carousel-content--mask-left": isPrevVisible,
+            "openui-carousel-content--mask-right": isNextVisible,
+        }, className), ...props, children: content }));
+});
+export const CarouselItem = forwardRef(({ className, children, ...props }, ref) => (_jsx("div", { ref: ref, className: clsx("openui-carousel-item", className), ...props, children: children })));
+export const CarouselPrevious = forwardRef(({ className, style, ...props }, ref) => {
+    const { scroll, showButtons, isPrevVisible } = useCarousel();
+    if (!isPrevVisible || !showButtons)
+        return null;
+    return (_jsx("div", { className: clsx("openui-carousel-button openui-carousel-button-left", className), children: _jsx(IconButton, { ref: ref, shape: "square", variant: "secondary", size: "small", onClick: () => scroll("left"), style: style, ...props }) }));
+});
+export const CarouselNext = forwardRef(({ className, style, ...props }, ref) => {
+    const { scroll, showButtons, isNextVisible } = useCarousel();
+    if (!isNextVisible || !showButtons)
+        return null;
+    return (_jsx("div", { className: clsx("openui-carousel-button openui-carousel-button-right", className), children: _jsx(IconButton, { ref: ref, shape: "square", variant: "secondary", size: "small", onClick: () => scroll("right"), style: style, ...props }) }));
+});
+//# sourceMappingURL=Carousel.js.map

package/dist/components/Carousel/Carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../../../src/components/Carousel/Carousel.tsx"],"names":[],"mappings":"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"}

package/dist/components/Carousel/carousel.css

@@ -0,0 +1 @@
+.openui-carousel{position:relative;display:flex}.openui-carousel-content{position:relative;display:flex;flex-direction:row;gap:var(--openui-space-m, 12px);overflow-x:auto;scroll-snap-type:x mandatory;-ms-overflow-x:hidden;scrollbar-width:none}.openui-carousel-content.openui-carousel-content--mask-left.openui-carousel-content--mask-right{mask-image:linear-gradient(to right, transparent, black 40px, black calc(100% - 40px), transparent);-webkit-mask-image:linear-gradient(to right, transparent, black 40px, black calc(100% - 40px), transparent)}.openui-carousel-content.openui-carousel-content--mask-left:not(.openui-carousel-content--mask-right){mask-image:linear-gradient(to right, transparent, black 40px, black);-webkit-mask-image:linear-gradient(to right, transparent, black 40px, black)}.openui-carousel-content.openui-carousel-content--mask-right:not(.openui-carousel-content--mask-left){mask-image:linear-gradient(to left, transparent, black 40px, black);-webkit-mask-image:linear-gradient(to left, transparent, black 40px, black)}.openui-carousel-content-wrapper{display:flex;gap:var(--openui-space-m, 12px)}.openui-carousel-content::-webkit-scrollbar{display:none}.openui-carousel-content>*{box-sizing:border-box;scroll-snap-align:start}.openui-carousel-item{font:var(--openui-text-body-default);letter-spacing:var(--openui-text-body-default-letter-spacing);display:flex;flex-direction:column;gap:var(--openui-space-m, 12px);width:280px;flex-shrink:0;border-radius:var(--openui-radius-2xl, 14px);background-color:var(--openui-foreground, oklch(99.4% 0 89.876deg));padding:var(--openui-space-m, 12px);border:1px solid var(--openui-border-default, oklch(9.7% 0 0deg / 0.06))}.openui-carousel-button{position:absolute;top:50%;z-index:10;transform:translateY(-50%);background:var(--openui-foreground, oklch(99.4% 0 89.876deg));display:flex;align-items:center;justify-content:center;border-radius:var(--openui-radius-s, 6px)}.openui-carousel-button-left{left:-12px}.openui-carousel-button-right{right:-12px}@media(max-width: 400px){.openui-carousel .openui-carousel-item{width:248px;flex-shrink:0}}.openui-carousel--sunk .openui-carousel-item{background-color:var(--openui-highlight-subtle, oklch(9.7% 0 0deg / 0.02))}

package/dist/components/Carousel/dependencies.d.ts

@@ -0,0 +1,3 @@
+declare const dependencies: string[];
+export default dependencies;
+//# sourceMappingURL=dependencies.d.ts.map

package/dist/components/Carousel/dependencies.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dependencies.d.ts","sourceRoot":"","sources":["../../../src/components/Carousel/dependencies.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,YAAY,UAAe,CAAC;AAClC,eAAe,YAAY,CAAC"}

package/dist/components/Carousel/dependencies.js

@@ -0,0 +1,3 @@
+const dependencies = ["Carousel"];
+export default dependencies;
+//# sourceMappingURL=dependencies.js.map

package/dist/components/Carousel/dependencies.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dependencies.js","sourceRoot":"","sources":["../../../src/components/Carousel/dependencies.ts"],"names":[],"mappings":"AAAA,MAAM,YAAY,GAAG,CAAC,UAAU,CAAC,CAAC;AAClC,eAAe,YAAY,CAAC"}

package/dist/components/Carousel/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Carousel";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Carousel/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Carousel/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}

package/dist/components/Carousel/index.js

@@ -0,0 +1,2 @@
+export * from "./Carousel";
+//# sourceMappingURL=index.js.map

package/dist/components/Carousel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Carousel/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}

package/dist/components/Carousel/stories/carousel.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { Carousel } from "../Carousel";
+import "../carousel.scss";
+declare const meta: Meta<typeof Carousel>;
+export default meta;
+type Story = StoryObj<typeof Carousel>;
+export declare const Default: Story;
+export declare const SunkVariant: Story;
+export declare const WithRef: Story;
+//# sourceMappingURL=carousel.stories.d.ts.map

package/dist/components/Carousel/stories/carousel.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Carousel/stories/carousel.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAoBvD,OAAO,EACL,QAAQ,EAMT,MAAM,aAAa,CAAC;AACrB,OAAO,kBAAkB,CAAC;AAE1B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CA2F/B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAC;AA2EvC,eAAO,MAAM,OAAO,EAAE,KA8CrB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KA6CzB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KA6GrB,CAAC"}

package/dist/components/Carousel/stories/carousel.stories.js

@@ -0,0 +1,257 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Building2, Camera, ChevronLeft, ChevronRight, Cpu, Dog, Music, Palette, Plane, Shirt, Trophy, UtensilsCrossed, } from "lucide-react";
+import { useEffect, useLayoutEffect, useRef, useState } from "react";
+import { Card } from "../../Card";
+import { CardHeader } from "../../CardHeader";
+import { IconButton } from "../../IconButton";
+import { Image } from "../../Image";
+import { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, } from "../Carousel";
+import "../carousel.css";
+const meta = {
+    title: "Components/Carousel",
+    component: Carousel,
+    parameters: {
+        layout: "centered",
+        docs: {
+            description: {
+                component: "```tsx\nimport { Carousel,CarouselContent,CarouselItem,CarouselNext,CarouselPrevious } from '@openui-ui/react-ui';\n```",
+            },
+        },
+    },
+    decorators: [
+        (Story) => (_jsx("div", { style: {
+                width: "100%",
+                height: "100%",
+                display: "flex",
+                justifyContent: "center",
+                alignItems: "center",
+            }, children: _jsx(Story, {}) })),
+    ],
+    argTypes: {
+        itemsToScroll: {
+            control: "number",
+            description: "Number of items to scroll when clicking navigation buttons",
+            table: {
+                category: "Behavior",
+                type: { summary: "number" },
+                defaultValue: { summary: "1" },
+            },
+        },
+        noSnap: {
+            control: "boolean",
+            description: "Whether to disable snap scrolling",
+            table: {
+                category: "Behavior",
+                type: { summary: "boolean" },
+                defaultValue: { summary: "false" },
+            },
+        },
+        showButtons: {
+            control: "boolean",
+            description: "Whether to show the navigation buttons",
+            table: {
+                category: "Appearance",
+                type: { summary: "boolean" },
+                defaultValue: { summary: "true" },
+            },
+        },
+        variant: {
+            control: "radio",
+            options: ["card", "sunk"],
+            description: "The visual style of the carousel items",
+            table: {
+                category: "Appearance",
+                type: { summary: "'card' | 'sunk'" },
+                defaultValue: { summary: "'card'" },
+            },
+        },
+        children: {
+            control: false,
+            description: "The carousel content and navigation buttons",
+            table: {
+                category: "Content",
+                type: { summary: "ReactNode" },
+            },
+        },
+        className: {
+            control: false,
+            description: "Additional CSS class name for custom styling",
+            table: {
+                category: "Styling",
+                type: { summary: "string" },
+            },
+        },
+        style: {
+            control: false,
+            description: "Inline CSS styles for custom styling",
+            table: {
+                category: "Styling",
+                type: { summary: "CSSProperties" },
+            },
+        },
+    },
+    tags: ["autodocs", "!dev"],
+};
+export default meta;
+const items = [
+    {
+        title: "Nature",
+        subtitle: "Beautiful landscapes",
+        icon: _jsx(Camera, {}),
+        imageUrl: "https://plus.unsplash.com/premium_photo-1719943510748-4b4354fbcf56?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+    {
+        title: "Architecture",
+        subtitle: "Modern buildings",
+        icon: _jsx(Building2, {}),
+        imageUrl: "https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+    {
+        title: "Technology",
+        subtitle: "Digital innovation",
+        icon: _jsx(Cpu, {}),
+        imageUrl: "https://plus.unsplash.com/premium_photo-1663050756824-165ee7eafdac?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+    {
+        title: "Art",
+        subtitle: "Creative expressions",
+        icon: _jsx(Palette, {}),
+        imageUrl: "https://images.unsplash.com/photo-1550532422-378e93ec379c?q=80&w=3024&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+    {
+        title: "Travel",
+        subtitle: "World exploration",
+        icon: _jsx(Plane, {}),
+        imageUrl: "https://images.unsplash.com/photo-1504598318550-17eba1008a68?q=80&w=2848&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+    {
+        title: "Food",
+        subtitle: "Culinary delights",
+        icon: _jsx(UtensilsCrossed, {}),
+        imageUrl: "https://plus.unsplash.com/premium_photo-1673108852141-e8c3c22a4a22?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+    {
+        title: "Sports",
+        subtitle: "Athletic moments",
+        icon: _jsx(Trophy, {}),
+        imageUrl: "https://images.unsplash.com/photo-1471295253337-3ceaaedca402?q=80&w=2992&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+    {
+        title: "Wildlife",
+        subtitle: "Animal kingdom",
+        icon: _jsx(Dog, {}),
+        imageUrl: "https://images.unsplash.com/photo-1600521605615-a8d3a23d8262?q=80&w=3874&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+    {
+        title: "Fashion",
+        subtitle: "Style trends",
+        icon: _jsx(Shirt, {}),
+        imageUrl: "https://images.unsplash.com/photo-1521335629791-ce4aec67dd15?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+    {
+        title: "Music",
+        subtitle: "Sonic experiences",
+        icon: _jsx(Music, {}),
+        imageUrl: "https://images.unsplash.com/photo-1511379938547-c1f69419868d?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+];
+export const Default = {
+    args: {
+        itemsToScroll: 1,
+        noSnap: false,
+        showButtons: true,
+        variant: "card",
+    },
+    parameters: {
+        docs: {
+            description: {
+                story: "Default carousel configuration with single item scrolling and navigation buttons.",
+            },
+        },
+    },
+    render: ({ itemsToScroll, noSnap, showButtons, variant }) => {
+        const repeatedItems = Array.from({ length: items.length }, (_, index) => ({
+            ...items[index % items.length],
+            id: `item-${index + 1}`,
+        }));
+        return (_jsx(Card, { style: { width: "700px" }, children: _jsxs(Carousel, { itemsToScroll: itemsToScroll, noSnap: noSnap, showButtons: showButtons, variant: variant, children: [_jsx(CarouselContent, { children: repeatedItems.map((item) => (_jsxs(CarouselItem, { children: [_jsx(CardHeader, { title: item.title, subtitle: item.subtitle, actions: [_jsx(IconButton, { variant: "tertiary", size: "small", icon: item.icon })] }), _jsx(Image, { src: item.imageUrl ?? "", alt: `${item.title} image`, scale: "fill" })] }, item.id))) }), _jsx(CarouselPrevious, { icon: _jsx(ChevronLeft, {}) }), _jsx(CarouselNext, { icon: _jsx(ChevronRight, {}) })] }) }));
+    },
+};
+export const SunkVariant = {
+    args: {
+        ...Default.args,
+        variant: "sunk",
+    },
+    parameters: {
+        docs: {
+            description: {
+                story: "Carousel with the `sunk` variant.",
+            },
+        },
+    },
+    render: (args) => {
+        const { itemsToScroll, noSnap, showButtons, variant } = args;
+        const repeatedItems = Array.from({ length: items.length }, (_, index) => ({
+            ...items[index % items.length],
+            id: `item-${index + 1}`,
+        }));
+        return (_jsx(Card, { style: { width: "700px" }, children: _jsxs(Carousel, { itemsToScroll: itemsToScroll, noSnap: noSnap, showButtons: false, variant: variant, children: [_jsx(CarouselContent, { children: repeatedItems.map((item) => (_jsxs(CarouselItem, { children: [_jsx(CardHeader, { title: item.title, subtitle: item.subtitle, actions: [_jsx(IconButton, { variant: "tertiary", size: "small", icon: item.icon })] }), _jsx(Image, { src: item.imageUrl ?? "", alt: `${item.title} image`, scale: "fill" })] }, item.id))) }), _jsx(CarouselPrevious, { icon: _jsx(ChevronLeft, {}) }), _jsx(CarouselNext, { icon: _jsx(ChevronRight, {}) })] }) }));
+    },
+};
+export const WithRef = {
+    args: {
+        ...Default.args,
+        variant: "card",
+    },
+    parameters: {
+        docs: {
+            description: {
+                story: "Carousel with the `sunk` variant.",
+            },
+        },
+    },
+    render: (args) => {
+        const { itemsToScroll, noSnap, variant } = args;
+        const repeatedItems = Array.from({ length: items.length }, (_, index) => ({
+            ...items[index % items.length],
+            id: `item-${index + 1}`,
+        }));
+        const ref = useRef(null);
+        const [canScroll, setCanScroll] = useState({ left: false, right: false });
+        const [scrollContainer, setScrollContainer] = useState(null);
+        useLayoutEffect(() => {
+            if (ref.current?.scrollDivRef.current) {
+                setScrollContainer(ref.current.scrollDivRef.current);
+            }
+        });
+        useEffect(() => {
+            if (!scrollContainer) {
+                return;
+            }
+            const handleScroll = () => {
+                const canScrollLeft = scrollContainer.scrollLeft > 0;
+                const canScrollRight = Math.ceil(scrollContainer.scrollLeft) + scrollContainer.offsetWidth <
+                    scrollContainer.scrollWidth;
+                setCanScroll({ left: canScrollLeft, right: canScrollRight });
+            };
+            handleScroll();
+            scrollContainer.addEventListener("scroll", handleScroll);
+            const resizeObserver = new ResizeObserver(handleScroll);
+            resizeObserver.observe(scrollContainer);
+            const mutationObserver = new MutationObserver(handleScroll);
+            mutationObserver.observe(scrollContainer, { childList: true, subtree: true });
+            return () => {
+                scrollContainer.removeEventListener("scroll", handleScroll);
+                resizeObserver.disconnect();
+                mutationObserver.disconnect();
+            };
+        }, [scrollContainer]);
+        return (_jsxs(Card, { style: { width: "700px", display: "flex", flexDirection: "column", gap: "10px" }, children: [_jsxs("div", { style: {
+                        display: "flex",
+                        flexDirection: "row",
+                        gap: "10px",
+                        justifyContent: "space-between",
+                    }, children: [_jsx("span", { children: "Carousel Header" }), _jsxs("div", { style: { display: "flex", flexDirection: "row", gap: "10px" }, children: [_jsx(IconButton, { variant: "tertiary", size: "small", onClick: () => ref.current?.scroll("left"), disabled: !canScroll.left, icon: _jsx(ChevronLeft, {}) }), _jsx(IconButton, { variant: "tertiary", size: "small", onClick: () => ref.current?.scroll("right"), disabled: !canScroll.right, icon: _jsx(ChevronRight, {}) })] })] }), _jsxs(Carousel, { ref: ref, itemsToScroll: itemsToScroll, noSnap: noSnap, showButtons: false, variant: variant, children: [_jsx(CarouselContent, { children: repeatedItems.map((item) => (_jsxs(CarouselItem, { children: [_jsx(CardHeader, { title: item.title, subtitle: item.subtitle, actions: [_jsx(IconButton, { variant: "tertiary", size: "small", icon: item.icon })] }), _jsx(Image, { src: item.imageUrl ?? "", alt: `${item.title} image`, scale: "fill" })] }, item.id))) }), _jsx(CarouselPrevious, { icon: _jsx(ChevronLeft, {}) }), _jsx(CarouselNext, { icon: _jsx(ChevronRight, {}) })] })] }));
+    },
+};
+//# sourceMappingURL=carousel.stories.js.map

package/dist/components/Carousel/stories/carousel.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.stories.js","sourceRoot":"","sources":["../../../../src/components/Carousel/stories/carousel.stories.tsx"],"names":[],"mappings":"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"}

package/dist/components/Charts/AreaChart/AreaChart.d.ts

@@ -0,0 +1,26 @@
+import React from "react";
+import { XAxisTickVariant } from "../types";
+import { PaletteName } from "../utils/PalletUtils";
+import { AreaChartData, AreaChartVariant } from "./types";
+export interface AreaChartProps<T extends AreaChartData> {
+    data: T;
+    categoryKey: keyof T[number];
+    theme?: PaletteName;
+    customPalette?: string[];
+    variant?: AreaChartVariant;
+    tickVariant?: XAxisTickVariant;
+    grid?: boolean;
+    legend?: boolean;
+    icons?: Partial<Record<keyof T[number], React.ComponentType>>;
+    isAnimationActive?: boolean;
+    showYAxis?: boolean;
+    xAxisLabel?: React.ReactNode;
+    yAxisLabel?: React.ReactNode;
+    className?: string;
+    height?: number;
+    width?: number;
+}
+declare const AreaChartComponent: <T extends AreaChartData>({ data, categoryKey, theme, customPalette, variant: areaChartVariant, tickVariant, grid, icons, isAnimationActive, showYAxis, xAxisLabel, yAxisLabel, legend, className, height, width, }: AreaChartProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const AreaChart: typeof AreaChartComponent;
+export {};
+//# sourceMappingURL=AreaChart.d.ts.map

package/dist/components/Charts/AreaChart/AreaChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AreaChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/AreaChart/AreaChart.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAsBxF,OAAO,EAAc,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAQxD,OAAO,EAAE,WAAW,EAAmB,MAAM,sBAAsB,CAAC;AAOpE,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAO1D,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,aAAa;IACrD,IAAI,EAAE,CAAC,CAAC;IACR,WAAW,EAAE,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;IAC7B,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC;IAC9D,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAKD,QAAA,MAAM,kBAAkB,GAAI,CAAC,SAAS,aAAa,EAAE,2LAiBlD,cAAc,CAAC,CAAC,CAAC,4CAwWnB,CAAC;AAGF,eAAO,MAAM,SAAS,EAAqC,OAAO,kBAAkB,CAAC"}