@tapcart/mobile-components 0.7.15 → 0.7.16
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-customer.d.ts +10 -0
- package/dist/components/hooks/use-customer.d.ts.map +1 -0
- package/dist/components/hooks/use-customer.js +24 -0
- package/dist/components/ui/badge.d.ts +1 -1
- package/dist/components/ui/badge.d.ts.map +1 -1
- package/dist/components/ui/badge.js +1 -1
- package/dist/components/ui/image.d.ts.map +1 -1
- package/dist/components/ui/image.js +2 -1
- package/package.json +18 -18
- package/dist/components/hooks/use-click-outside.d.ts +0 -3
- package/dist/components/hooks/use-click-outside.d.ts.map +0 -1
- package/dist/components/hooks/use-click-outside.js +0 -16
- package/dist/components/hooks/use-outside-click.d.ts +0 -4
- package/dist/components/hooks/use-outside-click.d.ts.map +0 -1
- package/dist/components/hooks/use-outside-click.js +0 -16
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
type Customer = {
|
|
2
|
+
isAuthenticated: boolean;
|
|
3
|
+
};
|
|
4
|
+
type UseCustomerProps = {};
|
|
5
|
+
type UseCustomerReturn = {
|
|
6
|
+
customer: Customer;
|
|
7
|
+
};
|
|
8
|
+
export declare const useCustomer: (props: UseCustomerProps | null) => UseCustomerReturn;
|
|
9
|
+
export {};
|
|
10
|
+
//# sourceMappingURL=use-customer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-customer.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-customer.ts"],"names":[],"mappings":"AAWA,KAAK,QAAQ,GAAG;IACd,eAAe,EAAE,OAAO,CAAA;CACzB,CAAA;AAGD,KAAK,gBAAgB,GAAG,EAAE,CAAA;AAE1B,KAAK,iBAAiB,GAAG;IACvB,QAAQ,EAAE,QAAQ,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,WAAW,UACf,gBAAgB,GAAG,IAAI,KAC7B,iBAuBF,CAAA"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { useState, useEffect } from "react";
|
|
3
|
+
// @ts-ignore -- webbridge-react is not typed (yet)
|
|
4
|
+
import { useActions } from "@tapcart/webbridge-react";
|
|
5
|
+
export const useCustomer = (props) => {
|
|
6
|
+
const [isAuthenticated, setIsAuthenticated] = useState(false);
|
|
7
|
+
const [customer, setCustomer] = useState({});
|
|
8
|
+
const actions = useActions();
|
|
9
|
+
// verify customer
|
|
10
|
+
useEffect(() => {
|
|
11
|
+
try {
|
|
12
|
+
// webbridge method to get customerIdentity
|
|
13
|
+
actions.getCustomerIdentity(null, {
|
|
14
|
+
onSuccess: (user) => setIsAuthenticated(!!(user === null || user === void 0 ? void 0 : user.email)),
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
catch (e) {
|
|
18
|
+
console.log("unable to get customer identity ", e);
|
|
19
|
+
}
|
|
20
|
+
}, [actions]);
|
|
21
|
+
return {
|
|
22
|
+
customer: Object.assign({ isAuthenticated }, customer),
|
|
23
|
+
};
|
|
24
|
+
};
|
|
@@ -5,7 +5,7 @@ declare const badgeVariants: (props?: ({
|
|
|
5
5
|
cornerRadius?: "circle" | "square" | "rounded" | null | undefined;
|
|
6
6
|
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
7
7
|
export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
|
|
8
|
-
size: "plp-layout" | "carousels";
|
|
8
|
+
size: "plp-layout" | "carousels" | "plp-layout-small";
|
|
9
9
|
icon?: string | null;
|
|
10
10
|
iconUrl?: string | null;
|
|
11
11
|
type?: "icon-and-text" | "icon-only" | "text-only";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../components/ui/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAMjE,QAAA,MAAM,aAAa;;;mFAoDlB,CAAA;AAED,MAAM,WAAW,UACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC,IAAI,EAAE,YAAY,GAAG,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../components/ui/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAMjE,QAAA,MAAM,aAAa;;;mFAoDlB,CAAA;AAED,MAAM,WAAW,UACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC,IAAI,EAAE,YAAY,GAAG,WAAW,GAAG,kBAAkB,CAAA;IACrD,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACvB,IAAI,CAAC,EAAE,eAAe,GAAG,WAAW,GAAG,WAAW,CAAA;IAClD,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC1B;AAED,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,IAAI,EACJ,OAAO,EACP,SAAS,EACT,YAAwB,EACxB,IAAsB,EACtB,IAAmB,EACnB,eAAe,EACf,SAAS,EACT,GAAG,KAAK,EACT,EAAE,UAAU,2CA2CZ;AAED,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}
|
|
@@ -68,6 +68,6 @@ function Badge(_a) {
|
|
|
68
68
|
var { className, icon, iconUrl, alignment, cornerRadius = "rounded", type = "icon-and-text", size = "plp-layout", backgroundColor, fontColor } = _a, props = __rest(_a, ["className", "icon", "iconUrl", "alignment", "cornerRadius", "type", "size", "backgroundColor", "fontColor"]);
|
|
69
69
|
const backgroundColorOverride = backgroundColor ? { backgroundColor } : {};
|
|
70
70
|
const BadgeText = () => (_jsx(Text, Object.assign({ type: size === "plp-layout" ? "body-primary" : "body-secondary", className: "text-productBadging-text", fontColor: fontColor }, { children: props.children })));
|
|
71
|
-
return (_jsx("div", Object.assign({ className: cn(badgeVariants({ alignment, cornerRadius }), className), style: backgroundColorOverride }, props, { children: type === "icon-and-text" ? (_jsxs(_Fragment, { children: [(icon || iconUrl) && (_jsx(Icon, { name: icon, url: iconUrl, style: fontColor ? { color: fontColor } : {}, size: size === "carousels" ? "xs" : "sm" })), _jsx(BadgeText, {})] })) : type === "icon-only" && icon ? (_jsx(Icon, { name: icon, url: iconUrl, style: fontColor ? { color: fontColor } : {}, size: size === "carousels" ? "xs" : "sm" })) : (_jsx(BadgeText, {})) })));
|
|
71
|
+
return (_jsx("div", Object.assign({ className: cn(badgeVariants({ alignment, cornerRadius }), className), style: backgroundColorOverride }, props, { children: type === "icon-and-text" ? (_jsxs(_Fragment, { children: [(icon || iconUrl) && (_jsx(Icon, { name: icon, url: iconUrl, style: fontColor ? { color: fontColor } : {}, size: size === "carousels" || size === "plp-layout-small" ? "xs" : "sm" })), _jsx(BadgeText, {})] })) : type === "icon-only" && icon ? (_jsx(Icon, { name: icon, url: iconUrl, style: fontColor ? { color: fontColor } : {}, size: size === "carousels" || size === "plp-layout-small" ? "xs" : "sm" })) : (_jsx(BadgeText, {})) })));
|
|
72
72
|
}
|
|
73
73
|
export { Badge, badgeVariants };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../components/ui/image.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAC5C,OAAO,KAAK,EAAE,KAAK,IAAI,SAAS,EAAE,MAAM,kBAAkB,CAAA;
|
|
1
|
+
{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../components/ui/image.tsx"],"names":[],"mappings":"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"}
|
|
@@ -14,6 +14,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
|
|
|
14
14
|
/* eslint-disable @next/next/no-img-element */
|
|
15
15
|
import * as React from "react";
|
|
16
16
|
import ReactDOM from "react-dom";
|
|
17
|
+
import { cn } from "../../lib/utils";
|
|
17
18
|
function ImagePreload({ imgAttributes }) {
|
|
18
19
|
const opts = {
|
|
19
20
|
as: "image",
|
|
@@ -175,7 +176,7 @@ export const Image = React.forwardRef((_a, ref) => {
|
|
|
175
176
|
sizes,
|
|
176
177
|
fetchPriority: normalizedProps.fetchPriority,
|
|
177
178
|
src: normalizedProps.src || "",
|
|
178
|
-
} })), _jsx("div", Object.assign({ className: "relative bg-stateColors-skeleton
|
|
179
|
+
} })), _jsx("div", Object.assign({ className: cn("relative border-transparent", { "bg-stateColors-skeleton": (hasError || !isLoaded) }), style: Object.assign({ borderRadius: `${imageRadius}px` }, wrapperStyle) }, { children: !hasError && normalizedProps.src ? (_jsx("img", Object.assign({}, passthroughProps, { fetchPriority: normalizedProps.fetchPriority, alt: normalizedProps.alt, decoding: decoding, height: normalizedProps.height, loading: loading, srcSet: srcSet, width: normalizedProps.width, className: imgClassName, onLoad: handleImageLoad, onError: handleImageError, sizes: sizes,
|
|
179
180
|
// `src` needs to come after `sizes` and `srcSet` because React updates
|
|
180
181
|
// attributes in order. If we keep `src` the first one, Safari will
|
|
181
182
|
// immediately start to fetch `src`, before `sizes` and `srcSet` are even
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tapcart/mobile-components",
|
|
3
|
-
"version": "0.7.
|
|
3
|
+
"version": "0.7.16",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"style": "dist/styles.css",
|
|
@@ -11,6 +11,18 @@
|
|
|
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
|
+
"test": "jest",
|
|
24
|
+
"test:watch": "jest --watch"
|
|
25
|
+
},
|
|
14
26
|
"peerDependencies": {
|
|
15
27
|
"react": "^17.0.2 || ^18.0.0",
|
|
16
28
|
"react-dom": "^17.0.2 || ^18.0.0"
|
|
@@ -20,19 +32,19 @@
|
|
|
20
32
|
"@types/lodash": "4.17.5",
|
|
21
33
|
"@types/react": "^18.2.0",
|
|
22
34
|
"@types/react-dom": "^18.2.0",
|
|
35
|
+
"app-studio-types": "workspace:*",
|
|
23
36
|
"autoprefixer": "^10.4.14",
|
|
24
37
|
"chokidar-cli": "^3.0.0",
|
|
25
38
|
"concurrently": "^8.2.2",
|
|
26
39
|
"eslint": "^7.32.0",
|
|
40
|
+
"eslint-config-custom": "workspace:*",
|
|
27
41
|
"jest": "^29.7.0",
|
|
28
42
|
"postcss": "^8.4.24",
|
|
29
43
|
"tailwindcss": "^3.3.2",
|
|
30
44
|
"ts-jest": "^29.2.5",
|
|
31
45
|
"tsc-alias": "^1.8.10",
|
|
32
|
-
"
|
|
33
|
-
"
|
|
34
|
-
"tsconfig": "0.0.0",
|
|
35
|
-
"eslint-config-custom": "0.0.0"
|
|
46
|
+
"tsconfig": "workspace:*",
|
|
47
|
+
"typescript": "^4.5.2"
|
|
36
48
|
},
|
|
37
49
|
"dependencies": {
|
|
38
50
|
"@radix-ui/react-accordion": "^1.1.2",
|
|
@@ -68,17 +80,5 @@
|
|
|
68
80
|
"tailwind-merge": "^1.13.2",
|
|
69
81
|
"tailwindcss-animate": "^1.0.6",
|
|
70
82
|
"vaul": "0.9.1"
|
|
71
|
-
},
|
|
72
|
-
"scripts": {
|
|
73
|
-
"lint": "eslint \"**/*.ts*\"",
|
|
74
|
-
"ui:add": "pnpm dlx shadcn-ui@latest add",
|
|
75
|
-
"build:styles": "postcss styles/globals.css -o dist/styles.css",
|
|
76
|
-
"build:ts": "tsc -p tsconfig.json && tsc-alias",
|
|
77
|
-
"build": "pnpm run build:ts && pnpm run build:styles",
|
|
78
|
-
"dev:ts": "tsc -w -p tsconfig.json",
|
|
79
|
-
"dev:styles": "npx tailwindcss -i styles/globals.css -o dist/styles.css --watch",
|
|
80
|
-
"dev": "concurrently \"pnpm run dev:ts\" \"pnpm run dev:styles\"",
|
|
81
|
-
"test": "jest",
|
|
82
|
-
"test:watch": "jest --watch"
|
|
83
83
|
}
|
|
84
|
-
}
|
|
84
|
+
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-click-outside.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-click-outside.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,wBAAgB,eAAe,CAAC,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,QAAQ,EAAE,MAAM,IAAI,GAAE,IAAI,CAa5F"}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import React from 'react';
|
|
3
|
-
export function useClickOutside(ref, callback) {
|
|
4
|
-
React.useEffect(() => {
|
|
5
|
-
const handleClickOutside = (event) => {
|
|
6
|
-
if (ref.current && !ref.current.contains(event.target)) {
|
|
7
|
-
callback();
|
|
8
|
-
}
|
|
9
|
-
};
|
|
10
|
-
document.addEventListener('mousedown', handleClickOutside);
|
|
11
|
-
return () => {
|
|
12
|
-
document.removeEventListener('mousedown', handleClickOutside);
|
|
13
|
-
};
|
|
14
|
-
}, [ref, callback]);
|
|
15
|
-
}
|
|
16
|
-
;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-outside-click.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-outside-click.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,QAAA,MAAM,eAAe,QAAS,MAAM,SAAS,CAAC,WAAW,CAAC,YAAY,MAAM,IAAI,SAa/E,CAAC;AAEF,eAAe,eAAe,CAAC"}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import React from 'react';
|
|
3
|
-
const useClickOutside = (ref, callback) => {
|
|
4
|
-
React.useEffect(() => {
|
|
5
|
-
const handleClickOutside = (event) => {
|
|
6
|
-
if (ref.current && !ref.current.contains(event.target)) {
|
|
7
|
-
callback();
|
|
8
|
-
}
|
|
9
|
-
};
|
|
10
|
-
document.addEventListener('mousedown', handleClickOutside);
|
|
11
|
-
return () => {
|
|
12
|
-
document.removeEventListener('mousedown', handleClickOutside);
|
|
13
|
-
};
|
|
14
|
-
}, [ref, callback]);
|
|
15
|
-
};
|
|
16
|
-
export default useClickOutside;
|