@tapcart/mobile-components 0.2.4 → 0.2.8

package/dist/components/ui/product-card.d.ts

@@ -0,0 +1,68 @@
+import * as React from "react";
+export declare type Config = {
+    gridLayout?: string;
+    productImage?: {
+        enabled: boolean;
+        cornerRadius: number;
+        aspectRatio: "1:1" | "2:3" | "4:5";
+        scaling: "fill" | "fit";
+    };
+    price?: {
+        enabled: boolean;
+        fontSize: number;
+        textAlignment: string;
+        currency: string;
+        locale: string;
+    };
+    productTitle?: {
+        enabled: boolean;
+        fontSize: number;
+        uppercase: boolean;
+        textAlignment: string;
+        wrapText: boolean;
+    };
+    quickAdd?: {
+        enabled: boolean;
+        fontSize: number;
+        uppercase: boolean;
+        textAlignment: string;
+        cornerRadius: number;
+        quickAdd: (event: React.MouseEvent<HTMLButtonElement>, product: ProductCardProps["product"]) => void;
+    };
+    badge?: {
+        text: string;
+        verticalPosition: "top" | "bottom" | "below";
+        horizontalPosition: "left" | "right" | "full-width";
+        icon: string;
+    };
+    favoritesIcon?: {
+        enabled: boolean;
+        layoutType: "topLeft" | "topRight" | "bottomLeft" | "bottomRight" | "default";
+        showBackground: boolean;
+        cornerRadius: number;
+        icon: string;
+        size: "small" | "large" | null | undefined;
+    };
+};
+declare type ProductCardProps = {
+    config: Config;
+    product: {
+        variants: {
+            compare_at_price: number | undefined;
+            price: number;
+        }[];
+        images: {
+            url: string;
+        }[];
+        title: string;
+        tags: string[];
+        availableForSale: boolean;
+        openProduct: (event: React.MouseEvent<HTMLDivElement>, product: ProductCardProps["product"]) => void;
+    };
+    isLoading: boolean;
+    favorited?: boolean;
+    onFavoriteClick?: () => void;
+};
+declare const ProductCard: React.FC<ProductCardProps>;
+export { ProductCard };
+//# sourceMappingURL=product-card.d.ts.map

