@tapcart/mobile-components 0.16.0 → 0.16.2

package/dist/components/hooks/use-products.d.ts.map

@@ -1 +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;AAK1C,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,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,OAAO,EAAE,GAAG,CAAA;IACZ,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACpC,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,IAAI,KAAK,OAAO,CAAC,GAAG,CAAC,CAAA;IAC1E,UAAU,CAAC,EAAE,cAAc,EAAE,CAAA;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,qBAAqB,CAAC,EAAE,OAAO,CAAA;CAChC,CAAA;AACD,KAAK,iBAAiB,GAAG;IACvB,QAAQ,EAAE,OAAO,EAAE,CAAA;IACnB,KAAK,EAAE,GAAG,CAAA;IACV,SAAS,EAAE,OAAO,CAAA;IAClB,YAAY,EAAE,OAAO,CAAA;IACrB,YAAY,EAAE,CAAC,OAAO,EAAE,OAAO,KAC3B;QACE,EAAE,EAAE,MAAM,CAAA;QACV,MAAM,EAAE,MAAM,CAAA;KACf,GACD,SAAS,CAAA;CACd,CAAA;AAqDD,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,GAAG,iBAAiB,CA0J7E"}
+{"version":3,"file":"use-products.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-products.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAA;AAK1C,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,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,OAAO,EAAE,GAAG,CAAA;IACZ,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACpC,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,IAAI,KAAK,OAAO,CAAC,GAAG,CAAC,CAAA;IAC1E,UAAU,CAAC,EAAE,cAAc,EAAE,CAAA;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,qBAAqB,CAAC,EAAE,OAAO,CAAA;CAChC,CAAA;AACD,KAAK,iBAAiB,GAAG;IACvB,QAAQ,EAAE,OAAO,EAAE,CAAA;IACnB,KAAK,EAAE,GAAG,CAAA;IACV,SAAS,EAAE,OAAO,CAAA;IAClB,YAAY,EAAE,OAAO,CAAA;IACrB,YAAY,EAAE,CAAC,OAAO,EAAE,OAAO,KAC3B;QACE,EAAE,EAAE,MAAM,CAAA;QACV,MAAM,EAAE,MAAM,CAAA;KACf,GACD,SAAS,CAAA;CACd,CAAA;AAqDD,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,GAAG,iBAAiB,CAqL7E"}

package/dist/components/hooks/use-products.js

@@ -108,16 +108,36 @@ export function useProducts(props) {
         const productsArray = Array.isArray(data) ? data : data.products || [];
         const cachedProducts = productsArray
             .filter((product) => !!product)
-            .map((product) => {
-            productsLocalStorage.setCacheItem(product);
-            return product;
-        });
+            .map((product) => productsLocalStorage.setCacheItem(product) || product);
         // Return either just the products array or an object with spread contents and overridden products
         return Array.isArray(data)
             ? cachedProducts
             : Object.assign(Object.assign({}, data), { products: cachedProducts });
     }));
     const fetcher = (props === null || props === void 0 ? void 0 : props.fetcher) || defaultFetcher;
