@tapcart/mobile-components 0.7.5 → 0.7.7

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

@@ -1,19 +1,28 @@
 import * as React from "react";
 import { Drawer as DrawerPrimitive } from "vaul";
-declare const DrawerTrigger: React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
-declare const DrawerPortal: React.FC<import("@radix-ui/react-dialog").DialogPortalProps>;
-declare const DrawerClose: React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
-type DrawerProps = React.ComponentProps<typeof DrawerPrimitive.Root>;
+type DrawerTriggerProps = React.ComponentPropsWithoutRef<"button"> & {
+    asChild?: boolean;
+};
+type DrawerPortalProps = {
+    children: React.ReactNode;
+};
+type DrawerCloseProps = React.ComponentPropsWithoutRef<"button"> & {
+    asChild?: boolean;
+};
+declare const DrawerTrigger: React.FC<DrawerTriggerProps>;
+declare const DrawerPortal: React.FC<DrawerPortalProps>;
+declare const DrawerClose: React.FC<DrawerCloseProps>;
+type DrawerProps = React.ComponentProps<typeof DrawerPrimitive.Root> & {
+    containerRef?: HTMLElement | null;
+};
 declare const Drawer: {
-    ({ shouldScaleBackground, ...props }: DrawerProps): import("react/jsx-runtime").JSX.Element;
+    ({ shouldScaleBackground, containerRef, ...props }: DrawerProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
-declare const DrawerOverlay: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dialog").DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
+declare const DrawerOverlay: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     backdropHexColor?: string | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
-declare const DrawerContentBase: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dialog").DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
-    onAnimationEnd?: ((open: boolean) => void) | undefined;
-} & React.RefAttributes<HTMLDivElement>, "ref"> & {
+declare const DrawerContentBase: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     hideBackdrop?: boolean | undefined;
     backdropHexColor?: string | undefined;
     isSheet?: boolean | undefined;
@@ -22,7 +31,7 @@ declare const DrawerFooter: {
     ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
-declare const DrawerDescription: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dialog").DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+declare const DrawerDescription: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
 type DrawerHeaderProps = {
     iconLeftName?: string;
     iconRightName?: string;

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

@@ -1 +1 @@
-{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../components/ui/drawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,MAAM,CAAA;AAIhD,QAAA,MAAM,aAAa,+HAA0B,CAAA;AAE7C,QAAA,MAAM,YAAY,8DAAyB,CAAA;AAE3C,QAAA,MAAM,WAAW,6HAAwB,CAAA;AAEzC,KAAK,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,CAAA;AAEpE,QAAA,MAAM,MAAM;0CAAyC,WAAW;;CAS/D,CAAA;AAGD,QAAA,MAAM,aAAa;;wCAejB,CAAA;AAGF,QAAA,MAAM,iBAAiB;;;;;;wCA0CtB,CAAA;AA0BD,QAAA,MAAM,YAAY;8BAGf,MAAM,cAAc,CAAC,cAAc,CAAC;;CAQtC,CAAA;AAGD,QAAA,MAAM,iBAAiB,+LASrB,CAAA;AAGF,KAAK,iBAAiB,GAAG;IACvB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;CACjD,CAAA;AAED,QAAA,MAAM,YAAY,0DAKf,iBAAiB,4CA8BnB,CAAA;AAED,QAAA,MAAM,aAAa;cAA8B,MAAM,SAAS;6CAE/D,CAAA;AAED,OAAO,EACL,MAAM,EACN,YAAY,EACZ,aAAa,EACb,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,iBAAiB,EACjB,YAAY,GACb,CAAA"}
+{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../components/ui/drawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,MAAM,CAAA;AAIhD,KAAK,kBAAkB,GAAG,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,GAAG;IACnE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,KAAK,iBAAiB,GAAG;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAAA;AAED,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,GAAG;IACjE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,QAAA,MAAM,aAAa,8BAA0D,CAAA;AAG7E,QAAA,MAAM,YAAY,6BAAwD,CAAA;AAG1E,QAAA,MAAM,WAAW,4BAAsD,CAAA;AAGvE,KAAK,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,GAAG;IACrE,YAAY,CAAC,EAAE,WAAW,GAAG,IAAI,CAAA;CAClC,CAAA;AAED,QAAA,MAAM,MAAM;wDAIT,WAAW;;CAUb,CAAA;AAOD,QAAA,MAAM,aAAa;;wCAYlB,CAAA;AASD,QAAA,MAAM,iBAAiB;;;;wCAyCtB,CAAA;AA0BD,QAAA,MAAM,YAAY;8BAGf,MAAM,cAAc,CAAC,cAAc,CAAC;;CAQtC,CAAA;AAGD,QAAA,MAAM,iBAAiB,qLASrB,CAAA;AAGF,KAAK,iBAAiB,GAAG;IACvB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;CACjD,CAAA;AAED,QAAA,MAAM,YAAY,0DAKf,iBAAiB,4CA8BnB,CAAA;AAED,QAAA,MAAM,aAAa;cAA8B,MAAM,SAAS;6CAE/D,CAAA;AAED,OAAO,EACL,MAAM,EACN,YAAY,EACZ,aAAa,EACb,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,iBAAiB,EACjB,YAAY,GACb,CAAA"}

package/dist/components/ui/drawer.js

@@ -16,11 +16,14 @@ import { Drawer as DrawerPrimitive } from "vaul";
 import { cn } from "../../lib/utils";
 import { Icon } from "./icon";
 const DrawerTrigger = DrawerPrimitive.Trigger;
+DrawerTrigger.displayName = "DrawerTrigger";
 const DrawerPortal = DrawerPrimitive.Portal;
+DrawerPortal.displayName = "DrawerPortal";
 const DrawerClose = DrawerPrimitive.Close;
+DrawerClose.displayName = "DrawerClose";
 const Drawer = (_a) => {
-    var { shouldScaleBackground } = _a, props = __rest(_a, ["shouldScaleBackground"]);
-    return (_jsx(DrawerPrimitive.Root, Object.assign({ shouldScaleBackground: true }, props, { noBodyStyles: true, disablePreventScroll: true })));
+    var { shouldScaleBackground, containerRef } = _a, props = __rest(_a, ["shouldScaleBackground", "containerRef"]);
+    return (_jsx(DrawerPrimitive.Root, Object.assign({ shouldScaleBackground: shouldScaleBackground, container: containerRef }, props, { noBodyStyles: true, disablePreventScroll: true })));
 };
 Drawer.displayName = "Drawer";
 const DrawerOverlay = React.forwardRef((_a, ref) => {
@@ -28,13 +31,13 @@ const DrawerOverlay = React.forwardRef((_a, ref) => {
     const style = { backgroundColor: `${backdropHexColor}CC` };
     return (_jsx(DrawerPrimitive.Overlay, Object.assign({ style: style, ref: ref, className: cn(`fixed inset-0 z-50`, className) }, props)));
 });
-DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
+DrawerOverlay.displayName = "DrawerOverlay";
 const DrawerContentBase = React.forwardRef((_a, ref) => {
     var { className, children, hideBackdrop = false, backdropHexColor, isSheet = false } = _a, props = __rest(_a, ["className", "children", "hideBackdrop", "backdropHexColor", "isSheet"]);
     const styles = isSheet
         ? { height: "calc(100vh - 112px)" }
         : { maxHeight: "calc(100vh - 112px)" };
-    return (_jsxs(DrawerPortal, { children: [hideBackdrop ? null : (_jsx(DrawerOverlay, { backdropHexColor: backdropHexColor })), _jsxs(DrawerPrimitive.Content, Object.assign({ ref: ref, style: styles, className: cn("fixed inset-x-0 bottom-0 z-50 flex h-auto flex-col rounded-t-2xl bg-coreColors-modalBackground", className) }, props, { children: [_jsx("div", { className: "mx-auto mb-2 mt-2 h-[4px] w-[40px] rounded-full bg-coreColors-dividingLines" }), children] }))] }));
+    return (_jsxs(DrawerPortal, { children: [hideBackdrop ? null : (_jsx(DrawerOverlay, { backdropHexColor: backdropHexColor })), _jsxs(DrawerPrimitive.Content, Object.assign({ ref: ref, style: styles, className: cn("fixed inset-x-0 bottom-0 z-50 flex h-auto flex-col rounded-t-2xl bg-coreColors-modalBackground", className) }, props, { "data-testid": "drawer-content" }, { children: [_jsx("div", { className: "mx-auto mb-2 mt-2 h-[4px] w-[40px] rounded-full bg-coreColors-dividingLines" }), children] }))] }));
 });
 DrawerContentBase.displayName = "DrawerContentBase";
 const DrawerHeaderBase = (_a) => {
@@ -44,9 +47,9 @@ const DrawerHeaderBase = (_a) => {
 DrawerHeaderBase.displayName = "DrawerHeaderBase";
 const DrawerTitle = React.forwardRef((_a, ref) => {
     var { className } = _a, props = __rest(_a, ["className"]);
-    return (_jsx(DrawerPrimitive.Title, Object.assign({ ref: ref, className: cn("text-textColors-primaryColor text-center text-[18px] font-medium leading-[24px] truncate my-0 mx-4", className) }, props)));
+    return (_jsx("h2", Object.assign({ ref: ref, className: cn("text-textColors-primaryColor text-center text-[18px] font-medium leading-[24px] truncate my-0 mx-4", className) }, props)));
 });
-DrawerTitle.displayName = DrawerPrimitive.Title.displayName;
+DrawerTitle.displayName = "DrawerTitle";
 const DrawerFooter = (_a) => {
     var { className } = _a, props = __rest(_a, ["className"]);
     return (_jsx("div", Object.assign({ className: cn("mt-auto flex flex-row gap-2 pb-8 pt-4 pl-4 pr-4 border-t border-coreColors-dividingLines", className) }, props)));
@@ -54,9 +57,9 @@ const DrawerFooter = (_a) => {
 DrawerFooter.displayName = "DrawerFooter";
 const DrawerDescription = React.forwardRef((_a, ref) => {
     var { className } = _a, props = __rest(_a, ["className"]);
-    return (_jsx(DrawerPrimitive.Description, Object.assign({ ref: ref, className: cn("text-sm text-muted-foreground", className) }, props)));
+    return (_jsx("p", Object.assign({ ref: ref, className: cn("text-sm text-muted-foreground", className) }, props)));
 });
-DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
+DrawerDescription.displayName = "DrawerDescription";
 const DrawerHeader = ({ title, iconLeftName, iconRightName, onCloseClick, }) => {
     return (_jsxs(DrawerHeaderBase, Object.assign({ className: "p-4 text-center flex justify-between" }, { children: [iconLeftName ? (_jsx(DrawerClose, Object.assign({ className: "h-6 w-6 p-0", onClick: onCloseClick }, { children: _jsx(Icon, { name: iconLeftName, color: "coreColors-secondaryIcon", className: "h-6 w-6 p-0", size: "md" }) }))) : (_jsx("div", { className: "w-6" })), _jsx(DrawerTitle, { children: title }), iconRightName ? (_jsx(DrawerClose, Object.assign({ className: "h-6 w-6 p-0", onClick: onCloseClick }, { children: _jsx(Icon, { name: iconRightName, color: "coreColors-secondaryIcon", className: "h-6 w-6 p-0", size: "md" }) }))) : (_jsx("div", { className: "w-6" }))] })));
 };

package/dist/styles.css

@@ -985,9 +985,6 @@ video {
 .max-h-\[240px\] {
   max-height: 240px;
 }
-.max-h-\[300px\] {
-  max-height: 300px;
-}
 .max-h-screen {
   max-height: 100vh;
 }
@@ -1075,9 +1072,6 @@ video {
   min-width: -moz-fit-content;
   min-width: fit-content;
 }
-.max-w-\[200px\] {
-  max-width: 200px;
-}
 .max-w-full {
   max-width: 100%;
 }
@@ -1090,6 +1084,9 @@ video {
 .flex-1 {
   flex: 1 1 0%;
 }
+.flex-none {
+  flex: none;
+}
 .flex-shrink-0 {
   flex-shrink: 0;
 }
@@ -1428,6 +1425,9 @@ video {
 .border-t {
   border-top-width: 1px;
 }
+.border-t-0 {
+  border-top-width: 0px;
+}
 .border-t-\[0px\] {
   border-top-width: 0px;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tapcart/mobile-components",
-  "version": "0.7.5",
+  "version": "0.7.7",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "style": "dist/styles.css",
@@ -73,6 +73,6 @@
     "swr": "^2.2.5",
     "tailwind-merge": "^1.13.2",
     "tailwindcss-animate": "^1.0.6",
-    "vaul": "^0.9.1"
+    "vaul": "^1.1.0"
   }
-}
+}

package/dist/components/hooks/use-destination.d.ts

@@ -1,23 +0,0 @@
-type OpenProductFn = (arg: {
-    productId: string;
-}) => void;
-type OpenCollectionFn = (arg: {
-    collectionId: string;
-}) => void;
-type OpenScreenFn = (arg: {
-    destination: {
-        type: "internal" | "web";
-        url: string;
-    };
-}) => void;
-type DestinationType = "product" | "collection" | "url" | "app-screen";
-interface UseDestinationProps {
-    openProduct: OpenProductFn;
-    openCollection: OpenCollectionFn;
-    openScreen: OpenScreenFn;
-    type: DestinationType;
-    location: string;
-}
-export declare const useDestination: ({ openProduct, openCollection, openScreen, type, location, }: UseDestinationProps) => (() => void);
-export {};
-//# sourceMappingURL=use-destination.d.ts.map

package/dist/components/hooks/use-destination.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-destination.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-destination.ts"],"names":[],"mappings":"AAEA,KAAK,aAAa,GAAG,CAAC,GAAG,EAAE;IAAE,SAAS,EAAE,MAAM,CAAA;CAAE,KAAK,IAAI,CAAA;AACzD,KAAK,gBAAgB,GAAG,CAAC,GAAG,EAAE;IAAE,YAAY,EAAE,MAAM,CAAA;CAAE,KAAK,IAAI,CAAA;AAC/D,KAAK,YAAY,GAAG,CAAC,GAAG,EAAE;IACxB,WAAW,EAAE;QAAE,IAAI,EAAE,UAAU,GAAG,KAAK,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAA;CACvD,KAAK,IAAI,CAAA;AAEV,KAAK,eAAe,GAAG,SAAS,GAAG,YAAY,GAAG,KAAK,GAAG,YAAY,CAAA;AAEtE,UAAU,mBAAmB;IAC3B,WAAW,EAAE,aAAa,CAAA;IAC1B,cAAc,EAAE,gBAAgB,CAAA;IAChC,UAAU,EAAE,YAAY,CAAA;IACxB,IAAI,EAAE,eAAe,CAAA;IACrB,QAAQ,EAAE,MAAM,CAAA;CACjB;AAED,eAAO,MAAM,cAAc,iEAMxB,mBAAmB,KAAG,CAAC,MAAM,IAAI,CAYnC,CAAA"}

package/dist/components/hooks/use-destination.js

@@ -1,13 +0,0 @@
-"use client";
-export const useDestination = ({ openProduct, openCollection, openScreen, type, location, }) => {
-    switch (type) {
-        case "product":
-            return () => openProduct({ productId: location });
-        case "collection":
-            return () => openCollection({ collectionId: location });
-        case "url":
-            return () => openScreen({ destination: { type: "web", url: location } });
-        case "app-screen":
-            return () => openScreen({ destination: { type: "internal", url: location } });
-    }
-};