@tapcart/mobile-components 0.6.17 → 0.6.18
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-products.d.ts.map +1 -1
- package/dist/components/hooks/use-products.js +1 -0
- package/dist/components/ui/button.d.ts +1 -0
- package/dist/components/ui/button.d.ts.map +1 -1
- package/dist/components/ui/button.js +3 -3
- package/dist/index.d.ts +0 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +0 -1
- package/dist/styles.css +0 -3
- package/package.json +15 -15
- package/dist/components/hooks/use-tap.d.ts +0 -8
- package/dist/components/hooks/use-tap.d.ts.map +0 -1
- package/dist/components/hooks/use-tap.js +0 -100
- package/dist/tapcart-mobile-components.umd.js +0 -44
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-products.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-products.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-products.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-products.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAA;AAE1C,KAAK,GAAG,GAAG,MAAM,CAAA;AACjB,KAAK,cAAc,GAAG;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAA;AACxD,KAAK,gBAAgB,GAAG;IACtB,UAAU,EAAE,MAAM,EAAE,CAAA;IACpB,cAAc,EAAE,MAAM,EAAE,CAAA;IACxB,OAAO,EAAE,GAAG,CAAA;IACZ,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,CAAC,CAAA;IACvC,UAAU,CAAC,EAAE,cAAc,EAAE,CAAA;CAC9B,CAAA;AACD,KAAK,iBAAiB,GAAG;IACvB,QAAQ,EAAE,OAAO,EAAE,CAAA;IACnB,KAAK,EAAE,GAAG,CAAA;IACV,SAAS,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,GAAG,iBAAiB,CA8B7E"}
|
|
@@ -15,6 +15,7 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
|
|
|
15
15
|
iconColor?: string;
|
|
16
16
|
iconSize?: string;
|
|
17
17
|
iconStrokeColor?: string;
|
|
18
|
+
iconClassName?: string;
|
|
18
19
|
iconPosition?: "left" | "right";
|
|
19
20
|
}
|
|
20
21
|
declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../components/ui/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,EAGL,KAAK,EAEL,SAAS,EAET,oBAAoB,EACrB,MAAM,iBAAiB,CAAA;AAIxB,QAAA,MAAM,cAAc;;;mFAgCnB,CAAA;AAwCD,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAA;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;CAChC;AAED,QAAA,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../components/ui/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,EAGL,KAAK,EAEL,SAAS,EAET,oBAAoB,EACrB,MAAM,iBAAiB,CAAA;AAIxB,QAAA,MAAM,cAAc;;;mFAgCnB,CAAA;AAwCD,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAA;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;CAChC;AAED,QAAA,MAAM,MAAM,uFA8FX,CAAA;AAGD,QAAA,MAAM,cAAc,iBACJ,SAAS,GACrB,oBAAoB,GAAG;IACrB,SAAS,EAAE,KAAK,CAAA;IAChB,WAAW,EAAE;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,CAAA;IAC5B,gBAAgB,EAAE,OAAO,CAAA;CAC1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkBJ,CAAA;AAED,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,cAAc,EAAE,CAAA"}
|
|
@@ -16,7 +16,7 @@ import { cva } from "class-variance-authority";
|
|
|
16
16
|
import { cn, getColor, getTextStyle, getBackgroundAndPaddingStyle, } from "../../lib/utils";
|
|
17
17
|
import { Icon } from "./icon";
|
|
18
18
|
import { Text } from "./text";
|
|
19
|
-
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 active:opacity-70 disabled:opacity-70
|
|
19
|
+
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 active:opacity-70 disabled:opacity-70", {
|
|
20
20
|
variants: {
|
|
21
21
|
size: {
|
|
22
22
|
default: "py-3 px-4",
|
|
@@ -79,13 +79,13 @@ const labelVariants = cva("truncate", {
|
|
|
79
79
|
},
|
|
80
80
|
});
|
|
81
81
|
const Button = React.forwardRef((_a, ref) => {
|
|
82
|
-
var { className, labelClassName, labelStyle, variant, size, asChild = false, loading, icon, iconColor, iconStrokeColor, iconPosition, iconSize, iconUrl } = _a, props = __rest(_a, ["className", "labelClassName", "labelStyle", "variant", "size", "asChild", "loading", "icon", "iconColor", "iconStrokeColor", "iconPosition", "iconSize", "iconUrl"]);
|
|
82
|
+
var { className, labelClassName, labelStyle, variant, size, asChild = false, loading, icon, iconColor, iconStrokeColor, iconPosition, iconSize, iconUrl, iconClassName } = _a, props = __rest(_a, ["className", "labelClassName", "labelStyle", "variant", "size", "asChild", "loading", "icon", "iconColor", "iconStrokeColor", "iconPosition", "iconSize", "iconUrl", "iconClassName"]);
|
|
83
83
|
const Comp = asChild ? Slot : "button";
|
|
84
84
|
const IconButton = () => icon || iconUrl ? (_jsx(Icon, { name: icon, size: "sm", style: { color: iconColor } })) : null;
|
|
85
85
|
const BasicButton = () => (_jsxs(_Fragment, { children: [icon || iconUrl ? (_jsx(Icon, { name: iconUrl ? undefined : icon, url: iconUrl, size: iconSize || variant === "quickadd" ? "xs" : "sm", className: cn(iconVariants({ variant }), {
|
|
86
86
|
"mr-2": iconPosition === "left",
|
|
87
87
|
"ml-2": iconPosition === "right",
|
|
88
|
-
}), strokeColor: iconStrokeColor, style: { color: iconColor, stroke: iconColor, fill: iconColor } })) : null, !loading ? (_jsx(Text, Object.assign({ type: "body-primary", className: cn(labelVariants({ variant }), labelClassName), style: labelStyle }, { children: props.children }))) : (_jsx(_Fragment, {}))] }));
|
|
88
|
+
}, iconClassName), strokeColor: iconStrokeColor, style: { color: iconColor, stroke: iconColor, fill: iconColor } })) : null, !loading ? (_jsx(Text, Object.assign({ type: "body-primary", className: cn(labelVariants({ variant }), labelClassName), style: labelStyle }, { children: props.children }))) : (_jsx(_Fragment, {}))] }));
|
|
89
89
|
const LoadingButton = () => (_jsx("div", Object.assign({ className: cn("flex items-center justify-center", size === "icon" ? "h-5" : "h-6") }, { children: _jsx(Icon, { className: cn(iconVariants({ variant }), "h-5 w-5 animate-spin"), name: "loader", style: { color: iconColor } }) })));
|
|
90
90
|
return (_jsx(Comp, Object.assign({ className: cn(buttonVariants({ variant, size }), className, {
|
|
91
91
|
"pointer-events-none": loading,
|
package/dist/index.d.ts
CHANGED
|
@@ -51,5 +51,4 @@ export * from "./components/ui/wishlist-select";
|
|
|
51
51
|
export * from "./components/hooks/use-shop";
|
|
52
52
|
export * from "./components/libs/sort-filter/search-integration";
|
|
53
53
|
export * from "./components/ui/subcollection-tabs";
|
|
54
|
-
export * from "./components/hooks/use-tap";
|
|
55
54
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,EAAE,EACF,GAAG,EACH,QAAQ,EACR,4BAA4B,EAC5B,mBAAmB,EACnB,YAAY,EACZ,yBAAyB,EACzB,4BAA4B,EAC5B,YAAY,EACZ,gBAAgB,EAChB,gBAAgB,EAChB,eAAe,EACf,oBAAoB,EACpB,kBAAkB,GACnB,MAAM,aAAa,CAAA;AACpB,cAAc,mCAAmC,CAAA;AACjD,cAAc,wCAAwC,CAAA;AACtD,cAAc,wCAAwC,CAAA;AACtD,cAAc,iCAAiC,CAAA;AAC/C,cAAc,yCAAyC,CAAA;AACvD,cAAc,oCAAoC,CAAA;AAClD,cAAc,2BAA2B,CAAA;AACzC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,2BAA2B,CAAA;AACzC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA;AACrC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,uBAAuB,CAAA;AACrC,cAAc,sCAAsC,CAAA;AACpD,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,0BAA0B,CAAA;AACxC,cAAc,wBAAwB,CAAA;AACtC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,0BAA0B,CAAA;AACxC,cAAc,wCAAwC,CAAA;AACtD,cAAc,iCAAiC,CAAA;AAC/C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kDAAkD,CAAA;AAChE,cAAc,oCAAoC,CAAA
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,EAAE,EACF,GAAG,EACH,QAAQ,EACR,4BAA4B,EAC5B,mBAAmB,EACnB,YAAY,EACZ,yBAAyB,EACzB,4BAA4B,EAC5B,YAAY,EACZ,gBAAgB,EAChB,gBAAgB,EAChB,eAAe,EACf,oBAAoB,EACpB,kBAAkB,GACnB,MAAM,aAAa,CAAA;AACpB,cAAc,mCAAmC,CAAA;AACjD,cAAc,wCAAwC,CAAA;AACtD,cAAc,wCAAwC,CAAA;AACtD,cAAc,iCAAiC,CAAA;AAC/C,cAAc,yCAAyC,CAAA;AACvD,cAAc,oCAAoC,CAAA;AAClD,cAAc,2BAA2B,CAAA;AACzC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,2BAA2B,CAAA;AACzC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA;AACrC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,uBAAuB,CAAA;AACrC,cAAc,sCAAsC,CAAA;AACpD,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,0BAA0B,CAAA;AACxC,cAAc,wBAAwB,CAAA;AACtC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,0BAA0B,CAAA;AACxC,cAAc,wCAAwC,CAAA;AACtD,cAAc,iCAAiC,CAAA;AAC/C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kDAAkD,CAAA;AAChE,cAAc,oCAAoC,CAAA"}
|
package/dist/index.js
CHANGED
package/dist/styles.css
CHANGED
|
@@ -2047,9 +2047,6 @@ video {
|
|
|
2047
2047
|
.opacity-50 {
|
|
2048
2048
|
opacity: 0.5;
|
|
2049
2049
|
}
|
|
2050
|
-
.opacity-70 {
|
|
2051
|
-
opacity: 0.7;
|
|
2052
|
-
}
|
|
2053
2050
|
.shadow {
|
|
2054
2051
|
--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
|
|
2055
2052
|
--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tapcart/mobile-components",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.18",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"style": "dist/styles.css",
|
|
@@ -11,16 +11,6 @@
|
|
|
11
11
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
12
12
|
"author": "Tapcart Inc.",
|
|
13
13
|
"homepage": "https://tapcart.com",
|
|
14
|
-
"scripts": {
|
|
15
|
-
"lint": "eslint \"**/*.ts*\"",
|
|
16
|
-
"ui:add": "pnpm dlx shadcn-ui@latest add",
|
|
17
|
-
"build:styles": "postcss styles/globals.css -o dist/styles.css",
|
|
18
|
-
"build:ts": "tsc -p tsconfig.json && tsc-alias",
|
|
19
|
-
"build": "pnpm run build:ts && pnpm run build:styles",
|
|
20
|
-
"dev:ts": "tsc -w -p tsconfig.json",
|
|
21
|
-
"dev:styles": "npx tailwindcss -i styles/globals.css -o dist/styles.css --watch",
|
|
22
|
-
"dev": "concurrently \"pnpm run dev:ts\" \"pnpm run dev:styles\""
|
|
23
|
-
},
|
|
24
14
|
"peerDependencies": {
|
|
25
15
|
"react": "^17.0.2 || ^18.0.0",
|
|
26
16
|
"react-dom": "^17.0.2 || ^18.0.0"
|
|
@@ -29,17 +19,17 @@
|
|
|
29
19
|
"@types/lodash": "4.17.5",
|
|
30
20
|
"@types/react": "^18.2.0",
|
|
31
21
|
"@types/react-dom": "^18.2.0",
|
|
32
|
-
"app-studio-types": "workspace:*",
|
|
33
22
|
"autoprefixer": "^10.4.14",
|
|
34
23
|
"chokidar-cli": "^3.0.0",
|
|
35
24
|
"concurrently": "^8.2.2",
|
|
36
25
|
"eslint": "^7.32.0",
|
|
37
|
-
"eslint-config-custom": "workspace:*",
|
|
38
26
|
"postcss": "^8.4.24",
|
|
39
27
|
"tailwindcss": "^3.3.2",
|
|
40
28
|
"tsc-alias": "^1.8.10",
|
|
41
|
-
"
|
|
42
|
-
"
|
|
29
|
+
"typescript": "^4.5.2",
|
|
30
|
+
"app-studio-types": "0.0.3",
|
|
31
|
+
"tsconfig": "0.0.0",
|
|
32
|
+
"eslint-config-custom": "0.0.0"
|
|
43
33
|
},
|
|
44
34
|
"dependencies": {
|
|
45
35
|
"@radix-ui/react-accordion": "^1.1.2",
|
|
@@ -73,5 +63,15 @@
|
|
|
73
63
|
"tailwind-merge": "^1.13.2",
|
|
74
64
|
"tailwindcss-animate": "^1.0.6",
|
|
75
65
|
"vaul": "^0.9.1"
|
|
66
|
+
},
|
|
67
|
+
"scripts": {
|
|
68
|
+
"lint": "eslint \"**/*.ts*\"",
|
|
69
|
+
"ui:add": "pnpm dlx shadcn-ui@latest add",
|
|
70
|
+
"build:styles": "postcss styles/globals.css -o dist/styles.css",
|
|
71
|
+
"build:ts": "tsc -p tsconfig.json && tsc-alias",
|
|
72
|
+
"build": "pnpm run build:ts && pnpm run build:styles",
|
|
73
|
+
"dev:ts": "tsc -w -p tsconfig.json",
|
|
74
|
+
"dev:styles": "npx tailwindcss -i styles/globals.css -o dist/styles.css --watch",
|
|
75
|
+
"dev": "concurrently \"pnpm run dev:ts\" \"pnpm run dev:styles\""
|
|
76
76
|
}
|
|
77
77
|
}
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
declare const useTap: (tapThreshold?: number) => {
|
|
3
|
-
onTap: (handler: (event: any) => void) => (event: any) => void;
|
|
4
|
-
isPressed: boolean;
|
|
5
|
-
ref: React.MutableRefObject<null>;
|
|
6
|
-
};
|
|
7
|
-
export { useTap };
|
|
8
|
-
//# sourceMappingURL=use-tap.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-tap.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-tap.ts"],"names":[],"mappings":"AACA,OAAO,KAAmD,MAAM,OAAO,CAAA;AAuFvE,QAAA,MAAM,MAAM;6BAuBkC,GAAG,KAAK,IAAI,aACvC,GAAG;;;CAerB,CAAA;AAED,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { useState, useEffect, useCallback, useRef } from "react";
|
|
3
|
-
// Shared manager for all instances of the hook
|
|
4
|
-
const tapManager = (() => {
|
|
5
|
-
const elements = new Map();
|
|
6
|
-
let isListening = false;
|
|
7
|
-
const startListening = () => {
|
|
8
|
-
if (isListening)
|
|
9
|
-
return;
|
|
10
|
-
const handleTouchStart = (e) => {
|
|
11
|
-
const touch = e.touches[0];
|
|
12
|
-
elements.forEach((data, el) => {
|
|
13
|
-
if (el.contains(touch.target)) {
|
|
14
|
-
data.touchStarted = true;
|
|
15
|
-
data.touchMoved = false;
|
|
16
|
-
data.startPosition = { x: touch.clientX, y: touch.clientY };
|
|
17
|
-
// Don't set isPressed here, wait to determine if it's a tap or drag
|
|
18
|
-
}
|
|
19
|
-
});
|
|
20
|
-
};
|
|
21
|
-
const handleTouchMove = (e) => {
|
|
22
|
-
const touch = e.touches[0];
|
|
23
|
-
elements.forEach((data, el) => {
|
|
24
|
-
if (data.touchStarted) {
|
|
25
|
-
const deltaX = Math.abs(touch.clientX - data.startPosition.x);
|
|
26
|
-
const deltaY = Math.abs(touch.clientY - data.startPosition.y);
|
|
27
|
-
if (deltaX > data.tapThreshold || deltaY > data.tapThreshold) {
|
|
28
|
-
data.touchMoved = true;
|
|
29
|
-
data.setIsPressed(false);
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
});
|
|
33
|
-
};
|
|
34
|
-
const handleTouchEnd = () => {
|
|
35
|
-
elements.forEach((data) => {
|
|
36
|
-
if (data.touchStarted) {
|
|
37
|
-
data.touchStarted = false;
|
|
38
|
-
if (!data.touchMoved) {
|
|
39
|
-
// It's a tap, set isPressed briefly
|
|
40
|
-
data.setIsPressed(true);
|
|
41
|
-
setTimeout(() => data.setIsPressed(false), 100);
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
});
|
|
45
|
-
};
|
|
46
|
-
document.addEventListener("touchstart", (e) => handleTouchStart(e), { passive: true });
|
|
47
|
-
document.addEventListener("touchmove", (e) => handleTouchMove(e), { passive: true });
|
|
48
|
-
document.addEventListener("touchend", () => handleTouchEnd(), {
|
|
49
|
-
passive: true,
|
|
50
|
-
});
|
|
51
|
-
isListening = true;
|
|
52
|
-
};
|
|
53
|
-
return {
|
|
54
|
-
register: (el, data) => {
|
|
55
|
-
elements.set(el, data);
|
|
56
|
-
startListening();
|
|
57
|
-
},
|
|
58
|
-
unregister: (el) => {
|
|
59
|
-
elements.delete(el);
|
|
60
|
-
},
|
|
61
|
-
elements,
|
|
62
|
-
};
|
|
63
|
-
})();
|
|
64
|
-
const useTap = (tapThreshold = 10) => {
|
|
65
|
-
const [isPressed, setIsPressed] = useState(false);
|
|
66
|
-
const elementRef = useRef(null);
|
|
67
|
-
useEffect(() => {
|
|
68
|
-
const element = elementRef.current;
|
|
69
|
-
if (!element)
|
|
70
|
-
return;
|
|
71
|
-
const data = {
|
|
72
|
-
touchStarted: false,
|
|
73
|
-
touchMoved: false,
|
|
74
|
-
startPosition: { x: 0, y: 0 },
|
|
75
|
-
setIsPressed,
|
|
76
|
-
tapThreshold,
|
|
77
|
-
};
|
|
78
|
-
tapManager.register(element, data);
|
|
79
|
-
return () => {
|
|
80
|
-
tapManager.unregister(element);
|
|
81
|
-
};
|
|
82
|
-
}, [tapThreshold]);
|
|
83
|
-
const onTap = useCallback((handler) => {
|
|
84
|
-
return (event) => {
|
|
85
|
-
const data = tapManager.elements.get(elementRef.current);
|
|
86
|
-
if (!data)
|
|
87
|
-
return;
|
|
88
|
-
if (event.type === "touchend" && !data.touchMoved) {
|
|
89
|
-
handler(event);
|
|
90
|
-
}
|
|
91
|
-
else if (event.type === "click" && !data.touchStarted) {
|
|
92
|
-
handler(event);
|
|
93
|
-
setIsPressed(true);
|
|
94
|
-
setTimeout(() => setIsPressed(false), 100);
|
|
95
|
-
}
|
|
96
|
-
};
|
|
97
|
-
}, []);
|
|
98
|
-
return { onTap, isPressed, ref: elementRef };
|
|
99
|
-
};
|
|
100
|
-
export { useTap };
|