@tapcart/mobile-components 0.7.41 → 0.7.42

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.
Files changed (76) hide show
  1. package/dist/components/hooks/use-debug-dependencies.d.ts +10 -0
  2. package/dist/components/hooks/use-debug-dependencies.d.ts.map +1 -0
  3. package/dist/components/hooks/use-debug-dependencies.js +18 -0
  4. package/dist/components/hooks/use-layout.d.ts +13 -0
  5. package/dist/components/hooks/use-layout.d.ts.map +1 -0
  6. package/dist/components/hooks/use-layout.js +23 -0
  7. package/dist/components/hooks/use-nosto-recommendation.queries.d.ts.map +1 -1
  8. package/dist/components/hooks/use-product-options.d.ts.map +1 -1
  9. package/dist/components/hooks/use-recommendations.d.ts +1 -1
  10. package/dist/components/hooks/use-recommendations.d.ts.map +1 -1
  11. package/dist/components/hooks/use-recommendations.js +4 -4
  12. package/dist/components/hooks/use-reviews.d.ts.map +1 -1
  13. package/dist/components/hooks/use-reviews.js +45 -42
  14. package/dist/components/libs/sort-filter/custom-search.d.ts.map +1 -1
  15. package/dist/components/libs/sort-filter/custom-search.js +1 -1
  16. package/dist/components/libs/sort-filter/kmp.d.ts.map +1 -1
  17. package/dist/components/libs/sort-filter/search-integration.d.ts.map +1 -1
  18. package/dist/components/libs/sort-filter/search-integration.js +2 -1
  19. package/dist/components/libs/sort-filter/shopify-search-and-discovery.d.ts.map +1 -1
  20. package/dist/components/ui/Input/index.d.ts +1 -1
  21. package/dist/components/ui/Input/index.d.ts.map +1 -1
  22. package/dist/components/ui/Input/index.js +1 -1
  23. package/dist/components/ui/Input/input.d.ts.map +1 -1
  24. package/dist/components/ui/Input/input.js +15 -5
  25. package/dist/components/ui/Input/types.d.ts +3 -1
  26. package/dist/components/ui/Input/types.d.ts.map +1 -1
  27. package/dist/components/ui/Input/useInput.d.ts +11 -1
  28. package/dist/components/ui/Input/useInput.d.ts.map +1 -1
  29. package/dist/components/ui/Input/useInput.js +6 -2
  30. package/dist/components/ui/accordion.d.ts.map +1 -1
  31. package/dist/components/ui/badge.d.ts.map +1 -1
  32. package/dist/components/ui/badge.js +3 -1
  33. package/dist/components/ui/button.d.ts +0 -12
  34. package/dist/components/ui/button.d.ts.map +1 -1
  35. package/dist/components/ui/chip.d.ts +1 -0
  36. package/dist/components/ui/chip.d.ts.map +1 -1
  37. package/dist/components/ui/chip.js +2 -2
  38. package/dist/components/ui/drawer.js +2 -1
  39. package/dist/components/ui/grid.js +1 -1
  40. package/dist/components/ui/image.d.ts.map +1 -1
  41. package/dist/components/ui/image.js +3 -1
  42. package/dist/components/ui/line-item-text-icons.d.ts.map +1 -1
  43. package/dist/components/ui/money.d.ts.map +1 -1
  44. package/dist/components/ui/money.js +2 -2
  45. package/dist/components/ui/price.d.ts +2 -2
  46. package/dist/components/ui/price.d.ts.map +1 -1
  47. package/dist/components/ui/price.js +6 -4
  48. package/dist/components/ui/product-card.d.ts.map +1 -1
  49. package/dist/components/ui/product-card.js +9 -5
  50. package/dist/components/ui/radio-group.d.ts.map +1 -1
  51. package/dist/components/ui/star-rating.d.ts.map +1 -1
  52. package/dist/components/ui/star-rating.js +1 -1
  53. package/dist/components/ui/tabs.d.ts +3 -0
  54. package/dist/components/ui/tabs.d.ts.map +1 -1
  55. package/dist/components/ui/tabs.js +4 -7
  56. package/dist/components/ui/toaster.d.ts.map +1 -1
  57. package/dist/components/ui/toaster.js +1 -1
  58. package/dist/components/ui/use-toast.d.ts +1 -0
  59. package/dist/components/ui/use-toast.d.ts.map +1 -1
  60. package/dist/index.d.ts +1 -1
  61. package/dist/index.d.ts.map +1 -1
  62. package/dist/index.js +1 -1
  63. package/dist/lib/utils.d.ts +22 -14
  64. package/dist/lib/utils.d.ts.map +1 -1
  65. package/dist/lib/utils.js +43 -11
  66. package/dist/styles.css +13 -3
  67. package/package.json +3 -2
  68. package/dist/components/hooks/use-customer.d.ts +0 -10
  69. package/dist/components/hooks/use-customer.d.ts.map +0 -1
  70. package/dist/components/hooks/use-customer.js +0 -24
  71. package/dist/components/hooks/use-tap.d.ts +0 -8
  72. package/dist/components/hooks/use-tap.d.ts.map +0 -1
  73. package/dist/components/hooks/use-tap.js +0 -100
  74. package/dist/components/ui/apple-pay-button.d.ts +0 -24
  75. package/dist/components/ui/apple-pay-button.d.ts.map +0 -1
  76. package/dist/components/ui/apple-pay-button.js +0 -122