package/dist/components/ui/product-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-card.d.ts","sourceRoot":"","sources":["../../../components/ui/product-card.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,oBAAY,MAAM,GAAG;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,YAAY,CAAC,EAAE;QACb,OAAO,EAAE,OAAO,CAAA;QAChB,YAAY,EAAE,MAAM,CAAA;QACpB,WAAW,EAAE,KAAK,GAAG,KAAK,GAAG,KAAK,CAAA;QAClC,OAAO,EAAE,MAAM,GAAG,KAAK,CAAA;KACxB,CAAA;IACD,KAAK,CAAC,EAAE;QACN,OAAO,EAAE,OAAO,CAAA;QAChB,QAAQ,EAAE,MAAM,CAAA;QAChB,aAAa,EAAE,MAAM,CAAA;QACrB,QAAQ,EAAE,MAAM,CAAA;QAChB,MAAM,EAAE,MAAM,CAAA;KACf,CAAA;IACD,YAAY,CAAC,EAAE;QACb,OAAO,EAAE,OAAO,CAAA;QAChB,QAAQ,EAAE,MAAM,CAAA;QAChB,SAAS,EAAE,OAAO,CAAA;QAClB,aAAa,EAAE,MAAM,CAAA;QACrB,QAAQ,EAAE,OAAO,CAAA;KAClB,CAAA;IACD,QAAQ,CAAC,EAAE;QACT,OAAO,EAAE,OAAO,CAAA;QAChB,QAAQ,EAAE,MAAM,CAAA;QAChB,SAAS,EAAE,OAAO,CAAA;QAClB,aAAa,EAAE,MAAM,CAAA;QACrB,YAAY,EAAE,MAAM,CAAA;QACpB,QAAQ,EAAE,CACR,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,EAC1C,OAAO,EAAE,gBAAgB,CAAC,SAAS,CAAC,KACjC,IAAI,CAAA;KACV,CAAA;IACD,KAAK,CAAC,EAAE;QACN,IAAI,EAAE,MAAM,CAAA;QACZ,gBAAgB,EAAE,KAAK,GAAG,QAAQ,GAAG,OAAO,CAAA;QAC5C,kBAAkB,EAAE,MAAM,GAAG,OAAO,GAAG,YAAY,CAAA;QACnD,IAAI,EAAE,MAAM,CAAA;KACb,CAAA;IACD,aAAa,CAAC,EAAE;QACd,OAAO,EAAE,OAAO,CAAA;QAChB,UAAU,EACN,SAAS,GACT,UAAU,GACV,YAAY,GACZ,aAAa,GACb,SAAS,CAAA;QACb,cAAc,EAAE,OAAO,CAAA;QACvB,YAAY,EAAE,MAAM,CAAA;QACpB,IAAI,EAAE,MAAM,CAAA;QACZ,IAAI,EAAE,OAAO,GAAG,OAAO,GAAG,IAAI,GAAG,SAAS,CAAA;KAC3C,CAAA;CACF,CAAA;AAED,aAAK,gBAAgB,GAAG;IACtB,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,EAAE;QACP,QAAQ,EAAE;YAAE,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,EAAE,CAAA;QACnE,MAAM,EAAE;YAAE,GAAG,EAAE,MAAM,CAAA;SAAE,EAAE,CAAA;QACzB,KAAK,EAAE,MAAM,CAAA;QACb,IAAI,EAAE,MAAM,EAAE,CAAA;QACd,gBAAgB,EAAE,OAAO,CAAA;QACzB,WAAW,EAAE,CACX,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,EACvC,OAAO,EAAE,gBAAgB,CAAC,SAAS,CAAC,KACjC,IAAI,CAAA;KACV,CAAA;IACD,SAAS,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;CAC7B,CAAA;AAqFD,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA2J3C,CAAA;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/components/ui/product-card.js

