@tapcart/mobile-components 0.7.83 → 0.7.85
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/hooks/use-mock-cart.js +1 -1
- package/dist/components/ui/animate-container.d.ts +14 -0
- package/dist/components/ui/animate-container.d.ts.map +1 -0
- package/dist/components/ui/animate-container.js +30 -0
- package/dist/components/ui/button.js +3 -3
- package/dist/components/ui/text.js +1 -1
- package/dist/components/ui/virtual-grid.js +2 -2
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/styles.css +34 -3
- package/package.json +2 -2
|
@@ -147,7 +147,7 @@ const transformCart = ({ products, cartOrigin = cartMock, }) => {
|
|
|
147
147
|
deliveryGroups,
|
|
148
148
|
cost });
|
|
149
149
|
};
|
|
150
|
-
export const useMockCart = ({ apiUrl, appId, enabled = true, limit =
|
|
150
|
+
export const useMockCart = ({ apiUrl, appId, enabled = true, limit = 3, }) => {
|
|
151
151
|
const { products, error: productsError, isLoading: productsLoading, } = useProducts({
|
|
152
152
|
productIds: [],
|
|
153
153
|
productHandles: [],
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
type AnimationType = "slideUp";
|
|
3
|
+
interface AnimateContainerProps {
|
|
4
|
+
show: boolean;
|
|
5
|
+
children: React.ReactNode;
|
|
6
|
+
type: AnimationType;
|
|
7
|
+
duration?: number;
|
|
8
|
+
className?: string;
|
|
9
|
+
skipInitAnimation?: boolean;
|
|
10
|
+
}
|
|
11
|
+
export declare function AnimateContainer({ show, children, type, duration, className, skipInitAnimation, }: AnimateContainerProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare function SlideUp(props: Omit<AnimateContainerProps, "type">): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export {};
|
|
14
|
+
//# sourceMappingURL=animate-container.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animate-container.d.ts","sourceRoot":"","sources":["../../../components/ui/animate-container.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAA;AAG1D,KAAK,aAAa,GAAG,SAAS,CAAA;AAgB9B,UAAU,qBAAqB;IAC7B,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,IAAI,EAAE,aAAa,CAAA;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,QAAc,EACd,SAAS,EACT,iBAAyB,GAC1B,EAAE,qBAAqB,2CAkCvB;AAED,wBAAgB,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC,qBAAqB,EAAE,MAAM,CAAC,2CAEjE"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { useState, useEffect, useRef } from "react";
|
|
4
|
+
import { cn } from "../../lib/utils";
|
|
5
|
+
const ANIMATIONS = {
|
|
6
|
+
slideUp: {
|
|
7
|
+
enter: "animate-slide-down",
|
|
8
|
+
exit: "animate-slide-up",
|
|
9
|
+
needsHeight: true,
|
|
10
|
+
},
|
|
11
|
+
};
|
|
12
|
+
export function AnimateContainer({ show, children, type, duration = 300, className, skipInitAnimation = false, }) {
|
|
13
|
+
const contentRef = useRef(null);
|
|
14
|
+
const prevHeight = useRef(0);
|
|
15
|
+
const [shouldAnimate, setShouldAnimate] = useState(!skipInitAnimation);
|
|
16
|
+
const animation = ANIMATIONS[type];
|
|
17
|
+
useEffect(() => {
|
|
18
|
+
if (contentRef.current && animation.needsHeight) {
|
|
19
|
+
contentRef.current.style.setProperty("--content-height", `${contentRef.current.scrollHeight}px`);
|
|
20
|
+
if (!skipInitAnimation || prevHeight.current !== 0) {
|
|
21
|
+
prevHeight.current = contentRef.current.scrollHeight;
|
|
22
|
+
setShouldAnimate(true);
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
}, [show, skipInitAnimation, animation.needsHeight]);
|
|
26
|
+
return (_jsx("div", Object.assign({ ref: contentRef, className: cn("overflow-hidden", shouldAnimate && (show ? animation.enter : animation.exit), className), style: { animationDuration: `${duration}ms` } }, { children: children })));
|
|
27
|
+
}
|
|
28
|
+
export function SlideUp(props) {
|
|
29
|
+
return _jsx(AnimateContainer, Object.assign({}, props, { type: "slideUp" }));
|
|
30
|
+
}
|
|
@@ -21,9 +21,9 @@ import { useMergeRefs } from "../hooks/use-merge-refs";
|
|
|
21
21
|
const buttonVariants = cva("w-full flex rounded items-center justify-center transition-colors disabled:bg-stateColors-disabled disabled:border-stateColors-disabled disabled:pointer-events-none ring-offset-background overflow-elipse whitespace-nowrap truncate disabled:opacity-70 cursor-pointer", {
|
|
22
22
|
variants: {
|
|
23
23
|
size: {
|
|
24
|
-
default: "py-2 px-3",
|
|
25
|
-
sm: "px-3 rounded-md",
|
|
26
|
-
lg: "px-8 rounded-md",
|
|
24
|
+
default: "py-2 px-3 h-10",
|
|
25
|
+
sm: "px-3 py-1 rounded-md",
|
|
26
|
+
lg: "px-8 py-3 rounded-md",
|
|
27
27
|
icon: "p-3 w-auto",
|
|
28
28
|
content: "py-2 px-4 w-auto",
|
|
29
29
|
},
|
|
@@ -53,7 +53,7 @@ const textVariants = cva("", {
|
|
|
53
53
|
type: {
|
|
54
54
|
h1: "text-[23px] leading-[120%] font-normal text-textColors-primaryColor",
|
|
55
55
|
h2: "text-lg leading-[120%] font-medium text-textColors-primaryColor",
|
|
56
|
-
"body-primary": "text-[14px]
|
|
56
|
+
"body-primary": "text-[14px] leading-[160%] font-normal text-textColors-primaryColor",
|
|
57
57
|
"body-secondary": "text-[12px] leading-[120%] font-normal text-textColors-secondaryColor",
|
|
58
58
|
label: "text-[10px] leading-[120%] font-normal text-textColors-secondaryColor",
|
|
59
59
|
},
|
|
@@ -18,8 +18,8 @@ const virtualGridVariants = cva("grid", {
|
|
|
18
18
|
},
|
|
19
19
|
});
|
|
20
20
|
function VirtualGrid({ className, columns, children, overscan = 4, estimatedHeight = 375, isLoadingMore, isReachingEnd, LoaderItem, spacing = {
|
|
21
|
-
horizontalGap:
|
|
22
|
-
verticalGap:
|
|
21
|
+
horizontalGap: 7,
|
|
22
|
+
verticalGap: 16,
|
|
23
23
|
}, style, }) {
|
|
24
24
|
const NUM_LOADER_ITEMS = columns || 2;
|
|
25
25
|
const col = columns || 2;
|
package/dist/index.d.ts
CHANGED
|
@@ -14,6 +14,7 @@ export * from "./components/hooks/use-mock-products";
|
|
|
14
14
|
export * from "./components/hooks/use-block-conditional-rendering";
|
|
15
15
|
export * from "./components/hooks/use-mock-cart";
|
|
16
16
|
export * from "./components/ui/accordion";
|
|
17
|
+
export * from "./components/ui/animate-container";
|
|
17
18
|
export * from "./components/ui/apple-pay-button";
|
|
18
19
|
export * from "./components/ui/aspect-ratio";
|
|
19
20
|
export * from "./components/ui/badge";
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -15,6 +15,7 @@ export * from "./components/hooks/use-mock-products";
|
|
|
15
15
|
export * from "./components/hooks/use-block-conditional-rendering";
|
|
16
16
|
export * from "./components/hooks/use-mock-cart";
|
|
17
17
|
export * from "./components/ui/accordion";
|
|
18
|
+
export * from "./components/ui/animate-container";
|
|
18
19
|
export * from "./components/ui/apple-pay-button";
|
|
19
20
|
export * from "./components/ui/aspect-ratio";
|
|
20
21
|
export * from "./components/ui/badge";
|
package/dist/styles.css
CHANGED
|
@@ -881,6 +881,9 @@ video {
|
|
|
881
881
|
.mt-3 {
|
|
882
882
|
margin-top: 0.75rem;
|
|
883
883
|
}
|
|
884
|
+
.mt-4 {
|
|
885
|
+
margin-top: 1rem;
|
|
886
|
+
}
|
|
884
887
|
.mt-auto {
|
|
885
888
|
margin-top: auto;
|
|
886
889
|
}
|
|
@@ -1001,9 +1004,6 @@ video {
|
|
|
1001
1004
|
.h-\[38px\] {
|
|
1002
1005
|
height: 38px;
|
|
1003
1006
|
}
|
|
1004
|
-
.h-\[40px\] {
|
|
1005
|
-
height: 40px;
|
|
1006
|
-
}
|
|
1007
1007
|
.h-\[4px\] {
|
|
1008
1008
|
height: 4px;
|
|
1009
1009
|
}
|
|
@@ -1233,6 +1233,32 @@ video {
|
|
|
1233
1233
|
.animate-pulse {
|
|
1234
1234
|
animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
|
1235
1235
|
}
|
|
1236
|
+
@keyframes slide-down {
|
|
1237
|
+
|
|
1238
|
+
from {
|
|
1239
|
+
height: 0;
|
|
1240
|
+
}
|
|
1241
|
+
|
|
1242
|
+
to {
|
|
1243
|
+
height: var(--content-height);
|
|
1244
|
+
}
|
|
1245
|
+
}
|
|
1246
|
+
.animate-slide-down {
|
|
1247
|
+
animation: slide-down 0.2s ease-out;
|
|
1248
|
+
}
|
|
1249
|
+
@keyframes slide-up {
|
|
1250
|
+
|
|
1251
|
+
from {
|
|
1252
|
+
height: var(--content-height);
|
|
1253
|
+
}
|
|
1254
|
+
|
|
1255
|
+
to {
|
|
1256
|
+
height: 0;
|
|
1257
|
+
}
|
|
1258
|
+
}
|
|
1259
|
+
.animate-slide-up {
|
|
1260
|
+
animation: slide-up 0.2s ease-out;
|
|
1261
|
+
}
|
|
1236
1262
|
@keyframes spin {
|
|
1237
1263
|
|
|
1238
1264
|
to {
|
|
@@ -2134,6 +2160,11 @@ video {
|
|
|
2134
2160
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
2135
2161
|
transition-duration: 150ms;
|
|
2136
2162
|
}
|
|
2163
|
+
.transition-\[height\] {
|
|
2164
|
+
transition-property: height;
|
|
2165
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
2166
|
+
transition-duration: 150ms;
|
|
2167
|
+
}
|
|
2137
2168
|
.transition-all {
|
|
2138
2169
|
transition-property: all;
|
|
2139
2170
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tapcart/mobile-components",
|
|
3
|
-
"version": "0.7.
|
|
3
|
+
"version": "0.7.85",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"style": "dist/styles.css",
|
|
@@ -89,7 +89,7 @@
|
|
|
89
89
|
"swr": "^2.2.5",
|
|
90
90
|
"tailwind-merge": "^1.13.2",
|
|
91
91
|
"tailwindcss-animate": "^1.0.6",
|
|
92
|
-
"vaul": "
|
|
92
|
+
"vaul": "1.1.2"
|
|
93
93
|
},
|
|
94
94
|
"publishConfig": {
|
|
95
95
|
"access": "public",
|