@mohasinac/appkit 3.5.3 → 3.5.4

package/dist/features/seller/components/CategoryInlineSelect.d.ts

@@ -4,7 +4,7 @@ export interface CategoryInlineSelectProps {
     onChange: (v: string) => void;
     placeholder?: string;
     disabled?: boolean;
-    /** Show the "+ Create new category" option. Defaults to false (search-only for sellers). */
+    /** Show the "+ Create new category" option. Defaults to true — sellers can create categories inline. */
     allowCreate?: boolean;
 }
 export declare function CategoryInlineSelect({ value, onChange, placeholder, disabled, allowCreate, }: CategoryInlineSelectProps): React.JSX.Element;

package/dist/features/seller/components/CategoryInlineSelect.js

@@ -35,7 +35,7 @@ async function loadPublicCategoryOptions(query, _page) {
     const items = q ? all.filter((c) => c.label.toLowerCase().includes(q)) : all;
     return { items, hasMore: false, nextPage: 2 };
 }
-export function CategoryInlineSelect({ value, onChange, placeholder = "Search categories…", disabled, allowCreate = false, }) {
+export function CategoryInlineSelect({ value, onChange, placeholder = "Search categories…", disabled, allowCreate = true, }) {
     const loadOptions = allowCreate ? loadAdminCategoryOptions : loadPublicCategoryOptions;
     return (_jsx(PaginatedSelect, { value: value || null, onChange: (v) => onChange(v ?? ""), loadOptions: loadOptions, placeholder: placeholder, disabled: disabled, createLabel: "category", drawerTitle: "Create Category", renderCreateForm: allowCreate
             ? ({ onCreated, onCancel }) => (_jsx(CategoryQuickCreateForm, { onSaved: (id, name) => onCreated({ value: id, label: name }), onCancel: onCancel }))

package/dist/react/hooks/useBulkSelection.js

@@ -19,7 +19,12 @@ export function useBulkSelection({ items, keyExtractor, maxSelection = BULK_MAX_
     }, [maxSelection]);
     const toggleAll = useCallback(() => {
         setSelectedSet((prev) => {
-            const allSelected = prev.size === allIds.length && allIds.length > 0;
+            // Compare actual membership, not just set size — `prev` can hold IDs
+            // from a page that's no longer rendered (e.g. after paginating), in
+            // which case the sizes coincidentally matching would wrongly report
+            // "all selected" and CLEAR the selection instead of selecting the
+            // currently-visible items.
+            const allSelected = allIds.length > 0 && allIds.every((id) => prev.has(id));
             if (allSelected)
                 return new Set();
             return new Set(allIds.slice(0, maxSelection));
@@ -33,8 +38,12 @@ export function useBulkSelection({ items, keyExtractor, maxSelection = BULK_MAX_
     const selectedIds = useMemo(() => Array.from(selectedSet), [selectedSet]);
     const selectedCount = selectedSet.size;
     const isSelecting = selectedCount > 0;
-    const isAllSelected = allIds.length > 0 && selectedCount === allIds.length;
-    const isIndeterminate = selectedCount > 0 && selectedCount < allIds.length;
+    // Membership-based, not cardinality-based — `selectedSet` can hold IDs
+    // from items that are no longer in `allIds` (e.g. the previous page),
+    // so comparing sizes alone can report "all selected" when none of the
+    // *currently rendered* rows are actually selected.
+    const isAllSelected = allIds.length > 0 && allIds.every((id) => selectedSet.has(id));
+    const isIndeterminate = !isAllSelected && allIds.some((id) => selectedSet.has(id));
     return {
         selectedIds,
         selectedIdSet: selectedSet,

package/dist/react/hooks/useGesture.js

@@ -28,6 +28,12 @@ export function useGesture(ref, options = {}) {
     const lastTapRef = useRef(0);
     const initialPinchDistanceRef = useRef(0);
     const initialRotationRef = useRef(0);
+    // Real devices lift two fingers in separate touchend events, so by the
+    // final touchend `e.changedTouches` only ever has one entry — tracking
+    // the last-known two-finger positions here lets us compute the true
+    // final pinch distance / rotation angle instead of pairing a touch with
+    // itself (which always yields 0).
+    const lastTwoTouchesRef = useRef(null);
     // Store callbacks in refs to avoid event listener churn
     const onTapRef = useRef(onTap);
     const onDoubleTapRef = useRef(onDoubleTap);
@@ -67,6 +73,14 @@ export function useGesture(ref, options = {}) {
             const dy = touch1.clientY - touch2.clientY;
             return Math.atan2(dy, dx) * (180 / Math.PI);
         };
+        const captureTwoTouches = (t1, t2) => {
+            lastTwoTouchesRef.current = {
+                x1: t1.clientX,
+                y1: t1.clientY,
+                x2: t2.clientX,
+                y2: t2.clientY,
+            };
+        };
         const handleTouchStart = (e) => {
             if (preventDefault)
                 e.preventDefault();
@@ -79,6 +93,7 @@ export function useGesture(ref, options = {}) {
             if (e.touches.length === 2) {
                 initialPinchDistanceRef.current = getDistance(e.touches[0], e.touches[1]);
                 initialRotationRef.current = getAngle(e.touches[0], e.touches[1]);
+                captureTwoTouches(e.touches[0], e.touches[1]);
             }
         };
         const handleTouchMove = (e) => {
@@ -91,6 +106,7 @@ export function useGesture(ref, options = {}) {
                     onRotatingRef.current)) {
                 if (preventDefault)
                     e.preventDefault();
+                captureTwoTouches(e.touches[0], e.touches[1]);
                 const currentDistance = getDistance(e.touches[0], e.touches[1]);
                 const currentAngle = getAngle(e.touches[0], e.touches[1]);
                 if (initialPinchDistanceRef.current > 0) {
@@ -122,16 +138,40 @@ export function useGesture(ref, options = {}) {
                 }
             }
             if (e.touches.length === 0 && initialPinchDistanceRef.current > 0) {
-                const currentDistance = getDistance(e.changedTouches[0], e.changedTouches[1] || e.changedTouches[0]);
-                onPinchRef.current?.(currentDistance / initialPinchDistanceRef.current, currentDistance);
+                // `e.changedTouches` only has the LAST-lifted finger at this point
+                // (the other one already ended in a prior touchend event), so pair
+                // it against the last-known two-finger positions instead of
+                // self-pairing it (which always yields a distance of 0).
+                const last = lastTwoTouchesRef.current;
+                if (last) {
+                    const currentDistance = getDistance({ clientX: last.x1, clientY: last.y1 }, { clientX: last.x2, clientY: last.y2 });
+                    onPinchRef.current?.(currentDistance / initialPinchDistanceRef.current, currentDistance);
+                }
                 initialPinchDistanceRef.current = 0;
             }
             if (e.touches.length === 0 && initialRotationRef.current !== 0) {
-                const currentAngle = getAngle(e.changedTouches[0], e.changedTouches[1] || e.changedTouches[0]);
-                onRotateRef.current?.(currentAngle - initialRotationRef.current);
+                const last = lastTwoTouchesRef.current;
+                if (last) {
+                    const currentAngle = getAngle({ clientX: last.x1, clientY: last.y1 }, { clientX: last.x2, clientY: last.y2 });
+                    onRotateRef.current?.(currentAngle - initialRotationRef.current);
+                }
                 initialRotationRef.current = 0;
             }
+            if (e.touches.length === 0) {
+                lastTwoTouchesRef.current = null;
+            }
+            touchStartRef.current = null;
+        };
+        const handleTouchCancel = () => {
+            // OS/browser gesture takeover interrupted the touch sequence — reset
+            // all tracked state without firing any callback, matching the "quick
+            // taps don't fire" contract. Without this, stale pinch/rotation refs
+            // survive into the next unrelated tap and spuriously fire onPinch /
+            // onRotate for it.
             touchStartRef.current = null;
+            initialPinchDistanceRef.current = 0;
+            initialRotationRef.current = 0;
+            lastTwoTouchesRef.current = null;
         };
         const handleMouseDown = (e) => {
             if (preventDefault)
@@ -168,12 +208,16 @@ export function useGesture(ref, options = {}) {
         element.addEventListener("touchend", handleTouchEnd, {
             passive: !preventDefault,
         });
+        element.addEventListener("touchcancel", handleTouchCancel, {
+            passive: true,
+        });
         element.addEventListener("mousedown", handleMouseDown);
         element.addEventListener("mouseup", handleMouseUp);
         return () => {
             element.removeEventListener("touchstart", handleTouchStart);
             element.removeEventListener("touchmove", handleTouchMove);
             element.removeEventListener("touchend", handleTouchEnd);
+            element.removeEventListener("touchcancel", handleTouchCancel);
             element.removeEventListener("mousedown", handleMouseDown);
             element.removeEventListener("mouseup", handleMouseUp);
         };

package/dist/react/hooks/useLongPress.d.ts

@@ -10,4 +10,5 @@ export declare function useLongPress(callback: () => void, ms?: number): {
     onMouseLeave: () => void;
     onTouchStart: () => void;
     onTouchEnd: () => void;
+    onTouchCancel: () => void;
 };

package/dist/react/hooks/useLongPress.js

@@ -32,5 +32,10 @@ export function useLongPress(callback, ms = 500) {
         onMouseLeave: cancel,
         onTouchStart: start,
         onTouchEnd: cancel,
+        // Browsers fire touchcancel (not touchend) when a touch is reinterpreted
+        // as a scroll — common for cards in a scrollable list. Without this the
+        // pending timer survives and can fire the callback after what was really
+        // just a scroll, contradicting the "quick taps do NOT fire" contract.
+        onTouchCancel: cancel,
     };
 }

package/dist/react/hooks/usePullToRefresh.js

@@ -65,6 +65,15 @@ export function usePullToRefresh(onRefresh, options = {}) {
             await onRefreshRef.current();
         }
     }, []);
+    const handleTouchCancel = useCallback(() => {
+        // Interrupted pull (OS/browser gesture takeover) — reset without
+        // triggering onRefresh. Without this, isPulling/progress stay frozen
+        // mid-animation since only touchend resets them.
+        setIsPulling(false);
+        setProgress(0);
+        startYRef.current = null;
+        thresholdReachedRef.current = false;
+    }, []);
     useEffect(() => {
         const el = containerRef.current;
         if (!el)
@@ -72,11 +81,13 @@ export function usePullToRefresh(onRefresh, options = {}) {
         el.addEventListener("touchstart", handleTouchStart, { passive: true });
         el.addEventListener("touchmove", handleTouchMove, { passive: true });
         el.addEventListener("touchend", handleTouchEnd);
+        el.addEventListener("touchcancel", handleTouchCancel, { passive: true });
         return () => {
             el.removeEventListener("touchstart", handleTouchStart);
             el.removeEventListener("touchmove", handleTouchMove);
             el.removeEventListener("touchend", handleTouchEnd);
+            el.removeEventListener("touchcancel", handleTouchCancel);
         };
-    }, [handleTouchStart, handleTouchMove, handleTouchEnd]);
+    }, [handleTouchStart, handleTouchMove, handleTouchEnd, handleTouchCancel]);
     return { containerRef, isPulling, progress };
 }

package/dist/react/hooks/useRealtimeEvent.js

@@ -32,6 +32,13 @@ const DEFAULT_MESSAGES = {
 };
 export function useRealtimeEvent(config) {
     const configRef = useRef(config);
+    // Re-sync every render — callers commonly pass a fresh config object
+    // (new extractData/messages/onLogError) each render, and subscribe()/
+    // cleanup() only ever read configRef.current, so without this the very
+    // first render's config would be captured forever.
+    useEffect(() => {
+        configRef.current = config;
+    });
     const [status, setStatus] = useState(RealtimeEventStatus.IDLE);
     const [error, setError] = useState(null);
     const [data, setData] = useState(null);
@@ -71,13 +78,23 @@ export function useRealtimeEvent(config) {
             catch (authErr) {
                 void normalizeError(authErr);
                 onLogError?.(`useRealtimeEvent[${type}]: custom token sign-in failed`, authErr);
+                // A newer subscribe() call for a different eventId may have already
+                // superseded this one (and possibly already fully subscribed) while
+                // this sign-in was still in flight. Do NOT call cleanup() here —
+                // cleanup() tears down whatever is *currently* registered in the
+                // shared refs, which by now may be the newer call's live
+                // subscription, not anything this stale call ever set up itself.
+                if (eventIdRef.current !== eventId) {
+                    return;
+                }
                 setError(msg.tokenFailure);
                 setStatus(RealtimeEventStatus.FAILED);
                 cleanup();
                 return;
             }
             if (eventIdRef.current !== eventId) {
-                cleanup();
+                // Same reasoning as the catch branch above — don't tear down a
+                // newer call's already-live subscription via the shared refs.
                 return;
             }
             setStatus(RealtimeEventStatus.PENDING);

package/dist/react/hooks/useSwipe.js

@@ -118,6 +118,16 @@ export function useSwipe(ref, options = {}) {
             isSwiping.current = false;
             onSwipeEndRef.current?.();
         };
+        const handleTouchCancel = () => {
+            // OS/browser gesture takeover interrupted the touch — without this,
+            // isSwiping/touchStartRef stay stuck and onSwipeEnd (which callers
+            // rely on to clear a "dragging" UI flag) never fires.
+            if (!isSwiping.current)
+                return;
+            touchStartRef.current = null;
+            isSwiping.current = false;
+            onSwipeEndRef.current?.();
+        };
         const handleMouseDown = (e) => {
             if (preventDefault)
                 e.preventDefault();
@@ -149,6 +159,9 @@ export function useSwipe(ref, options = {}) {
         element.addEventListener("touchend", handleTouchEnd, {
             passive: !preventDefault,
         });
+        element.addEventListener("touchcancel", handleTouchCancel, {
+            passive: true,
+        });
         element.addEventListener("mousedown", handleMouseDown);
         document.addEventListener("mousemove", handleMouseMove);
         document.addEventListener("mouseup", handleMouseUp);
@@ -156,6 +169,7 @@ export function useSwipe(ref, options = {}) {
             element.removeEventListener("touchstart", handleTouchStart);
             element.removeEventListener("touchmove", handleTouchMove);
             element.removeEventListener("touchend", handleTouchEnd);
+            element.removeEventListener("touchcancel", handleTouchCancel);
             element.removeEventListener("mousedown", handleMouseDown);
             document.removeEventListener("mousemove", handleMouseMove);
             document.removeEventListener("mouseup", handleMouseUp);