@@ -0,0 +1,132 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge } from "../../components/ui/badge";
+import { Button } from "../../components/ui/button";
+import { Text } from "../../components/ui/text";
+import * as React from "react";
+import { Price } from "../../components/ui/price";
+import { Skeleton } from "../../components/ui/skeleton";
+import { Favorite } from "../../components/ui/favorite";
+import { cn } from "../../lib/utils";
+import { cva } from "class-variance-authority";
+const aspectScalingVariants = cva("w-full", {
+    variants: {
+        aspectRatio: {
+            "1:1": "aspect-square",
+            "2:3": "aspect-[2/3]",
+            "4:5": "aspect-[4/5]",
+        },
+        scaling: {
+            fill: "object-cover",
+            fit: "object-contain",
+        },
+    },
+    defaultVariants: {
+        aspectRatio: "2:3",
+        scaling: "fill",
+    },
+});
+const badgeVariants = cva("absolute", {
+    variants: {
+        horizontalPosition: {
+            left: "left-0",
+            right: "right-0",
+            "full-width": "",
+        },
+        verticalPosition: {
+            top: "top-0 mt-2",
+            bottom: "bottom-0 mb-2",
+        },
+    },
+});
+const favoriteVariants = cva("absolute ", {
+    variants: {
+        iconPosition: {
+            topLeft: "top-0 left-2 mt-2",
+            topRight: "top-0 right-2 mt-2",
+            bottomLeft: "bottom-0 left-2 mb-2",
+            bottomRight: "bottom-0 right-2 mb-2",
+            default: "",
+        },
+        badgeHorizontalPosition: {
+            left: "",
+            right: "",
+            "full-width": "",
+        },
+        badgeVerticalPosition: {
+            top: "",
+            bottom: "",
+            below: "",
+        },
+    },
+    compoundVariants: [
+        {
+            iconPosition: "topLeft",
+            badgeHorizontalPosition: ["left", "full-width"],
+            badgeVerticalPosition: "top",
+            class: "top-10",
+        },
+        {
+            iconPosition: "topRight",
+            badgeHorizontalPosition: ["right", "full-width"],
+            badgeVerticalPosition: "top",
+            class: "top-10",
+        },
+        {
+            iconPosition: "bottomLeft",
+            badgeHorizontalPosition: ["left", "full-width"],
+            badgeVerticalPosition: "bottom",
+            class: "bottom-10",
+        },
+        {
+            iconPosition: "bottomRight",
+            badgeHorizontalPosition: ["right", "full-width"],
+            badgeVerticalPosition: "bottom",
+            class: "bottom-10",
+        },
+    ],
+    defaultVariants: {
+        iconPosition: "default",
+    },
+});
+const ProductCard = ({ config, product, isLoading, favorited, onFavoriteClick, }) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    const { variants: [variant], images: [{ url }], title, tags, } = product;
+    const [isSelected, setIsSelected] = React.useState(false);
+    const handleFavoriteClick = () => {
+        setIsSelected((prevState) => !prevState);
+    };
+    const iconPosition = ((_a = config.favoritesIcon) === null || _a === void 0 ? void 0 : _a.layoutType) || "default";
+    if (isLoading) {
+        return (_jsxs("div", Object.assign({ className: "w-1/2 rounded" }, { children: [_jsx(Skeleton, { className: "w-full h-64 rounded" }, void 0), _jsx(Skeleton, { className: "h-6 w-1/2 mt-2 rounded" }, void 0), _jsx(Skeleton, { className: "h-4 w-full mt-2 rounded" }, void 0)] }), void 0));
+    }
+    return (_jsx("div", { children: _jsxs("div", { children: [((_b = config.productImage) === null || _b === void 0 ? void 0 : _b.enabled) && (_jsxs("div", Object.assign({ className: "relative w-full overflow-hidden", style: {
+                        borderTopLeftRadius: `${config.productImage.cornerRadius}px`,
+                        borderTopRightRadius: `${config.productImage.cornerRadius}px`,
+                    } }, { children: [_jsx("img", { className: cn(aspectScalingVariants({
+                                aspectRatio: (_c = config.productImage) === null || _c === void 0 ? void 0 : _c.aspectRatio,
+                                scaling: config.productImage.scaling,
+                            })), src: url, onClick: (e) => product.openProduct(e, product) }, void 0), config.badge &&
+                            tags.includes(config.badge.text) &&
+                            config.badge.verticalPosition !== "below" && (_jsx(Badge, Object.assign({ size: "plp-layout", className: cn(badgeVariants({
+                                verticalPosition: config.badge.verticalPosition,
+                                horizontalPosition: config.badge.horizontalPosition,
+                            })), alignment: config.badge.horizontalPosition, icon: config.badge.icon }, { children: config.badge.text }), void 0)), ((_d = config.favoritesIcon) === null || _d === void 0 ? void 0 : _d.enabled) && iconPosition !== "default" && (_jsx(Favorite, { className: cn(favoriteVariants({
+                                iconPosition,
+                                badgeHorizontalPosition: (_e = config === null || config === void 0 ? void 0 : config.badge) === null || _e === void 0 ? void 0 : _e.horizontalPosition,
+                                badgeVerticalPosition: (_f = config === null || config === void 0 ? void 0 : config.badge) === null || _f === void 0 ? void 0 : _f.verticalPosition,
+                            })), selected: favorited, onClick: onFavoriteClick || handleFavoriteClick }, void 0))] }), void 0)), ((_g = config.quickAdd) === null || _g === void 0 ? void 0 : _g.enabled) && (_jsx(Button, Object.assign({ className: "outline-0", style: {
+                        borderBottomLeftRadius: `${config.quickAdd.cornerRadius}px`,
+                        borderBottomRightRadius: `${config.quickAdd.cornerRadius}px`,
+                    }, variant: "quickadd", size: "default", onClick: (e) => {
+                        var _a;
+                        e.stopPropagation();
+                        (_a = config.quickAdd) === null || _a === void 0 ? void 0 : _a.quickAdd(e, product);
+                    } }, { children: "+ Quick add" }), void 0)), _jsxs("div", Object.assign({ className: "mt-2 w-full flex-col justify-start items-start gap-1 inline-flex" }, { children: [config.badge &&
+                            tags.includes(config.badge.text) &&
+                            config.badge.verticalPosition === "below" && (_jsx("div", Object.assign({ className: `w-full flex ${config.badge.horizontalPosition === "right"
+                                ? "justify-end"
+                                : "justify-start"}` }, { children: _jsx(Badge, Object.assign({ size: "plp-layout", alignment: config.badge.horizontalPosition, icon: config.badge.icon, className: "rounded" }, { children: config.badge.text }), void 0) }), void 0)), _jsxs("div", Object.assign({ className: "flex w-full justify-between items-center gap-2" }, { children: [((_h = config.price) === null || _h === void 0 ? void 0 : _h.enabled) && (_jsx(Price, { price: variant.price, isSale: !!variant.compare_at_price, compareAtPrice: variant.compare_at_price, currency: config.price.currency, locale: config.price.locale }, void 0)), _jsx("div", Object.assign({ className: "w-8 h-8 flex items-center justify-center" }, { children: ((_j = config.favoritesIcon) === null || _j === void 0 ? void 0 : _j.enabled) &&
+                                        config.favoritesIcon.layoutType === "default" && (_jsx(Favorite, { selected: isSelected, onClick: handleFavoriteClick, size: "small" }, void 0)) }), void 0)] }), void 0), ((_k = config.productTitle) === null || _k === void 0 ? void 0 : _k.enabled) && (_jsx("div", { children: _jsx(Text, Object.assign({ type: "body-secondary", className: "text-textColors-productTitle" }, { children: title }), void 0) }, void 0))] }), void 0)] }, void 0) }, void 0));
+};
+export { ProductCard };