@@ -1,24 +0,0 @@
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
- };
@@ -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 };
@@ -1,24 +0,0 @@
1
- /// <reference types="applepayjs" />
2
- import * as React from "react";
3
- export type ApplePayButtonType = 'plain' | 'add-money' | 'book' | 'buy' | 'check-out' | 'continue' | 'contribute' | 'donate' | 'order' | 'pay' | 'reload' | 'rent' | 'set-up' | 'subscribe' | 'support' | 'tip' | 'top-up';
4
- export type ApplePayButtonStyle = 'black' | 'white' | 'white-outline';
5
- export interface ApplePayButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
6
- displayName: string;
7
- amount: number;
8
- startSessionURL: string;
9
- appId: string;
10
- domainName: string;
11
- countryCode?: string;
12
- currencyCode?: string;
13
- merchantCapabilities?: ApplePayJS.ApplePayMerchantCapability[];
14
- supportedNetworks?: string[];
15
- buttonType?: ApplePayButtonType;
16
- buttonStyle?: ApplePayButtonStyle;
17
- onPaymentAuthorized?: (paymentData: ApplePayJS.ApplePayPayment) => void;
18
- }
19
- declare const ApplePayButton: {
20
- ({ displayName, amount, startSessionURL, appId, domainName, countryCode, currencyCode, merchantCapabilities, supportedNetworks, buttonType, buttonStyle, onPaymentAuthorized, }: ApplePayButtonProps): import("react/jsx-runtime").JSX.Element;
21
- displayName: string;
22
- };
23
- export { ApplePayButton };
24
- //# sourceMappingURL=apple-pay-button.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"apple-pay-button.d.ts","sourceRoot":"","sources":["../../../components/ui/apple-pay-button.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,WAAW,GAAG,MAAM,GAAG,KAAK,GAAG,WAAW,GAAG,UAAU,GAAG,YAAY,GAAG,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,GAAG,WAAW,GAAG,SAAS,GAAG,KAAK,GAAG,QAAQ,CAAC;AAE3N,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,OAAO,GAAG,eAAe,CAAA;AAErE,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,eAAe,EAAE,MAAM,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oBAAoB,CAAC,EAAE,UAAU,CAAC,0BAA0B,EAAE,CAAC;IAC/D,iBAAiB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC7B,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,UAAU,CAAC,eAAe,KAAK,IAAI,CAAC;CACzE;AAED,QAAA,MAAM,cAAc;qLAcf,mBAAmB;;CA2IvB,CAAA;AAID,OAAO,EAAE,cAAc,EAAE,CAAA"}
@@ -1,122 +0,0 @@
1
- "use client";
2
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
3
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
4
- return new (P || (P = Promise))(function (resolve, reject) {
5
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
6
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
7
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
8
- step((generator = generator.apply(thisArg, _arguments || [])).next());
9
- });
10
- };
11
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
12
- import * as React from "react";
13
- import ApplePayButtonComponent from 'apple-pay-button';
14
- const ApplePayButton = ({ displayName, amount, startSessionURL, appId, domainName, countryCode = 'US', currencyCode = 'USD', merchantCapabilities = ["supports3DS"], supportedNetworks = ["visa", "masterCard", "amex", "discover"], buttonType = 'plain', buttonStyle = 'white-outline', onPaymentAuthorized, }) => {
15
- const [paymentDataResult, setPaymentDataResult] = React.useState("");
16
- const onClick = () => {
17
- const applePayRequest = {
18
- countryCode,
19
- currencyCode,
20
- merchantCapabilities,
21
- supportedNetworks,
22
- total: {
23
- label: displayName,
24
- type: "final",
25
- amount: amount.toString(),
26
- }
27
- };
28
- const session = new ApplePaySession(3, applePayRequest);
29
- handleEventsForApplePay(session);
30
- session.begin();
31
- };
32
- const defaultFetcher = (url, body) => fetch(url, {
33
- method: body ? "POST" : "GET",
34
- headers: {
35
- "Content-Type": "application/json",
36
- },
37
- body: body ? JSON.stringify(body) : undefined,
38
- }).then((res) => res.json());
39
- const validateMerchant = (validationURL, appId, domainName, displayName) => __awaiter(void 0, void 0, void 0, function* () {
40
- let url = startSessionURL;
41
- let body = {
42
- validationURL,
43
- appId,
44
- domainName,
45
- displayName
46
- };
47
- console.log("request body", body);
48
- const response = yield defaultFetcher(url, body);
49
- return response.data;
50
- });
51
- const handleEventsForApplePay = (session) => {
52
- session.onvalidatemerchant = (event) => __awaiter(void 0, void 0, void 0, function* () {
53
- const response = yield validateMerchant(event.validationURL, appId, domainName, displayName);
54
- if (response) {
55
- session.completeMerchantValidation(response);
56
- }
57
- else {
58
- console.error("Error during validating merchant");
59
- }
60
- });
61
- session.onpaymentmethodselected = (event) => {
62
- const update = {
63
- newTotal: {
64
- label: displayName,
65
- type: "final",
66
- amount: amount.toString(),
67
- }
68
- };
69
- session.completePaymentMethodSelection(update);
70
- };
71
- session.onshippingmethodselected = (event) => {
72
- const update = {
73
- newTotal: {
74
- label: displayName,
75
- type: "final",
76
- amount: amount.toString(),
77
- }
78
- };
79
- session.completeShippingMethodSelection(update);
80
- };
81
- session.onshippingcontactselected = (event) => {
82
- const update = {
83
- newTotal: {
84
- label: displayName,
85
- type: "final",
86
- amount: amount.toString(),
87
- }
88
- };
89
- session.completeShippingContactSelection(update);
90
- };
91
- session.onpaymentauthorized = (event) => __awaiter(void 0, void 0, void 0, function* () {
92
- const paymentData = event.payment;
93
- if (onPaymentAuthorized) { // Call the callback if provided
94
- onPaymentAuthorized(paymentData);
95
- }
96
- if (paymentData.token) {
97
- const paymentDataJson = JSON.stringify(paymentData.token, null, 2);
98
- console.log("paymentData", paymentDataJson);
99
- setPaymentDataResult(paymentDataJson);
100
- const result = {
101
- status: ApplePaySession.STATUS_SUCCESS,
102
- };
103
- session.completePayment(result);
104
- }
105
- else {
106
- const result = {
107
- status: ApplePaySession.STATUS_FAILURE,
108
- };
109
- session.completePayment(result);
110
- }
111
- });
112
- session.oncancel = (event) => {
113
- console.log("Session Cancelled.");
114
- };
115
- };
116
- return (_jsxs("div", { children: [_jsx("div", Object.assign({ className: "flex flex-row justify-center items-center pt-40" }, { children: _jsx(ApplePayButtonComponent, { onClick: onClick, style: {
117
- height: "48px",
118
- borderRadius: '4px',
119
- }, type: buttonType, buttonStyle: buttonStyle }) })), _jsx("div", Object.assign({ className: "w-100 overflow-auto" }, { children: _jsx("pre", Object.assign({ className: "whitespace-pre-wrap break-words" }, { children: paymentDataResult })) }))] }));
120
- };
121
- ApplePayButton.displayName = "ApplePayButton";
122
- export { ApplePayButton };