+    // Reset local product state when the requested product identity changes so
+    // stale or partial state from a previously viewed product cannot carry over.
+    const requestedProductKey = React.useMemo(() => {
+        var _a, _b, _c;
+        return JSON.stringify({
+            productIds: (_a = props === null || props === void 0 ? void 0 : props.productIds) !== null && _a !== void 0 ? _a : [],
+            productHandles: (_b = props === null || props === void 0 ? void 0 : props.productHandles) !== null && _b !== void 0 ? _b : [],
+            variantIds: (_c = props === null || props === void 0 ? void 0 : props.variantIds) !== null && _c !== void 0 ? _c : [],
+        });
+    }, [props === null || props === void 0 ? void 0 : props.productIds, props === null || props === void 0 ? void 0 : props.productHandles, props === null || props === void 0 ? void 0 : props.variantIds]);
+    const hasMountedRef = React.useRef(false);
+    React.useEffect(() => {
+        if (!hasMountedRef.current) {
+            hasMountedRef.current = true;
+            return;
+        }
+        setProductResponse(productsLocalStorage.getCacheItems({
+            productIds: props === null || props === void 0 ? void 0 : props.productIds,
+            productHandles: props === null || props === void 0 ? void 0 : props.productHandles,
+        }));
+        setIsProductResponseReady(false);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [requestedProductKey]);
     const { data, error, isLoading } = useSWR(url ? [url, body] : null, ([url, body]) => fetcher(url, body));
     const cacheProduct = (product) => {
         const cachedProduct = productsLocalStorage.setCacheItem(product);

package/dist/components/hooks/use-products.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=use-products.test.d.ts.map

package/dist/components/hooks/use-products.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-products.test.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-products.test.tsx"],"names":[],"mappings":""}

package/dist/components/hooks/use-products.test.js

@@ -0,0 +1,129 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { act, renderHook, waitFor } from "@testing-library/react";
+import { SWRConfig } from "swr";
+import ProductsLocalStorage from "../libs/cache/ProductsLocalStorage";
+import { useProducts } from "./use-products";
+const productId = "gid://shopify/Product/1";
+const hydratedSellingPlanGroups = {
+    edges: [
+        {
+            node: {
+                id: "group-1",
+                sellingPlans: {
+                    edges: [
+                        {
+                            node: {
+                                id: "plan-1",
+                                priceAdjustments: [
+                                    { adjustmentValue: { adjustmentPercentage: 10 } },
+                                ],
+                            },
+                        },
+                    ],
+                },
+            },
+        },
+    ],
+};
+const wrapper = ({ children }) => (_jsx(SWRConfig, Object.assign({ value: {
+        provider: () => new Map(),
+        dedupingInterval: 0,
+    } }, { children: children })));
+describe("useProducts", () => {
+    let originalFetch;
+    beforeEach(() => {
+        originalFetch = global.fetch;
+        localStorage.clear();
+        jest.restoreAllMocks();
+    });
+    afterEach(() => {
+        global.fetch = originalFetch;
+    });
+    it("renders the merged cached product when a fetch returns partial selling plans", () => __awaiter(void 0, void 0, void 0, function* () {
+        var _a;
+        const cache = new ProductsLocalStorage();
+        cache.setCacheItem({
+            id: productId,
+            handle: "subscription-product",
+            title: "Cached product",
+            sellingPlanGroups: hydratedSellingPlanGroups,
+        });
+        const fetchMock = jest.fn().mockResolvedValue({
+            json: jest.fn().mockResolvedValue([
+                {
+                    id: productId,
+                    handle: "subscription-product",
+                    title: "Network product",
+                    sellingPlanGroups: {
+                        edges: [
+                            {
+                                node: {
+                                    id: "group-1",
+                                    sellingPlans: {
+                                        edges: [{ node: { id: "plan-1" } }],
+                                    },
+                                },
+                            },
+                        ],
+                    },
+                },
+            ]),
+        });
+        global.fetch = fetchMock;
+        const { result } = renderHook(() => useProducts({
+            baseURL: "https://example.test",
+            productIds: [productId],
+        }), { wrapper });
+        yield waitFor(() => expect(fetchMock).toHaveBeenCalled());
+        yield waitFor(() => { var _a; return expect((_a = result.current.products[0]) === null || _a === void 0 ? void 0 : _a.title).toBe("Network product"); });
+        expect((_a = result.current.products[0]) === null || _a === void 0 ? void 0 : _a.sellingPlanGroups).toEqual(hydratedSellingPlanGroups);
+    }));
+    it("clears the previous product while a new product identity resolves", () => __awaiter(void 0, void 0, void 0, function* () {
+        let resolveProductB = () => { };
+        const productBResponse = new Promise((resolve) => {
+            resolveProductB = resolve;
+        });
+        const fetcher = jest
+            .fn()
+            .mockResolvedValueOnce([
+            {
+                id: "gid://shopify/Product/A",
+                handle: "product-a",
+                title: "Product A",
+            },
+        ])
+            .mockReturnValueOnce(productBResponse);
+        const { result, rerender } = renderHook(({ productId }) => useProducts({
+            baseURL: "https://example.test",
+            productIds: [productId],
+            fetcher,
+        }), {
+            initialProps: { productId: "gid://shopify/Product/A" },
+            wrapper,
+        });
+        yield waitFor(() => { var _a; return expect((_a = result.current.products[0]) === null || _a === void 0 ? void 0 : _a.title).toBe("Product A"); });
+        rerender({ productId: "gid://shopify/Product/B" });
+        expect(result.current.products).toEqual([]);
+        expect(result.current.isLoading).toBe(true);
+        yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+            resolveProductB([
+                {
+                    id: "gid://shopify/Product/B",
+                    handle: "product-b",
+                    title: "Product B",
+                },
+            ]);
+            yield productBResponse;
+        }));
+        yield waitFor(() => { var _a; return expect((_a = result.current.products[0]) === null || _a === void 0 ? void 0 : _a.title).toBe("Product B"); });
+    }));
+});