package/dist/components/ui/product-grid.d.ts

@@ -0,0 +1,14 @@
+declare type Product = any;
+interface PageData {
+    products: Product[];
+    cursorBlob?: string;
+}
+interface ProductGridItemsProps {
+    initialData: PageData[];
+    loadMoreProducts: (params: any) => Promise<PageData>;
+    queryVariables: Record<string, any>;
+    config: Record<string, any>;
+}
+declare function ProductGrid({ loadMoreProducts, initialData, queryVariables, config, }: ProductGridItemsProps): import("react/jsx-runtime").JSX.Element;
+export { ProductGrid };
+//# sourceMappingURL=product-grid.d.ts.map

package/dist/components/ui/product-grid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-grid.d.ts","sourceRoot":"","sources":["../../../components/ui/product-grid.tsx"],"names":[],"mappings":"AAkBA,aAAK,OAAO,GAAG,GAAG,CAAA;AAClB,UAAU,QAAQ;IAChB,QAAQ,EAAE,OAAO,EAAE,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,UAAU,qBAAqB;IAC7B,WAAW,EAAE,QAAQ,EAAE,CAAA;IACvB,gBAAgB,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,OAAO,CAAC,QAAQ,CAAC,CAAA;IACpD,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACnC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CAC5B;AAED,iBAAS,WAAW,CAAC,EACnB,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,MAAM,GACP,EAAE,qBAAqB,2CAmCvB;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/components/ui/product-grid.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useInfiniteScroll } from "../../components/hooks/use-infinite-scroll";
+import { ProductCard } from "./product-card";
+const Loader = () => (_jsx("div", Object.assign({ className: "grid-cols-2 lg:grid-cols-3" }, { children: Array(4)
+        .fill(0)
+        .map((_, index) => (_jsx("div", { className: "aspect-[2/3] animate-pulse bg-neutral-100 dark:bg-neutral-900" }, index))) }), void 0));
+function ProductGrid({ loadMoreProducts, initialData, queryVariables, config, }) {
+    const { data, error, isLoadingInitialData, isLoadingMore, isEmpty, isReachingEnd, ref, products, } = useInfiniteScroll({
+        initialData,
+        loadMoreProducts,
+        queryVariables,
+    });
+    if (error)
+        return _jsx("div", { children: "Failed to load data" }, void 0);
+    if (isLoadingInitialData)
+        return _jsx(Loader, {}, void 0);
+    return (_jsxs(_Fragment, { children: [_jsx("div", Object.assign({ className: "grid-cols-2 lg:grid-cols-3" }, { children: products.map((product, i) => (_jsx(ProductCard, { 
+                    // @ts-ignore
+                    product: product, config: config, isLoading: false }, product.handle))) }), void 0), isLoadingMore ? _jsx(Loader, {}, void 0) : _jsx("div", { ref: ref }, void 0)] }, void 0));
+}
+export { ProductGrid };

