@tapcart/mobile-components 0.2.10 → 0.2.12

package/dist/components/ui/use-toast.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
-import type { ToastProps } from "@/components/ui/toast";
-declare type ToasterToast = ToastProps & {
+import type { ToastProps } from "./toast";
+type ToasterToast = ToastProps & {
     id: string;
     title?: React.ReactNode;
     description?: React.ReactNode;
@@ -12,8 +12,8 @@ declare const actionTypes: {
     readonly DISMISS_TOAST: "DISMISS_TOAST";
     readonly REMOVE_TOAST: "REMOVE_TOAST";
 };
-declare type ActionType = typeof actionTypes;
-declare type Action = {
+type ActionType = typeof actionTypes;
+type Action = {
     type: ActionType["ADD_TOAST"];
     toast: ToasterToast;
 } | {
@@ -30,7 +30,7 @@ interface State {
     toasts: ToasterToast[];
 }
 export declare const reducer: (state: State, action: Action) => State;
-declare type Toast = Omit<ToasterToast, "id">;
+type Toast = Omit<ToasterToast, "id">;
 declare function toast({ ...props }: Toast): {
     id: string;
     dismiss: () => void;
@@ -38,7 +38,7 @@ declare function toast({ ...props }: Toast): {
 };
 declare function useToast(): {
     toast: typeof toast;
-    dismiss: (toastId?: string | undefined) => void;
+    dismiss: (toastId?: string) => void;
     toasts: ToasterToast[];
 };
 export { useToast, toast };

package/dist/components/ui/use-toast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-toast.d.ts","sourceRoot":"","sources":["../../../components/ui/use-toast.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAsB,UAAU,EAAE,MAAM,uBAAuB,CAAA;AAK3E,aAAK,YAAY,GAAG,UAAU,GAAG;IAC/B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,QAAA,MAAM,WAAW;;;;;CAKP,CAAA;AASV,aAAK,UAAU,GAAG,OAAO,WAAW,CAAA;AAEpC,aAAK,MAAM,GACP;IACE,IAAI,EAAE,UAAU,CAAC,WAAW,CAAC,CAAA;IAC7B,KAAK,EAAE,YAAY,CAAA;CACpB,GACD;IACE,IAAI,EAAE,UAAU,CAAC,cAAc,CAAC,CAAA;IAChC,KAAK,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;CAC7B,GACD;IACE,IAAI,EAAE,UAAU,CAAC,eAAe,CAAC,CAAA;IACjC,OAAO,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,CAAA;CAC7B,GACD;IACE,IAAI,EAAE,UAAU,CAAC,cAAc,CAAC,CAAA;IAChC,OAAO,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,CAAA;CAC7B,CAAA;AAEL,UAAU,KAAK;IACb,MAAM,EAAE,YAAY,EAAE,CAAA;CACvB;AAoBD,eAAO,MAAM,OAAO,UAAW,KAAK,UAAU,MAAM,KAAG,KAqDtD,CAAA;AAaD,aAAK,KAAK,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,CAAA;AAErC,iBAAS,KAAK,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK;;;oBAGT,YAAY;EAwBpC;AAED,iBAAS,QAAQ;;;;EAkBhB;AAED,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"use-toast.d.ts","sourceRoot":"","sources":["../../../components/ui/use-toast.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAsB,UAAU,EAAE,MAAM,SAAS,CAAA;AAK7D,KAAK,YAAY,GAAG,UAAU,GAAG;IAC/B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,QAAA,MAAM,WAAW;;;;;CAKP,CAAA;AASV,KAAK,UAAU,GAAG,OAAO,WAAW,CAAA;AAEpC,KAAK,MAAM,GACP;IACE,IAAI,EAAE,UAAU,CAAC,WAAW,CAAC,CAAA;IAC7B,KAAK,EAAE,YAAY,CAAA;CACpB,GACD;IACE,IAAI,EAAE,UAAU,CAAC,cAAc,CAAC,CAAA;IAChC,KAAK,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;CAC7B,GACD;IACE,IAAI,EAAE,UAAU,CAAC,eAAe,CAAC,CAAA;IACjC,OAAO,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,CAAA;CAC7B,GACD;IACE,IAAI,EAAE,UAAU,CAAC,cAAc,CAAC,CAAA;IAChC,OAAO,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,CAAA;CAC7B,CAAA;AAEL,UAAU,KAAK;IACb,MAAM,EAAE,YAAY,EAAE,CAAA;CACvB;AAoBD,eAAO,MAAM,OAAO,UAAW,KAAK,UAAU,MAAM,KAAG,KAqDtD,CAAA;AAaD,KAAK,KAAK,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,CAAA;AAErC,iBAAS,KAAK,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK;;;oBAGT,YAAY;EAwBpC;AAED,iBAAS,QAAQ;;wBAgBO,MAAM;;EAE7B;AAED,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAA"}

package/dist/components/ui/video.js

@@ -17,6 +17,6 @@ const videoVariants = cva("w-full", {
 });
 function Video(_a) {
     var { className } = _a, props = __rest(_a, ["className"]);
-    return (_jsx("video", Object.assign({ className: cn(videoVariants({}), className) }, props, { autoPlay: true, playsInline: true, muted: true, loop: true }), void 0));
+    return (_jsx("video", Object.assign({ className: cn(videoVariants({}), className) }, props, { autoPlay: true, playsInline: true, muted: true, loop: true })));
 }
 export { Video, videoVariants };

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

@@ -7,6 +7,7 @@ export interface WishlistProps extends React.ButtonHTMLAttributes<HTMLButtonElem
     onClick?: () => void;
     className?: string;
 }
+declare const PlaceholderIcon: () => import("react/jsx-runtime").JSX.Element;
 declare const Wishlist: React.ForwardRefExoticComponent<WishlistProps & React.RefAttributes<HTMLButtonElement>>;
-export { Wishlist };
+export { Wishlist, PlaceholderIcon };
 //# sourceMappingURL=wishlist.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"wishlist.d.ts","sourceRoot":"","sources":["../../../components/ui/wishlist.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAQD,QAAA,MAAM,QAAQ,yFAuCb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"wishlist.d.ts","sourceRoot":"","sources":["../../../components/ui/wishlist.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,eAAe,+CAIpB,CAAA;AAED,QAAA,MAAM,QAAQ,yFAuCb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,CAAA"}

package/dist/components/ui/wishlist.js

@@ -14,10 +14,10 @@ import * as React from "react";
 import { Text } from "./text";
 import { cn } from "../../lib/utils";
 import { Icon } from "./icon";
-const PlaceholderIcon = () => (_jsx("div", Object.assign({ className: "flex-shrink-0 flex items-center justify-center h-10 w-10 bg-stateColors-skeleton rounded-sm" }, { children: _jsx(Icon, { name: "heart-filled", size: "sm", color: "stateColors-disabled" }, void 0) }), void 0));
+const PlaceholderIcon = () => (_jsx("div", Object.assign({ className: "flex-shrink-0 flex items-center justify-center h-10 w-10 bg-stateColors-skeleton rounded-sm" }, { children: _jsx(Icon, { name: "heart-filled", size: "sm", color: "stateColors-disabled" }) })));
 const Wishlist = React.forwardRef((_a, ref) => {
     var { imgUrl, name, amount, selected = false, onClick, className } = _a, props = __rest(_a, ["imgUrl", "name", "amount", "selected", "onClick", "className"]);
-    return (_jsxs("button", Object.assign({ className: cn("flex flex-row items-center px-4 py-2 w-full border-b border-coreColors-dividingLines", selected ? "bg-stateColors-skeleton" : "", className), ref: ref, onClick: onClick }, props, { children: [imgUrl ? (_jsx("img", { alt: "wishlist-image", className: "flex-shrink-0 h-10 w-10 border border-coreColors-dividingLines rounded-sm", src: imgUrl }, void 0)) : (_jsx(PlaceholderIcon, {}, void 0)), _jsxs("div", Object.assign({ className: "flex flex-col items-start ml-2 space-y-1 overflow-hidden" }, { children: [_jsx(Text, Object.assign({ type: "body-primary", className: "w-full overflow-hidden text-ellipsis whitespace-nowrap" }, { children: name }), void 0), _jsx(Text, Object.assign({ type: "body-secondary", className: "h-4" }, { children: `${amount} item${amount !== 1 ? "s" : ""}` }), void 0)] }), void 0)] }), void 0));
+    return (_jsxs("button", Object.assign({ className: cn("flex flex-row items-center px-4 py-2 w-full border-b border-coreColors-dividingLines", selected ? "bg-stateColors-skeleton" : "", className), ref: ref, onClick: onClick }, props, { children: [imgUrl ? (_jsx("img", { alt: "wishlist-image", className: "flex-shrink-0 h-10 w-10 border border-coreColors-dividingLines rounded-sm", src: imgUrl })) : (_jsx(PlaceholderIcon, {})), _jsxs("div", Object.assign({ className: "flex flex-col items-start ml-2 space-y-1 overflow-hidden" }, { children: [_jsx(Text, Object.assign({ type: "body-primary", className: "w-full overflow-hidden text-ellipsis whitespace-nowrap" }, { children: name })), _jsx(Text, Object.assign({ type: "body-secondary", className: "h-4" }, { children: `${amount} item${amount !== 1 ? "s" : ""}` }))] }))] })));
 });
 Wishlist.displayName = "Wishlist";
-export { Wishlist };
+export { Wishlist, PlaceholderIcon };

package/dist/index.d.ts

@@ -30,7 +30,9 @@ export * from "./components/ui/price";
 export * from "./components/ui/favorite";
 export * from "./components/ui/wishlist";
 export * from "./components/ui/product-card";
+export * from "./components/ui/dropdown";
 export * from "./components/ui/product-grid";
 export * from "./components/hooks/use-infinite-scroll";
+export * from "./components/hooks/use-scroll-direction";
 export { cn, cva } from "./lib/utils";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AACA,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,2BAA2B,CAAA;AACzC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,2BAA2B,CAAA;AACzC,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA;AACrC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,wBAAwB,CAAA;AACtC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AACpC,cAAc,2BAA2B,CAAA;AACzC,cAAc,wBAAwB,CAAA;AACtC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA;AACrC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wCAAwC,CAAA;AACtD,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,MAAM,aAAa,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AACA,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,2BAA2B,CAAA;AACzC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,2BAA2B,CAAA;AACzC,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA;AACrC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,wBAAwB,CAAA;AACtC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AACpC,cAAc,2BAA2B,CAAA;AACzC,cAAc,wBAAwB,CAAA;AACtC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA;AACrC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,0BAA0B,CAAA;AACxC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wCAAwC,CAAA;AACtD,cAAc,yCAAyC,CAAA;AACvD,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,MAAM,aAAa,CAAA"}

package/dist/index.js

@@ -31,6 +31,8 @@ export * from "./components/ui/price";
 export * from "./components/ui/favorite";
 export * from "./components/ui/wishlist";
 export * from "./components/ui/product-card";
+export * from "./components/ui/dropdown";
 export * from "./components/ui/product-grid";
 export * from "./components/hooks/use-infinite-scroll";
+export * from "./components/hooks/use-scroll-direction";
 export { cn, cva } from "./lib/utils";

package/dist/styles.css

@@ -1,5 +1,5 @@
 /*
-! tailwindcss v3.3.5 | MIT License | https://tailwindcss.com
+! tailwindcss v3.4.4 | MIT License | https://tailwindcss.com
 *//*
 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
@@ -26,17 +26,20 @@
 4. Use the user's configured `sans` font-family by default.
 5. Use the user's configured `sans` font-feature-settings by default.
 6. Use the user's configured `sans` font-variation-settings by default.
+7. Disable tap highlights on iOS
 */
 
-html {
+html,
+:host {
   line-height: 1.5; /* 1 */
   -webkit-text-size-adjust: 100%; /* 2 */
   -moz-tab-size: 4; /* 3 */
   -o-tab-size: 4;
      tab-size: 4; /* 3 */
-  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
+  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
   font-feature-settings: normal; /* 5 */
   font-variation-settings: normal; /* 6 */
+  -webkit-tap-highlight-color: transparent; /* 7 */
 }
 
 /*
@@ -103,8 +106,10 @@ strong {
 }
 
 /*
-1. Use the user's configured `mono` font family by default.
-2. Correct the odd `em` font sizing in all browsers.
+1. Use the user's configured `mono` font-family by default.
+2. Use the user's configured `mono` font-feature-settings by default.
+3. Use the user's configured `mono` font-variation-settings by default.
+4. Correct the odd `em` font sizing in all browsers.
 */
 
 code,
@@ -112,7 +117,9 @@ kbd,
 samp,
 pre {
   font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
-  font-size: 1em; /* 2 */
+  font-feature-settings: normal; /* 2 */
+  font-variation-settings: normal; /* 3 */
+  font-size: 1em; /* 4 */
 }
 
 /*
@@ -172,6 +179,7 @@ textarea {
   font-size: 100%; /* 1 */
   font-weight: inherit; /* 1 */
   line-height: inherit; /* 1 */
+  letter-spacing: inherit; /* 1 */
   color: inherit; /* 1 */
   margin: 0; /* 2 */
   padding: 0; /* 3 */
@@ -192,9 +200,9 @@ select {
 */
 
 button,
-[type='button'],
-[type='reset'],
-[type='submit'] {
+input:where([type='button']),
+input:where([type='reset']),
+input:where([type='submit']) {
   -webkit-appearance: button; /* 1 */
   background-color: transparent; /* 2 */
   background-image: none; /* 2 */
@@ -425,7 +433,9 @@ video {
 
     --radius: 0.5rem;
 
-    --coreFonts-sfpro-roboto: "-apple-system", "Roboto", "sans-serif";
+    --fontRegular: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
+    --fontMedium: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
+    --fontBold: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
 
     --coreColors-pageColor: #ffffff;
     --coreColors-shadow: #000000;
@@ -555,6 +565,10 @@ video {
   --tw-backdrop-opacity:  ;
   --tw-backdrop-saturate:  ;
   --tw-backdrop-sepia:  ;
+  --tw-contain-size:  ;
+  --tw-contain-layout:  ;
+  --tw-contain-paint:  ;
+  --tw-contain-style:  ;
 }
 
 ::backdrop {
@@ -605,6 +619,10 @@ video {
   --tw-backdrop-opacity:  ;
   --tw-backdrop-saturate:  ;
   --tw-backdrop-sepia:  ;
+  --tw-contain-size:  ;
+  --tw-contain-layout:  ;
+  --tw-contain-paint:  ;
+  --tw-contain-style:  ;
 }
 .container {
   width: 100%;
@@ -667,6 +685,9 @@ video {
 .bottom-0 {
   bottom: 0px;
 }
+.bottom-10 {
+  bottom: 2.5rem;
+}
 .end-4 {
   inset-inline-end: 1rem;
 }
@@ -676,6 +697,9 @@ video {
 .left-1\/2 {
   left: 50%;
 }
+.left-2 {
+  left: 0.5rem;
+}
 .left-\[50\%\] {
   left: 50%;
 }
@@ -694,6 +718,9 @@ video {
 .top-1\/2 {
   top: 50%;
 }
+.top-10 {
+  top: 2.5rem;
+}
 .top-2 {
   top: 0.5rem;
 }
@@ -752,6 +779,9 @@ video {
 .mr-2 {
   margin-right: 0.5rem;
 }
+.mt-1 {
+  margin-top: 0.25rem;
+}
 .mt-2 {
   margin-top: 0.5rem;
 }
@@ -782,6 +812,9 @@ video {
 .aspect-\[2\/3\] {
   aspect-ratio: 2/3;
 }
+.aspect-\[4\/5\] {
+  aspect-ratio: 4/5;
+}
 .aspect-square {
   aspect-ratio: 1 / 1;
 }
@@ -836,6 +869,9 @@ video {
 .h-full {
   height: 100%;
 }
+.max-h-\[240px\] {
+  max-height: 240px;
+}
 .max-h-screen {
   max-height: 100vh;
 }
@@ -860,9 +896,6 @@ video {
 .w-2\.5 {
   width: 0.625rem;
 }
-.w-3\/4 {
-  width: 75%;
-}
 .w-4 {
   width: 1rem;
 }
@@ -894,6 +927,9 @@ video {
 .min-w-0 {
   min-width: 0px;
 }
+.min-w-\[8rem\] {
+  min-width: 8rem;
+}
 .max-w-lg {
   max-width: 32rem;
 }
@@ -953,6 +989,9 @@ video {
 .animate-spin {
   animation: spin 1s linear infinite;
 }
+.cursor-default {
+  cursor: default;
+}
 .cursor-pointer {
   cursor: pointer;
 }
@@ -1000,12 +1039,21 @@ video {
 .items-center {
   align-items: center;
 }
+.justify-start {
+  justify-content: flex-start;
+}
+.justify-end {
+  justify-content: flex-end;
+}
 .justify-center {
   justify-content: center;
 }
 .justify-between {
   justify-content: space-between;
 }
+.gap-0 {
+  gap: 0px;
+}
 .gap-1 {
   gap: 0.25rem;
 }
@@ -1019,8 +1067,8 @@ video {
   -moz-column-gap: 7px;
        column-gap: 7px;
 }
-.gap-y-\[7px\] {
-  row-gap: 7px;
+.gap-y-4 {
+  row-gap: 1rem;
 }
 .space-y-1 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-y-reverse: 0;
@@ -1044,6 +1092,9 @@ video {
 .overflow-x-auto {
   overflow-x: auto;
 }
+.overflow-y-auto {
+  overflow-y: auto;
+}
 .overscroll-y-none {
   overscroll-behavior-y: none;
 }
@@ -1058,6 +1109,9 @@ video {
 .whitespace-nowrap {
   white-space: nowrap;
 }
+.text-wrap {
+  text-wrap: wrap;
+}
 .rounded {
   border-radius: 0.25rem;
 }
@@ -1070,9 +1124,6 @@ video {
 .rounded-full {
   border-radius: 9999px;
 }
-.rounded-lg {
-  border-radius: var(--radius);
-}
 .rounded-md {
   border-radius: calc(var(--radius) - 2px);
 }
@@ -1086,18 +1137,10 @@ video {
   border-bottom-right-radius: var(--radius);
   border-bottom-left-radius: var(--radius);
 }
-.rounded-b-none {
-  border-bottom-right-radius: 0px;
-  border-bottom-left-radius: 0px;
-}
 .rounded-t-2xl {
   border-top-left-radius: 1rem;
   border-top-right-radius: 1rem;
 }
-.rounded-t-lg {
-  border-top-left-radius: var(--radius);
-  border-top-right-radius: var(--radius);
-}
 .rounded-bl {
   border-bottom-left-radius: 0.25rem;
 }
@@ -1185,9 +1228,16 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(245 245 245 / var(--tw-bg-opacity));
 }
+.bg-neutral-300 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(212 212 212 / var(--tw-bg-opacity));
+}
 .bg-productBadging-fill {
   background-color: var(--productBadging-fill);
 }
+.bg-stateColors-disabled {
+  background-color: var(--stateColors-disabled);
+}
 .bg-stateColors-error {
   background-color: var(--stateColors-error);
 }
@@ -1311,6 +1361,9 @@ video {
 .pl-4 {
   padding-left: 1rem;
 }
+.pl-8 {
+  padding-left: 2rem;
+}
 .pr-4 {
   padding-right: 1rem;
 }
@@ -1326,11 +1379,23 @@ video {
 .pt-5 {
   padding-top: 1.25rem;
 }
+.text-left {
+  text-align: left;
+}
 .text-center {
   text-align: center;
 }
-.font-sfpro-roboto {
-  font-family: var(--coreFonts-sfpro-roboto);
+.text-right {
+  text-align: right;
+}
+.text-start {
+  text-align: start;
+}
+.font-fontMedium {
+  font-family: var(--fontMedium);
+}
+.font-fontRegular {
+  font-family: var(--fontRegular);
 }
 .text-\[10px\] {
   font-size: 10px;
@@ -1368,6 +1433,9 @@ video {
 .font-semibold {
   font-weight: 600;
 }
+.uppercase {
+  text-transform: uppercase;
+}
 .leading-\[130\%\] {
   line-height: 130%;
 }
@@ -1554,9 +1622,16 @@ video {
   --tw-shadow-color: var(--buttonColors-secondaryShadow);
   --tw-shadow: var(--tw-shadow-colored);
 }
+.outline-none {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
 .outline {
   outline-style: solid;
 }
+.outline-0 {
+  outline-width: 0px;
+}
 .outline-1 {
   outline-width: 1px;
 }
@@ -1575,6 +1650,9 @@ video {
 .outline-input {
   outline-color: hsl(var(--input));
 }
+.outline-stateColors-error {
+  outline-color: var(--stateColors-error);
+}
 .ring-0 {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
@@ -1706,6 +1784,9 @@ video {
 .focus\:border-stateColors-error:focus {
   border-color: var(--stateColors-error);
 }
+.focus\:bg-stateColors-skeleton:focus {
+  background-color: var(--stateColors-skeleton);
+}
 .focus\:opacity-100:focus {
   opacity: 1;
 }
@@ -1747,6 +1828,9 @@ video {
 .focus-visible\:ring-offset-background:focus-visible {
   --tw-ring-offset-color: hsl(var(--background));
 }
+.active\:text-coreColors-brandColorPrimary:active {
+  color: var(--coreColors-brandColorPrimary);
+}
 .active\:opacity-70:active {
   opacity: 0.7;
 }
@@ -1783,6 +1867,9 @@ video {
 .group:hover .group-hover\:opacity-100 {
   opacity: 1;
 }
+.group:active .group-active\:text-coreColors-brandColorPrimary {
+  color: var(--coreColors-brandColorPrimary);
+}
 .group:disabled .group-disabled\:text-stateColors-disabled {
   color: var(--stateColors-disabled);
 }
@@ -1828,6 +1915,9 @@ video {
 .peer:disabled ~ .peer-disabled\:opacity-70 {
   opacity: 0.7;
 }
+.data-\[disabled\]\:pointer-events-none[data-disabled] {
+  pointer-events: none;
+}
 .data-\[state\=checked\]\:translate-x-5[data-state=checked] {
   --tw-translate-x: 1.25rem;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1892,6 +1982,9 @@ video {
 .data-\[state\=on\]\:text-accent-foreground[data-state=on] {
   color: hsl(var(--accent-foreground));
 }
+.data-\[disabled\]\:opacity-50[data-disabled] {
+  opacity: 0.5;
+}
 .data-\[swipe\=move\]\:transition-none[data-swipe=move] {
   transition-property: none;
 }
@@ -1937,6 +2030,18 @@ video {
 .data-\[state\=open\]\:zoom-in-95[data-state=open] {
   --tw-enter-scale: .95;
 }
+.data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom] {
+  --tw-enter-translate-y: -0.5rem;
+}
+.data-\[side\=left\]\:slide-in-from-right-2[data-side=left] {
+  --tw-enter-translate-x: 0.5rem;
+}
+.data-\[side\=right\]\:slide-in-from-left-2[data-side=right] {
+  --tw-enter-translate-x: -0.5rem;
+}
+.data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top] {
+  --tw-enter-translate-y: 0.5rem;
+}
 .data-\[state\=closed\]\:slide-out-to-left-1\/2[data-state=closed] {
   --tw-exit-translate-x: -50%;
 }
@@ -1958,7 +2063,7 @@ video {
 .data-\[state\=open\]\:duration-500[data-state=open] {
   animation-duration: 500ms;
 }
-:is(.dark .dark\:bg-neutral-900) {
+.dark\:bg-neutral-900:is(.dark *) {
   --tw-bg-opacity: 1;
   background-color: rgb(23 23 23 / var(--tw-bg-opacity));
 }
@@ -2030,6 +2135,19 @@ video {
 .hover\:\[\&\>p\]\:text-accent-foreground>p:hover {
   color: hsl(var(--accent-foreground));
 }
+.\[\&\[data-state\=open\]\]\:outline-coreColors-brandColorPrimary[data-state=open] {
+  outline-color: var(--coreColors-brandColorPrimary);
+}
+.\[\&\[data-state\=open\]_\.chevron-icon\]\:rotate-180[data-state=open] .chevron-icon {
+  --tw-rotate: 180deg;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.\[\&\[data-state\=open\]_\.label\]\:text-coreColors-brandColorPrimary[data-state=open] .label {
+  color: var(--coreColors-brandColorPrimary);
+}
+.\[\&\[data-state\=open\]_\.label\]\:text-textColors-secondaryColor[data-state=open] .label {
+  color: var(--textColors-secondaryColor, #727272ff);
+}
 .\[\&\[data-state\=open\]_svg\]\:rotate-180[data-state=open] svg {
   --tw-rotate: 180deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tapcart/mobile-components",
-  "version": "0.2.10",
+  "version": "0.2.12",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "style": "dist/styles.css",