package/dist/components/libs/cache/ProductsLocalStorage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProductsLocalStorage.d.ts","sourceRoot":"","sources":["../../../../components/libs/cache/ProductsLocalStorage.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAG7C,KAAK,aAAa,GAAG;IACnB,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,MAAM,CAAA;IACd,EAAE,EAAE,MAAM,CAAA;IACV,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CACnB,CAAA;AAED,MAAM,CAAC,OAAO,OAAO,oBAAqB,SAAQ,cAAc;IAC9D,OAAO,EAAE,MAAM,CAA2B;IAC1C,WAAW,EAAE,MAAM,CAAe;IAElC,aAAa,CAAC,EAAE,EAAE,MAAM;IAIxB,iBAAiB,CAAC,MAAM,EAAE,MAAM;;IAShC,QAAQ,IAAI,aAAa,EAAE;IAiB3B,YAAY,CAAC,EACX,EAAE,EACF,MAAM,GACP,EAAE;QACD,EAAE,CAAC,EAAE,MAAM,CAAA;QACX,MAAM,CAAC,EAAE,MAAM,CAAA;KAChB,GAAG,MAAM,GAAG,IAAI;IAgBjB,aAAa,CAAC,QAAQ,EAAE;QACtB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;QACrB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;KAC1B,GAAG,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE;IAYrB,YAAY,CACV,OAAO,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,EACvC,KAAK,CAAC,EAAE,aAAa,EAAE,EACvB,YAAY,GAAE,OAAc;gBAFT,MAAM;YAAM,MAAM;;IAiEvC,aAAa,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,EAAE;;;;IASrD,eAAe,CAAC,WAAW,GAAE,MAAU;IAWvC,UAAU;IAQV,eAAe,CAAC,CAAC,EAAE,GAAG;CASvB"}
+{"version":3,"file":"ProductsLocalStorage.d.ts","sourceRoot":"","sources":["../../../../components/libs/cache/ProductsLocalStorage.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,kBAAkB,CAAA;AA0B7C,KAAK,aAAa,GAAG;IACnB,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,MAAM,CAAA;IACd,EAAE,EAAE,MAAM,CAAA;IACV,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CACnB,CAAA;AAID,MAAM,CAAC,OAAO,OAAO,oBAAqB,SAAQ,cAAc;IAC9D,OAAO,EAAE,MAAM,CAA2B;IAC1C,WAAW,EAAE,MAAM,CAAe;IAElC,aAAa,CAAC,EAAE,EAAE,MAAM;IAIxB,iBAAiB,CAAC,MAAM,EAAE,MAAM;;IAShC,QAAQ,IAAI,aAAa,EAAE;IAiB3B,YAAY,CAAC,EACX,EAAE,EACF,MAAM,GACP,EAAE;QACD,EAAE,CAAC,EAAE,MAAM,CAAA;QACX,MAAM,CAAC,EAAE,MAAM,CAAA;KAChB,GAAG,MAAM,GAAG,IAAI;IAgBjB,aAAa,CAAC,QAAQ,EAAE;QACtB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;QACrB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;KAC1B,GAAG,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE;IAYrB,YAAY,CACV,OAAO,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,EACvC,KAAK,CAAC,EAAE,aAAa,EAAE,EACvB,YAAY,GAAE,OAAc;gBAFT,MAAM;YAAM,MAAM;;IA6EvC,aAAa,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,EAAE;;;;IASrD,eAAe,CAAC,WAAW,GAAE,MAAU;IAWvC,UAAU;IAQV,eAAe,CAAC,CAAC,EAAE,GAAG;CASvB"}

package/dist/components/libs/cache/ProductsLocalStorage.js

@@ -1,5 +1,26 @@
 import AppStudioCache from "./AppStudioCache";
 import { getProductGidsFromIds } from "../../../lib/utils";
+// Normalizes a Shopify connection ({ edges: [...] }) or a plain array into an array.
+const normalizeConnection = (value) => Array.isArray(value) ? value : Array.isArray(value === null || value === void 0 ? void 0 : value.edges) ? value.edges : [];
+const isConnection = (value) => Array.isArray(value) || Array.isArray(value === null || value === void 0 ? void 0 : value.edges);
+// Empty connections are authoritative. Non-empty connections are complete only
+// when every nested plan includes the priceAdjustments field requested by PDPs.
+const hasCompleteSellingPlanData = (groups) => {
+    if (!isConnection(groups))
+        return false;
+    return normalizeConnection(groups).every((group) => {
+        var _a;
+        const groupNode = (_a = group === null || group === void 0 ? void 0 : group.node) !== null && _a !== void 0 ? _a : group;
+        if (!isConnection(groupNode === null || groupNode === void 0 ? void 0 : groupNode.sellingPlans))
+            return false;
+        return normalizeConnection(groupNode.sellingPlans).every((plan) => {
+            var _a;
+            const planNode = (_a = plan === null || plan === void 0 ? void 0 : plan.node) !== null && _a !== void 0 ? _a : plan;
+            return Array.isArray(planNode === null || planNode === void 0 ? void 0 : planNode.priceAdjustments);
+        });
+    });
+};
+const FRESH_MS = 60 * 1000;
 export default class ProductsLocalStorage extends AppStudioCache {
     getIdCacheKey(id) {
         return `${this.cachePrefix}-data-${id}`;
@@ -68,6 +89,17 @@ export default class ProductsLocalStorage extends AppStudioCache {
         if (cachedProduct) {
             // merge products, keeping populated arrays from cached product
             productToCache = Object.entries(product).reduce((merged, [key, value]) => {
+                var _a;
+                // Keep the more-complete cached sellingPlanGroups when the incoming
+                // payload is partial/unhydrated (missing nested priceAdjustments),
+                // e.g. from PLP or carousel fetches. Prevents a shallow payload from
+                // poisoning a fully hydrated PDP record.
+                if (key === "sellingPlanGroups" &&
+                    hasCompleteSellingPlanData(cachedProduct[key]) &&
+                    !hasCompleteSellingPlanData(value) &&
+                    Date.now() - ((_a = cachedProduct.ct) !== null && _a !== void 0 ? _a : 0) < FRESH_MS) {
+                    return Object.assign(Object.assign({}, merged), { [key]: cachedProduct[key] });
+                }
                 // Keep non-empty arrays from cached product if current product has empty array
                 if (Array.isArray(value) &&
                     value.length === 0 &&

package/dist/components/libs/cache/ProductsLocalStorage.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=ProductsLocalStorage.test.d.ts.map

package/dist/components/libs/cache/ProductsLocalStorage.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProductsLocalStorage.test.d.ts","sourceRoot":"","sources":["../../../../components/libs/cache/ProductsLocalStorage.test.ts"],"names":[],"mappings":""}

package/dist/components/libs/cache/ProductsLocalStorage.test.js

@@ -0,0 +1,110 @@
+import ProductsLocalStorage from "./ProductsLocalStorage";
+const productId = "gid://shopify/Product/1";
+const sellingPlanGroups = (price) => ({
+    edges: [
+        {
+            node: {
+                id: "group-1",
+                sellingPlans: {
+                    edges: [
+                        {
+                            node: {
+                                id: "plan-1",
+                                priceAdjustments: [{ adjustmentValue: { price } }],
+                            },
+                        },
+                    ],
+                },
+            },
+        },
+    ],
+});
+const product = (groups) => ({
+    id: productId,
+    handle: "subscription-product",
+    sellingPlanGroups: groups,
+});
+describe("ProductsLocalStorage selling plan merges", () => {
+    let storage;
+    beforeEach(() => {
+        localStorage.clear();
+        storage = new ProductsLocalStorage();
+    });
+    it("keeps hydrated selling plans when an incoming payload is partial", () => {
+        storage.setCacheItem(product(sellingPlanGroups("10.00")));
+        const merged = storage.setCacheItem(product({
+            edges: [
+                {
+                    node: {
+                        id: "group-1",
+                        sellingPlans: {
+                            edges: [{ node: { id: "plan-1" } }],
+                        },
+                    },
+                },
+            ],
+        }));
+        expect(merged.sellingPlanGroups.edges[0].node.sellingPlans.edges[0].node
+            .priceAdjustments).toEqual([{ adjustmentValue: { price: "10.00" } }]);
+    });
+    it("keeps hydrated selling plans when only some incoming plans are hydrated", () => {
+        storage.setCacheItem(product(sellingPlanGroups("10.00")));
+        const merged = storage.setCacheItem(product({
+            edges: [
+                {
+                    node: {
+                        id: "group-1",
+                        sellingPlans: {
+                            edges: [
+                                {
+                                    node: {
+                                        id: "plan-1",
+                                        priceAdjustments: [
+                                            { adjustmentValue: { price: "12.00" } },
+                                        ],
+                                    },
+                                },
+                                { node: { id: "plan-2" } },
+                            ],
+                        },
+                    },
+                },
+            ],
+        }));
+        expect(merged.sellingPlanGroups.edges[0].node.sellingPlans.edges).toHaveLength(1);
+        expect(merged.sellingPlanGroups.edges[0].node.sellingPlans.edges[0].node
+            .priceAdjustments).toEqual([{ adjustmentValue: { price: "10.00" } }]);
+    });
+    it("accepts an authoritative empty selling plan list", () => {
+        storage.setCacheItem(product(sellingPlanGroups("10.00")));
+        const merged = storage.setCacheItem(product({ edges: [] }));
+        expect(merged.sellingPlanGroups).toEqual({ edges: [] });
+    });
+    it("replaces cached selling plans with a complete incoming payload", () => {
+        storage.setCacheItem(product(sellingPlanGroups("10.00")));
+        const merged = storage.setCacheItem(product(sellingPlanGroups("12.00")));
+        expect(merged.sellingPlanGroups.edges[0].node.sellingPlans.edges[0].node
+            .priceAdjustments).toEqual([{ adjustmentValue: { price: "12.00" } }]);
+    });
+    it("lets a partial payload win once the cached entry is stale", () => {
+        const nowSpy = jest.spyOn(Date, "now");
+        nowSpy.mockReturnValue(1000000);
+        storage.setCacheItem(product(sellingPlanGroups("10.00")));
+        nowSpy.mockReturnValue(1000000 + 61 * 1000);
+        const merged = storage.setCacheItem(product({
+            edges: [
+                {
+                    node: {
+                        id: "group-1",
+                        sellingPlans: {
+                            edges: [{ node: { id: "plan-1" } }],
+                        },
+                    },
+                },
+            ],
+        }));
+        expect(merged.sellingPlanGroups.edges[0].node.sellingPlans.edges[0].node
+            .priceAdjustments).toBeUndefined();
+        nowSpy.mockRestore();
+    });
+});

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

@@ -33,11 +33,12 @@ declare const DrawerContentBase: React.ForwardRefExoticComponent<Omit<React.Deta
     containerRef?: HTMLElement | undefined;
     maxHeight?: string | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
+declare const DrawerTitle: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dialog").DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
 declare const DrawerFooter: {
     ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
-declare const DrawerDescription: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+declare const DrawerDescription: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dialog").DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
 type DrawerHeaderProps = {
     iconLeftName?: string;
     iconRightName?: string;
@@ -46,5 +47,5 @@ type DrawerHeaderProps = {
 };
 declare const DrawerHeader: ({ title, iconLeftName, iconRightName, onCloseClick, }: DrawerHeaderProps) => import("react/jsx-runtime").JSX.Element;
 declare const DrawerContent: ({ children, className, ...props }: React.HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export { Drawer, DrawerPortal, DrawerOverlay, DrawerTrigger, DrawerClose, DrawerContentBase, DrawerContent, DrawerFooter, DrawerDescription, DrawerHeader, };
+export { Drawer, DrawerPortal, DrawerOverlay, DrawerTrigger, DrawerClose, DrawerContentBase, DrawerContent, DrawerFooter, DrawerTitle, DrawerDescription, DrawerHeader, };
 //# sourceMappingURL=drawer.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../components/ui/drawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,MAAM,CAAA;AAKhD,KAAK,kBAAkB,GAAG,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,GAAG;IACnE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,KAAK,iBAAiB,GAAG;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,YAAY,CAAC,EAAE,WAAW,CAAA;CAC3B,CAAA;AAED,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,GAAG;IACjE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,QAAA,MAAM,aAAa,8BAA0D,CAAA;AAG7E,QAAA,MAAM,YAAY;iCAAgC,iBAAiB;;CAgBlE,CAAA;AAGD,QAAA,MAAM,WAAW,4BAAsD,CAAA;AAGvE,KAAK,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,GAAG;IACrE,YAAY,CAAC,EAAE,WAAW,CAAA;CAC3B,CAAA;AAED,QAAA,MAAM,MAAM;0CAAyC,WAAW;;CAS/D,CAAA;AAOD,QAAA,MAAM,aAAa;;wCAYlB,CAAA;AAWD,QAAA,MAAM,iBAAiB;;;;;;wCA2CtB,CAAA;AA0BD,QAAA,MAAM,YAAY;8BAGf,MAAM,cAAc,CAAC,cAAc,CAAC;;CAQtC,CAAA;AAGD,QAAA,MAAM,iBAAiB,qLASrB,CAAA;AAGF,KAAK,iBAAiB,GAAG;IACvB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;CACjD,CAAA;AAED,QAAA,MAAM,YAAY,0DAKf,iBAAiB,4CA8BnB,CAAA;AAED,QAAA,MAAM,aAAa,sCAIhB,MAAM,cAAc,CAAC,cAAc,CAAC,4CAMtC,CAAA;AAED,OAAO,EACL,MAAM,EACN,YAAY,EACZ,aAAa,EACb,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,iBAAiB,EACjB,YAAY,GACb,CAAA"}
+{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../components/ui/drawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,MAAM,CAAA;AAKhD,KAAK,kBAAkB,GAAG,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,GAAG;IACnE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,KAAK,iBAAiB,GAAG;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,YAAY,CAAC,EAAE,WAAW,CAAA;CAC3B,CAAA;AAED,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,GAAG;IACjE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,QAAA,MAAM,aAAa,8BAA0D,CAAA;AAG7E,QAAA,MAAM,YAAY;iCAAgC,iBAAiB;;CAgBlE,CAAA;AAGD,QAAA,MAAM,WAAW,4BAAsD,CAAA;AAGvE,KAAK,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,GAAG;IACrE,YAAY,CAAC,EAAE,WAAW,CAAA;CAC3B,CAAA;AAED,QAAA,MAAM,MAAM;0CAAyC,WAAW;;CAS/D,CAAA;AAOD,QAAA,MAAM,aAAa;;wCAYlB,CAAA;AAWD,QAAA,MAAM,iBAAiB;;;;;;wCA2CtB,CAAA;AAWD,QAAA,MAAM,WAAW,qLAYf,CAAA;AAGF,QAAA,MAAM,YAAY;8BAGf,MAAM,cAAc,CAAC,cAAc,CAAC;;CAQtC,CAAA;AAGD,QAAA,MAAM,iBAAiB,+LASrB,CAAA;AAGF,KAAK,iBAAiB,GAAG;IACvB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;CACjD,CAAA;AAED,QAAA,MAAM,YAAY,0DAKf,iBAAiB,4CA8BnB,CAAA;AAED,QAAA,MAAM,aAAa,sCAIhB,MAAM,cAAc,CAAC,cAAc,CAAC,4CAMtC,CAAA;AAED,OAAO,EACL,MAAM,EACN,YAAY,EACZ,aAAa,EACb,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,YAAY,GACb,CAAA"}

package/dist/components/ui/drawer.js

@@ -71,9 +71,9 @@ const DrawerFooter = (_a) => {
 DrawerFooter.displayName = "DrawerFooter";
 const DrawerDescription = React.forwardRef((_a, ref) => {
     var { className } = _a, props = __rest(_a, ["className"]);
-    return (_jsx("p", Object.assign({ ref: ref, className: cn("text-sm text-muted-foreground", className) }, props)));
+    return (_jsx(DrawerPrimitive.Description, Object.assign({ ref: ref, className: cn("text-sm text-muted-foreground", className) }, props)));
 });
-DrawerDescription.displayName = "DrawerDescription";
+DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
 const DrawerHeader = ({ title, iconLeftName, iconRightName, onCloseClick, }) => {
     return (_jsxs(DrawerHeaderBase, Object.assign({ className: "p-4 text-center flex justify-between" }, { children: [iconLeftName ? (_jsx(DrawerClose, Object.assign({ className: "h-6 w-6 p-0", onClick: onCloseClick }, { children: _jsx(Icon, { name: iconLeftName, color: "coreColors-secondaryIcon", className: "h-6 w-6 p-0", size: "md" }) }))) : (_jsx("div", { className: "w-6" })), _jsx(DrawerTitle, { children: title }), iconRightName ? (_jsx(DrawerClose, Object.assign({ className: "h-6 w-6 p-0", onClick: onCloseClick }, { children: _jsx(Icon, { name: iconRightName, color: "coreColors-secondaryIcon", className: "h-6 w-6 p-0", size: "md" }) }))) : (_jsx("div", { className: "w-6" }))] })));
 };
@@ -81,4 +81,4 @@ const DrawerContent = (_a) => {
     var { children, className } = _a, props = __rest(_a, ["children", "className"]);
     return (_jsx("div", Object.assign({ className: cn("h-full overflow-scroll", className) }, props, { children: children })));
 };
-export { Drawer, DrawerPortal, DrawerOverlay, DrawerTrigger, DrawerClose, DrawerContentBase, DrawerContent, DrawerFooter, DrawerDescription, DrawerHeader, };
+export { Drawer, DrawerPortal, DrawerOverlay, DrawerTrigger, DrawerClose, DrawerContentBase, DrawerContent, DrawerFooter, DrawerTitle, DrawerDescription, DrawerHeader, };

package/dist/tests/use-order-details.test.js

@@ -1,4 +1,4 @@
-import { transformOrderDetails } from "../components/hooks/use-order-details";
+import { transformOrderDetails, getEffectiveLineQuantity, } from "../components/hooks/use-order-details";
 // jsdom does not implement crypto.randomUUID, which transformOrderDetails
 // uses for line uniqueIds
 beforeAll(() => {
@@ -63,3 +63,86 @@ describe("transformOrderDetails — Shopify Order Editing (currentQuantity)", ()
         expect(orderDetails.cart.lines[0].quantity).toBe(1);
     });
 });
+describe("transformOrderDetails — New Customer Account API (no currentQuantity)", () => {
+    // Modeled on real prod data (Pink Palm Puff order #PPP95701331): the
+    // Customer Account API LineItem has NO `currentQuantity` — a line removed via
+    // Order Editing keeps `quantity: 1` and signals removal only via
+    // `refundableQuantity: 0`. The kept line has `refundableQuantity: 1`.
+    const editedOrder = {
+        id: "gid://shopify/Order/10929524212006",
+        currency: "USD",
+        edited: true,
+        financialStatus: "PAID",
+        refunds: [],
+        totalRefunded: { amount: "0.0", currencyCode: "USD" },
+        totalAmount: "63.88",
+        lineItems: [
+            {
+                title: "Couture Carryall in Blush Bay (Reversible)",
+                quantity: 1,
+                refundableQuantity: 0,
+                price: { amount: "99.0", currencyCode: "USD" },
+            },
+            {
+                title: "Malibu Slippers in Blush Bay",
+                quantity: 1,
+                refundableQuantity: 1,
+                price: { amount: "59.0", currencyCode: "USD" },
+            },
+        ],
+    };
+    it("hides items removed via order editing on an edited order", () => {
+        const { orderDetails, checkoutData } = transformOrderDetails(editedOrder);
+        expect(orderDetails.cart.lines).toHaveLength(1);
+        expect(orderDetails.cart.lines[0].title).toBe("Malibu Slippers in Blush Bay");
+        expect(checkoutData.lineItems).toHaveLength(1);
+        expect(checkoutData.lineItems[0].title).toBe("Malibu Slippers in Blush Bay");
+    });
+    it("does NOT hide items on an UN-edited fully-refunded order", () => {
+        // Real prod data: cancelled+refunded order #PPP95700931 — edited:false,
+        // both lines refundableQuantity:0. These must still display in full.
+        const refundedOrder = Object.assign(Object.assign({}, editedOrder), { id: "gid://shopify/Order/10929514119462", edited: false, lineItems: editedOrder.lineItems.map((li) => (Object.assign(Object.assign({}, li), { refundableQuantity: 0 }))) });
+        const { orderDetails } = transformOrderDetails(refundedOrder);
+        expect(orderDetails.cart.lines).toHaveLength(2);
+    });
+    it("does NOT hide items on an EDITED order that also has a refund/return", () => {
+        // `edited` is sticky in Shopify and `refundableQuantity` drops on refunds
+        // too, so an edited-then-returned order must NOT collapse: fall back to
+        // ordered quantity rather than blank the order / hide bought items.
+        const editedAndRefunded = Object.assign(Object.assign({}, editedOrder), { financialStatus: "REFUNDED", totalRefunded: { amount: "171.06", currencyCode: "USD" }, refunds: [{ id: "gid://shopify/Refund/1", createdAt: "2026-07-08" }], lineItems: editedOrder.lineItems.map((li) => (Object.assign(Object.assign({}, li), { refundableQuantity: 0 }))) });
+        const { orderDetails } = transformOrderDetails(editedAndRefunded);
+        expect(orderDetails.cart.lines).toHaveLength(2);
+    });
+    it("reduces (not hides) a quantity edited down on an edited order", () => {
+        const { orderDetails } = transformOrderDetails(Object.assign(Object.assign({}, editedOrder), { lineItems: [
+                {
+                    title: "Pink Palm Pajamas",
+                    quantity: 3,
+                    refundableQuantity: 2,
+                    price: { amount: "95.0", currencyCode: "USD" },
+                },
+            ] }));
+        expect(orderDetails.cart.lines).toHaveLength(1);
+        expect(orderDetails.cart.lines[0].quantity).toBe(2);
+    });
+});
+describe("getEffectiveLineQuantity", () => {
+    it("prefers currentQuantity when present (Storefront API)", () => {
+        expect(getEffectiveLineQuantity({ edited: true }, { currentQuantity: 0, quantity: 1, refundableQuantity: 1 })).toBe(0);
+    });
+    it("uses refundableQuantity on edited orders without currentQuantity", () => {
+        expect(getEffectiveLineQuantity({ edited: true }, { quantity: 1, refundableQuantity: 0 })).toBe(0);
+    });
+    it("uses quantity on un-edited orders even when refundableQuantity differs", () => {
+        expect(getEffectiveLineQuantity({ edited: false }, { quantity: 3, refundableQuantity: 0 })).toBe(3);
+    });
+    it("ignores refundableQuantity on an edited order with a refund (refunds array)", () => {
+        expect(getEffectiveLineQuantity({ edited: true, refunds: [{ id: "r1" }] }, { quantity: 1, refundableQuantity: 0 })).toBe(1);
+    });
+    it("ignores refundableQuantity on an edited order with a refund (financialStatus)", () => {
+        expect(getEffectiveLineQuantity({ edited: true, financialStatus: "PARTIALLY_REFUNDED" }, { quantity: 3, refundableQuantity: 1 })).toBe(3);
+    });
+    it("ignores refundableQuantity on an edited order with totalRefunded > 0", () => {
+        expect(getEffectiveLineQuantity({ edited: true, totalRefunded: { amount: "50.0" } }, { quantity: 2, refundableQuantity: 0 })).toBe(2);
+    });
+});

package/package.json

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