package/dist/components/ui/radio-group.d.ts

@@ -0,0 +1,21 @@
+import * as React from "react";
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+import { type VariantProps } from "class-variance-authority";
+declare const RadioGroup: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface RadioGroupItemProps {
+    label?: string;
+    subtext?: string;
+    numberAmount?: number;
+    className?: string;
+    onSelect?: React.ReactEventHandler;
+    selected?: boolean;
+    value: string;
+}
+declare const radiogroupItemVariants: (props?: ({
+    variant?: "selected" | "default" | "deactivated" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+declare const RadioGroupItem: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & RadioGroupItemProps & VariantProps<(props?: ({
+    variant?: "selected" | "default" | "deactivated" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
+export { RadioGroup, RadioGroupItem, radiogroupItemVariants };
+//# sourceMappingURL=radio-group.d.ts.map

package/dist/components/ui/radio-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../components/ui/radio-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAA;AAElE,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAKjE,QAAA,MAAM,UAAU,+JAWd,CAAA;AAGF,MAAM,WAAW,mBAAmB;IAClC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;CACd;AAED,QAAA,MAAM,sBAAsB;;mFAc3B,CAAA;AA6BD,QAAA,MAAM,cAAc;;8HA8EnB,CAAA;AAGD,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,sBAAsB,EAAE,CAAA"}

package/dist/components/ui/radio-group.js

@@ -0,0 +1,47 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import * as React from "react";
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+import { cva } from "class-variance-authority";
+import { cn } from "../../lib/utils";
+import { Icon } from "./icon";
+import { Text } from "./text";
+const RadioGroup = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(RadioGroupPrimitive.Root, Object.assign({ className: cn("grid gap-2", className) }, props, { ref: ref }), void 0));
+});
+RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
+const radiogroupItemVariants = cva("grid grid-cols-[auto,auto,1fr] gap-2 items-start group", {
+    variants: {
+        variant: {
+            default: "",
+            selected: "[&>div>button]:border-coreColors-brandColorPrimary",
+            deactivated: "[&_p]:text-stateColors-disabled",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+const RadioGroupItemLabels = ({ key, label, numberAmount, subtext }) => (_jsxs("div", Object.assign({ className: "col-span-2" }, { children: [_jsxs("div", Object.assign({ className: "flex flex-row items-start mb-2" }, { children: [_jsx(Text, Object.assign({ type: "body-primary", className: "group-disabled:text-stateColors-disabled mr-2" }, { children: label }), void 0), numberAmount ?
+                    _jsx(Text, Object.assign({ type: "body-primary", className: "text-textColors-secondaryColor group-disabled:text-stateColors-disabled" }, { children: `(${numberAmount})` }), void 0)
+                    : null] }), void 0), subtext ?
+            _jsx(Text, Object.assign({ type: "body-secondary", className: "group-disabled:text-stateColors-disabled" }, { children: subtext }), void 0)
+            : null] }), void 0));
+const RadioGroupItem = React.forwardRef((_a, ref) => {
+    var { value, label = "", subtext, numberAmount = 0, onSelect, onClick, selected = false, className, variant = "default", key } = _a, props = __rest(_a, ["value", "label", "subtext", "numberAmount", "onSelect", "onClick", "selected", "className", "variant", "key"]);
+    return (_jsx("div", Object.assign({ className: cn(radiogroupItemVariants({ variant }), className) }, { children: variant === "deactivated" ? (_jsxs(_Fragment, { children: [_jsx(Icon, { name: "circle-off", size: "md", className: "text-stateColors-disabled" }, void 0), _jsx(RadioGroupItemLabels, { label: label, numberAmount: numberAmount, subtext: subtext }, key)] }, void 0)) : (_jsx(RadioGroupPrimitive.Item, Object.assign({ ref: ref, value: value, onSelect: onSelect, checked: selected, onClick: onClick, className: cn("flex items-center justify-center", className) }, props, { children: selected || variant === "selected" ? (_jsxs("div", Object.assign({ className: "grid grid-cols-[auto,auto,1fr] gap-2 items-start group" }, { children: [_jsx(Icon, { name: "circle-dot-filled", size: "md", className: "text-coreColors-brandColorPrimary z-10" }, void 0), _jsx(RadioGroupItemLabels, { label: label, numberAmount: numberAmount, subtext: subtext }, key)] }), void 0)) : (_jsxs("div", Object.assign({ className: "grid grid-cols-[auto,auto,1fr] gap-2 items-start group" }, { children: [_jsxs("div", Object.assign({ className: "grid" }, { children: [_jsx(RadioGroupPrimitive.Indicator, Object.assign({ className: "flex items-center justify-center col-start-1 row-start-1" }, { children: _jsx(Icon, { name: "circle-dot-filled", size: "md", className: "text-coreColors-brandColorPrimary z-10" }, void 0) }), void 0), _jsx("div", Object.assign({ className: "flex items-center justify-center col-start-1 row-start-1" }, { children: _jsx(Icon, { name: "circle", size: "md", className: "col-start-1 row-start-1 text-coreColors-secondaryIcon items-center z-1" }, void 0) }), void 0)] }), void 0), _jsx(RadioGroupItemLabels, { label: label, numberAmount: numberAmount, subtext: subtext }, key)] }), void 0)) }), void 0)) }), void 0));
+});
+RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
+export { RadioGroup, RadioGroupItem, radiogroupItemVariants };

package/dist/components/ui/scroll-area.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
+declare type Orientation = "horizontal" | "vertical";
+declare const ScrollArea: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ScrollBar: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaScrollbarProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    orientation?: Orientation | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { ScrollArea, ScrollBar };
+//# sourceMappingURL=scroll-area.d.ts.map

package/dist/components/ui/scroll-area.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.d.ts","sourceRoot":"","sources":["../../../components/ui/scroll-area.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAA;AAIlE,aAAK,WAAW,GAAG,YAAY,GAAG,UAAU,CAAA;AAE5C,QAAA,MAAM,UAAU,+JAed,CAAA;AAGF,QAAA,MAAM,SAAS;;wCAuBb,CAAA;AAGF,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,CAAA"}

package/dist/components/ui/scroll-area.js

@@ -0,0 +1,29 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
+import { cn } from "../../lib/utils";
+const ScrollArea = React.forwardRef((_a, ref) => {
+    var { className, children } = _a, props = __rest(_a, ["className", "children"]);
+    return (_jsxs(ScrollAreaPrimitive.Root, Object.assign({ ref: ref, className: cn("relative overflow-hidden", className) }, props, { children: [_jsx(ScrollAreaPrimitive.Viewport, Object.assign({ className: "h-full w-full rounded-[inherit]" }, { children: _jsx("div", Object.assign({ className: "flex w-max px-[16px]" }, { children: children }), void 0) }), void 0), _jsx(ScrollBar, {}, void 0), _jsx(ScrollAreaPrimitive.Corner, {}, void 0)] }), void 0));
+});
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+const ScrollBar = React.forwardRef((_a, ref) => {
+    var { className, orientation = "horizontal" } = _a, props = __rest(_a, ["className", "orientation"]);
+    return (_jsx(ScrollAreaPrimitive.ScrollAreaScrollbar, Object.assign({ ref: ref, orientation: orientation, className: cn("flex touch-none select-none transition-colors", orientation === "vertical" &&
+            "h-full w-2.5 border-l border-l-transparent p-[1px]", orientation === "horizontal" &&
+            "h-2.5 flex-col border-t border-t-transparent p-[1px] ", className) }, props, { children: _jsx(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" }, void 0) }), void 0));
+});
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
+export { ScrollArea, ScrollBar };

package/dist/components/ui/selectors.d.ts

@@ -0,0 +1,30 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const selectorsVariants: (props?: ({
+    selected?: boolean | null | undefined;
+    disabled?: boolean | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+declare type SelectorsProps = React.ComponentPropsWithoutRef<"button"> & VariantProps<typeof selectorsVariants> & {
+    disabled?: boolean;
+    selected?: boolean;
+    label?: string;
+    key?: string;
+    onSelect?: React.MouseEventHandler<HTMLButtonElement> | undefined;
+};
+declare const Selectors: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
+    selected?: boolean | null | undefined;
+    disabled?: boolean | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & {
+    disabled?: boolean | undefined;
+    selected?: boolean | undefined;
+    label?: string | undefined;
+    key?: string | undefined;
+    onSelect?: React.MouseEventHandler<HTMLButtonElement> | undefined;
+} & React.RefAttributes<HTMLButtonElement>>;
+declare type SelectorContainerProps = {
+    children: React.ReactElement<SelectorsProps>[];
+    containerRef: React.RefObject<HTMLButtonElement>;
+};
+declare const SelectorContainer: React.FC<SelectorContainerProps>;
+export { SelectorContainer, Selectors, selectorsVariants };
+//# sourceMappingURL=selectors.d.ts.map

package/dist/components/ui/selectors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectors.d.ts","sourceRoot":"","sources":["../../../components/ui/selectors.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,iBAAiB;;;mFAiBtB,CAAA;AAED,aAAK,cAAc,GAAG,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,GAC5D,YAAY,CAAC,OAAO,iBAAiB,CAAC,GAAG;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,SAAS,CAAA;CAClE,CAAA;AAEH,QAAA,MAAM,SAAS;;;;;;;;eAHA,MAAM,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,SAAS;2CA6BpE,CAAA;AACD,aAAK,sBAAsB,GAAG;IAC5B,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,EAAE,CAAA;IAC9C,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAA;CACjD,CAAA;AACD,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAQvD,CAAA;AAID,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,iBAAiB,EAAE,CAAA"}

package/dist/components/ui/selectors.js

@@ -0,0 +1,45 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "../../lib/utils";
+import { Text } from "./text";
+const selectorsVariants = cva("flex py-2 px-4 whitespace-nowrap bg-coreColors-pageColor flex-row justify-center outline outline-1 rounded text-textColors-primaryColor outline-coreColors-dividingLines items-center", {
+    variants: {
+        selected: {
+            true: "outline-coreColors-brandColorPrimary",
+            false: "",
+        },
+        disabled: {
+            true: "[&>p]:!line-through [&>p]:text-stateColors-disabled",
+            false: "cursor-pointer active:outline-coreColors-brandColorPrimary",
+        },
+    },
+    defaultVariants: {
+        selected: false,
+    },
+});
+const Selectors = React.forwardRef((_a, ref) => {
+    var { label, selected, disabled = false, className, onSelect } = _a, props = __rest(_a, ["label", "selected", "disabled", "className", "onSelect"]);
+    return (_jsx("button", Object.assign({ disabled: disabled, onClick: onSelect, className: cn(selectorsVariants({
+            selected: selected,
+            className,
+            disabled,
+        }), "group"), ref: ref }, props, { children: _jsx(Text, Object.assign({ type: "body-primary", color: "text-textColors-primaryColor" }, { children: label }), void 0) }), void 0));
+});
+const SelectorContainer = ({ children }) => {
+    return (_jsx("div", Object.assign({ className: "flex gap-2 px-1 h-[42px] items-center overflow-x-auto" }, { children: children.map((chip, index) => (_jsx("div", { children: chip }, index))) }), void 0));
+};
+Selectors.displayName = "Selectors";
+export { SelectorContainer, Selectors, selectorsVariants };

package/dist/components/ui/separator.d.ts

@@ -0,0 +1,5 @@
+import * as React from "react";
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+declare const Separator: React.ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Separator };
+//# sourceMappingURL=separator.d.ts.map

package/dist/components/ui/separator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"separator.d.ts","sourceRoot":"","sources":["../../../components/ui/separator.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAA;AAI/D,QAAA,MAAM,SAAS,6JAoBd,CAAA;AAGD,OAAO,EAAE,SAAS,EAAE,CAAA"}

package/dist/components/ui/separator.js

@@ -0,0 +1,22 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+import { cn } from "../../lib/utils";
+const Separator = React.forwardRef((_a, ref) => {
+    var { className, orientation = "horizontal", decorative = true } = _a, props = __rest(_a, ["className", "orientation", "decorative"]);
+    return (_jsx(SeparatorPrimitive.Root, Object.assign({ ref: ref, decorative: decorative, orientation: orientation, className: cn("shrink-0 bg-border", orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]", className) }, props), void 0));
+});
+Separator.displayName = SeparatorPrimitive.Root.displayName;
+export { Separator };

package/dist/components/ui/skeleton.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { type VariantProps } from "class-variance-authority";
+declare const skeletonVariants: (props?: ({
+    variant?: "circle" | "line" | "rectangular" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof skeletonVariants> {
+    height?: number;
+    width?: number;
+    borderRadius?: number;
+}
+declare function Skeleton({ className, variant, height, width, borderRadius, ...props }: SkeletonProps): import("react/jsx-runtime").JSX.Element;
+export { Skeleton };
+//# sourceMappingURL=skeleton.d.ts.map

package/dist/components/ui/skeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../components/ui/skeleton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,QAAA,MAAM,gBAAgB;;mFAYrB,CAAA;AAED,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,gBAAgB,CAAC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,OAAO,EACP,MAAM,EACN,KAAK,EACL,YAAgB,EAChB,GAAG,KAAK,EACT,EAAE,aAAa,2CAYf;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/components/ui/skeleton.js

@@ -0,0 +1,33 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { cn } from "../../lib/utils";
+const skeletonVariants = cva("animate-pulse flex bg-stateColors-skeleton h-10 w-10 rounded-[4px]", {
+    variants: {
+        variant: {
+            line: "",
+            rectangular: "",
+            circle: "rounded-full",
+        },
+    },
+    defaultVariants: { variant: "line" },
+});
+function Skeleton(_a) {
+    var { className, variant, height, width, borderRadius = 4 } = _a, props = __rest(_a, ["className", "variant", "height", "width", "borderRadius"]);
+    return (_jsx("div", Object.assign({ className: cn(skeletonVariants({ variant }), className), style: {
+            width: width,
+            height: height,
+            borderRadius: variant === "rectangular" ? borderRadius : "",
+        } }, props), void 0));
+}
+export { Skeleton };

package/dist/components/ui/switch.d.ts

@@ -0,0 +1,5 @@
+import * as React from "react";
+import * as SwitchPrimitives from "@radix-ui/react-switch";
+declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export { Switch };
+//# sourceMappingURL=switch.d.ts.map

package/dist/components/ui/switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../components/ui/switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,gBAAgB,MAAM,wBAAwB,CAAA;AAI1D,QAAA,MAAM,MAAM,8JAkBV,CAAA;AAGF,OAAO,EAAE,MAAM,EAAE,CAAA"}

package/dist/components/ui/switch.js

@@ -0,0 +1,22 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import * as SwitchPrimitives from "@radix-ui/react-switch";
+import { cn } from "../../lib/utils";
+const Switch = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(SwitchPrimitives.Root, Object.assign({ className: cn("peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input", className) }, props, { ref: ref }, { children: _jsx(SwitchPrimitives.Thumb, { className: cn("pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0") }, void 0) }), void 0));
+});
+Switch.displayName = SwitchPrimitives.Root.displayName;
+export { Switch };

package/dist/components/ui/tabs.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+export interface TabsProps extends React.HTMLAttributes<HTMLDivElement> {
+    tabs: {
+        label: string;
+        children: React.ReactNode;
+    }[];
+    activeTab: number;
+    onTabChange: (_: number) => void;
+    active?: number;
+}
+declare const Tabs: React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>>;
+export { Tabs };
+//# sourceMappingURL=tabs.d.ts.map

package/dist/components/ui/tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../components/ui/tabs.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,MAAM,WAAW,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACrE,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE,EAAE,CAAA;IACpD,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAChC,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB;AAiCD,QAAA,MAAM,IAAI,kFAyGT,CAAA;AAGD,OAAO,EAAE,IAAI,EAAE,CAAA"}