react-native-collapsible-sticky-header 0.0.0-stage → 0.1.0

package/lib/commonjs/useStickyHeader.js

@@ -0,0 +1,143 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DEFAULT_STICKY_POINTER_OFFSET = exports.DEFAULT_STICKY_FADE_DISTANCE = exports.DEFAULT_COLLAPSE_TRANSLATE_Y = void 0;
+exports.useStickyHeader = useStickyHeader;
+var _react = require("react");
+var _reactNativeReanimated = require("react-native-reanimated");
+var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
+var _utils = require("./utils.js");
+const DEFAULT_STICKY_FADE_DISTANCE = exports.DEFAULT_STICKY_FADE_DISTANCE = 40;
+const DEFAULT_STICKY_POINTER_OFFSET = exports.DEFAULT_STICKY_POINTER_OFFSET = 20;
+const DEFAULT_COLLAPSE_TRANSLATE_Y = exports.DEFAULT_COLLAPSE_TRANSLATE_Y = -12;
+
+/**
+ * Scroll-driven state for a collapsing header with a sticky bar.
+ *
+ * All styles are computed on the UI thread. The hook only re-renders when the
+ * sticky state flips (and when the nav bar is first measured).
+ */
+function useStickyHeader(options = {}) {
+  const {
+    thresholdOffset = 0,
+    stickyFadeDistance = DEFAULT_STICKY_FADE_DISTANCE,
+    stickyPointerOffset = DEFAULT_STICKY_POINTER_OFFSET,
+    collapseTranslateY = DEFAULT_COLLAPSE_TRANSLATE_Y,
+    collapseAnimation,
+    stickyAnimation,
+    respectSafeArea = true,
+    topInset: topInsetOverride,
+    reducedMotion: reducedMotionOverride,
+    onStickyChange,
+    onScroll
+  } = options;
+  const insets = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
+  const systemReducedMotion = (0, _reactNativeReanimated.useReducedMotion)();
+  const reducedMotion = reducedMotionOverride ?? systemReducedMotion;
+  const topInset = respectSafeArea ? topInsetOverride ?? insets.top : 0;
+  const scrollY = (0, _reactNativeReanimated.useSharedValue)(0);
+  const navBarHeight = (0, _reactNativeReanimated.useSharedValue)(0);
+  const threshold = (0, _reactNativeReanimated.useSharedValue)(0);
+  const stickySV = (0, _reactNativeReanimated.useSharedValue)(false);
+  const [isSticky, setIsSticky] = (0, _react.useState)(false);
+  const onStickyChangeRef = (0, _react.useRef)(onStickyChange);
+  onStickyChangeRef.current = onStickyChange;
+  const onScrollRef = (0, _react.useRef)(onScroll);
+  onScrollRef.current = onScroll;
+  const hasJsOnScroll = onScroll != null;
+  const notifySticky = (0, _react.useCallback)(next => {
+    setIsSticky(next);
+    onStickyChangeRef.current?.(next);
+  }, []);
+  const forwardScroll = (0, _react.useCallback)(event => {
+    onScrollRef.current?.({
+      nativeEvent: event
+    });
+  }, []);
+  const updateScrollY = (0, _react.useCallback)(y => {
+    'worklet';
+
+    scrollY.value = y;
+    const next = (0, _utils.isStickyAt)(y, threshold.value, stickyPointerOffset);
+    if (next !== stickySV.value) {
+      stickySV.value = next;
+      (0, _reactNativeReanimated.runOnJS)(notifySticky)(next);
+    }
+  }, [scrollY, threshold, stickySV, stickyPointerOffset, notifySticky]);
+
+  // Re-evaluates the sticky state on the UI thread (where scrollY lives)
+  // after the threshold moved without a scroll.
+  const resyncSticky = (0, _react.useCallback)(() => {
+    'worklet';
+
+    updateScrollY(scrollY.value);
+  }, [updateScrollY, scrollY]);
+
+  // The threshold is computed from JS-side numbers: shared value writes from
+  // JS are applied asynchronously, so reading them back here would be stale.
+  const measuredNavHeight = (0, _react.useRef)(0);
+  const syncThreshold = (0, _react.useCallback)(() => {
+    threshold.value = (0, _utils.computeThreshold)(measuredNavHeight.current, topInset, thresholdOffset);
+    (0, _reactNativeReanimated.runOnUI)(resyncSticky)();
+  }, [threshold, topInset, thresholdOffset, resyncSticky]);
+  (0, _react.useEffect)(() => {
+    syncThreshold();
+  }, [syncThreshold]);
+  const onNavLayout = (0, _react.useCallback)(event => {
+    const height = event.nativeEvent.layout.height;
+    if (height === measuredNavHeight.current) return;
+    measuredNavHeight.current = height;
+    navBarHeight.value = height;
+    syncThreshold();
+  }, [navBarHeight, syncThreshold]);
+
+  // No deps array: Reanimated rebuilds the handler from its closure (and v4
+  // warns when deps are passed on native).
+  const scrollHandler = (0, _reactNativeReanimated.useAnimatedScrollHandler)({
+    onScroll: event => {
+      updateScrollY(event.contentOffset.y);
+      if (hasJsOnScroll) {
+        (0, _reactNativeReanimated.runOnJS)(forwardScroll)(event);
+      }
+    }
+  });
+  const fadeDistance = reducedMotion ? 0 : stickyFadeDistance;
+  const collapseProgress = (0, _reactNativeReanimated.useDerivedValue)(() => (0, _utils.getCollapseProgress)(scrollY.value, threshold.value));
+  const stickyProgress = (0, _reactNativeReanimated.useDerivedValue)(() => (0, _utils.getStickyProgress)(scrollY.value, threshold.value, fadeDistance));
+  const translateY = reducedMotion ? 0 : collapseTranslateY;
+  const collapseStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
+    const p = collapseProgress.value;
+    if (collapseAnimation) return collapseAnimation(p);
+    return {
+      opacity: 1 - p,
+      transform: [{
+        translateY: p * translateY
+      }]
+    };
+  });
+  const stickyStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
+    const p = stickyProgress.value;
+    if (stickyAnimation && !reducedMotion) return stickyAnimation(p);
+    return {
+      opacity: p
+    };
+  });
+  return {
+    scrollHandler: scrollHandler,
+    scrollY,
+    threshold,
+    navBarHeight,
+    collapseProgress,
+    stickyProgress,
+    collapseStyle,
+    stickyStyle,
+    isSticky,
+    onNavLayout,
+    updateScrollY,
+    topInset,
+    reducedMotion
+  };
+}
+//# sourceMappingURL=useStickyHeader.js.map

package/lib/commonjs/useStickyHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNativeReanimated","_reactNativeSafeAreaContext","_utils","DEFAULT_STICKY_FADE_DISTANCE","exports","DEFAULT_STICKY_POINTER_OFFSET","DEFAULT_COLLAPSE_TRANSLATE_Y","useStickyHeader","options","thresholdOffset","stickyFadeDistance","stickyPointerOffset","collapseTranslateY","collapseAnimation","stickyAnimation","respectSafeArea","topInset","topInsetOverride","reducedMotion","reducedMotionOverride","onStickyChange","onScroll","insets","useSafeAreaInsets","systemReducedMotion","useReducedMotion","top","scrollY","useSharedValue","navBarHeight","threshold","stickySV","isSticky","setIsSticky","useState","onStickyChangeRef","useRef","current","onScrollRef","hasJsOnScroll","notifySticky","useCallback","next","forwardScroll","event","nativeEvent","updateScrollY","y","value","isStickyAt","runOnJS","resyncSticky","measuredNavHeight","syncThreshold","computeThreshold","runOnUI","useEffect","onNavLayout","height","layout","scrollHandler","useAnimatedScrollHandler","contentOffset","fadeDistance","collapseProgress","useDerivedValue","getCollapseProgress","stickyProgress","getStickyProgress","translateY","collapseStyle","useAnimatedStyle","p","opacity","transform","stickyStyle"],"sourceRoot":"../../src","sources":["useStickyHeader.ts"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/utils.js

@@ -0,0 +1,90 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MAX_HEADER_ACTIONS = exports.DEFAULT_BADGE_MAX = void 0;
+exports.computeThreshold = computeThreshold;
+exports.formatBadgeCount = formatBadgeCount;
+exports.getCollapseProgress = getCollapseProgress;
+exports.getStickyProgress = getStickyProgress;
+exports.isImageSource = isImageSource;
+exports.isStickyAt = isStickyAt;
+exports.limitActions = limitActions;
+exports.warnActionOverflow = warnActionOverflow;
+var _react = require("react");
+/** Counts above this render as `"{max}+"` unless overridden. */
+const DEFAULT_BADGE_MAX = exports.DEFAULT_BADGE_MAX = 9;
+
+/** The most icon buttons a header bar renders. */
+const MAX_HEADER_ACTIONS = exports.MAX_HEADER_ACTIONS = 3;
+function clamp01(value) {
+  'worklet';
+
+  return value < 0 ? 0 : value > 1 ? 1 : value;
+}
+
+/**
+ * Scroll offset at which the header is considered collapsed:
+ * `topInset + navBarHeight + offset`. Returns 0 while the nav bar has not
+ * been measured, which keeps the sticky bar hidden.
+ */
+function computeThreshold(navBarHeight, topInset, offset = 0) {
+  'worklet';
+
+  if (!(navBarHeight > 0)) return 0;
+  return Math.max(1, topInset + navBarHeight + offset);
+}
+
+/** 0 at the top, 1 once `scrollY` reaches the threshold. */
+function getCollapseProgress(scrollY, threshold) {
+  'worklet';
+
+  if (threshold <= 0) return 0;
+  return clamp01(scrollY / threshold);
+}
+
+/**
+ * 0 before `threshold - fadeDistance`, 1 at the threshold. A fade distance
+ * of 0 makes the transition instant.
+ */
+function getStickyProgress(scrollY, threshold, fadeDistance) {
+  'worklet';
+
+  if (threshold <= 0) return 0;
+  if (fadeDistance <= 0) return scrollY >= threshold ? 1 : 0;
+  return clamp01((scrollY - (threshold - fadeDistance)) / fadeDistance);
+}
+
+/** Whether the sticky bar should receive touches / be read by screen readers. */
+function isStickyAt(scrollY, threshold, pointerOffset) {
+  'worklet';
+
+  return threshold > 0 && scrollY >= threshold - pointerOffset;
+}
+function isImageSource(value) {
+  if (typeof value === 'number') return true;
+  if (value === null || typeof value !== 'object' || /*#__PURE__*/(0, _react.isValidElement)(value)) {
+    return false;
+  }
+  if (Array.isArray(value)) return value.every(v => isImageSource(v));
+  return 'uri' in value || 'testUri' in value;
+}
+
+/** Drops hidden actions and keeps the first `MAX_HEADER_ACTIONS`. */
+function limitActions(actions) {
+  const visible = (actions ?? []).filter(a => !a.hidden);
+  return {
+    actions: visible.slice(0, MAX_HEADER_ACTIONS),
+    overflow: Math.max(0, visible.length - MAX_HEADER_ACTIONS)
+  };
+}
+function warnActionOverflow(overflow) {
+  if (__DEV__ && overflow > 0) {
+    console.warn(`[react-native-collapsible-sticky-header] ${MAX_HEADER_ACTIONS + overflow} visible actions were passed but at most ${MAX_HEADER_ACTIONS} are rendered. ` + `The last ${overflow} action(s) were dropped.`);
+  }
+}
+function formatBadgeCount(count, max) {
+  return count > max ? `${max}+` : String(count);
+}
+//# sourceMappingURL=utils.js.map

package/lib/commonjs/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","DEFAULT_BADGE_MAX","exports","MAX_HEADER_ACTIONS","clamp01","value","computeThreshold","navBarHeight","topInset","offset","Math","max","getCollapseProgress","scrollY","threshold","getStickyProgress","fadeDistance","isStickyAt","pointerOffset","isImageSource","isValidElement","Array","isArray","every","v","limitActions","actions","visible","filter","a","hidden","slice","overflow","length","warnActionOverflow","__DEV__","console","warn","formatBadgeCount","count","String"],"sourceRoot":"../../src","sources":["utils.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/Badge.js

@@ -0,0 +1,61 @@
+"use strict";
+
+import { memo } from 'react';
+import { StyleSheet, Text, View } from 'react-native';
+import { defaultTheme } from "./theme.js";
+import { DEFAULT_BADGE_MAX, formatBadgeCount } from "./utils.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const Badge = /*#__PURE__*/memo(function Badge({
+  count,
+  max = DEFAULT_BADGE_MAX,
+  color = defaultTheme.colors.badge,
+  textColor = defaultTheme.colors.badgeText,
+  borderColor = defaultTheme.colors.badgeBorder,
+  borderWidth = 1.5,
+  size = defaultTheme.badgeSize,
+  showZero = false,
+  style,
+  textStyle,
+  testID = 'sticky-header-badge'
+}) {
+  const whole = Math.floor(count);
+  if (!Number.isFinite(whole) || whole < 0 || whole === 0 && !showZero) {
+    return null;
+  }
+  return /*#__PURE__*/_jsx(View, {
+    testID: testID,
+    pointerEvents: "none",
+    importantForAccessibility: "no-hide-descendants",
+    accessibilityElementsHidden: true,
+    style: [styles.badge, {
+      backgroundColor: color,
+      borderColor,
+      borderWidth,
+      minWidth: size,
+      height: size,
+      borderRadius: size / 2
+    }, style],
+    children: /*#__PURE__*/_jsx(Text, {
+      numberOfLines: 1,
+      allowFontScaling: false,
+      style: [styles.text, {
+        color: textColor,
+        fontSize: Math.round(size * 0.55)
+      }, textStyle],
+      children: formatBadgeCount(whole, max)
+    })
+  });
+});
+const styles = StyleSheet.create({
+  badge: {
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingHorizontal: 4
+  },
+  text: {
+    fontWeight: '700',
+    includeFontPadding: false,
+    textAlign: 'center'
+  }
+});
+//# sourceMappingURL=Badge.js.map

package/lib/module/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["memo","StyleSheet","Text","View","defaultTheme","DEFAULT_BADGE_MAX","formatBadgeCount","jsx","_jsx","Badge","count","max","color","colors","badge","textColor","badgeText","borderColor","badgeBorder","borderWidth","size","badgeSize","showZero","style","textStyle","testID","whole","Math","floor","Number","isFinite","pointerEvents","importantForAccessibility","accessibilityElementsHidden","styles","backgroundColor","minWidth","height","borderRadius","children","numberOfLines","allowFontScaling","text","fontSize","round","create","alignItems","justifyContent","paddingHorizontal","fontWeight","includeFontPadding","textAlign"],"sourceRoot":"../../src","sources":["Badge.tsx"],"mappings":";;AAAA,SAASA,IAAI,QAAQ,OAAO;AAC5B,SACEC,UAAU,EACVC,IAAI,EACJC,IAAI,QAIC,cAAc;AACrB,SAASC,YAAY,QAAQ,YAAS;AACtC,SAASC,iBAAiB,EAAEC,gBAAgB,QAAQ,YAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAoB9D,OAAO,MAAMC,KAAK,gBAAGT,IAAI,CAAC,SAASS,KAAKA,CAAC;EACvCC,KAAK;EACLC,GAAG,GAAGN,iBAAiB;EACvBO,KAAK,GAAGR,YAAY,CAACS,MAAM,CAACC,KAAK;EACjCC,SAAS,GAAGX,YAAY,CAACS,MAAM,CAACG,SAAS;EACzCC,WAAW,GAAGb,YAAY,CAACS,MAAM,CAACK,WAAW;EAC7CC,WAAW,GAAG,GAAG;EACjBC,IAAI,GAAGhB,YAAY,CAACiB,SAAS;EAC7BC,QAAQ,GAAG,KAAK;EAChBC,KAAK;EACLC,SAAS;EACTC,MAAM,GAAG;AACC,CAAC,EAAE;EACb,MAAMC,KAAK,GAAGC,IAAI,CAACC,KAAK,CAAClB,KAAK,CAAC;EAC/B,IAAI,CAACmB,MAAM,CAACC,QAAQ,CAACJ,KAAK,CAAC,IAAIA,KAAK,GAAG,CAAC,IAAKA,KAAK,KAAK,CAAC,IAAI,CAACJ,QAAS,EAAE;IACtE,OAAO,IAAI;EACb;EACA,oBACEd,IAAA,CAACL,IAAI;IACHsB,MAAM,EAAEA,MAAO;IACfM,aAAa,EAAC,MAAM;IACpBC,yBAAyB,EAAC,qBAAqB;IAC/CC,2BAA2B;IAC3BV,KAAK,EAAE,CACLW,MAAM,CAACpB,KAAK,EACZ;MACEqB,eAAe,EAAEvB,KAAK;MACtBK,WAAW;MACXE,WAAW;MACXiB,QAAQ,EAAEhB,IAAI;MACdiB,MAAM,EAAEjB,IAAI;MACZkB,YAAY,EAAElB,IAAI,GAAG;IACvB,CAAC,EACDG,KAAK,CACL;IAAAgB,QAAA,eAEF/B,IAAA,CAACN,IAAI;MACHsC,aAAa,EAAE,CAAE;MACjBC,gBAAgB,EAAE,KAAM;MACxBlB,KAAK,EAAE,CACLW,MAAM,CAACQ,IAAI,EACX;QAAE9B,KAAK,EAAEG,SAAS;QAAE4B,QAAQ,EAAEhB,IAAI,CAACiB,KAAK,CAACxB,IAAI,GAAG,IAAI;MAAE,CAAC,EACvDI,SAAS,CACT;MAAAe,QAAA,EAEDjC,gBAAgB,CAACoB,KAAK,EAAEf,GAAG;IAAC,CACzB;EAAC,CACH,CAAC;AAEX,CAAC,CAAC;AAEF,MAAMuB,MAAM,GAAGjC,UAAU,CAAC4C,MAAM,CAAC;EAC/B/B,KAAK,EAAE;IACLgC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE,QAAQ;IACxBC,iBAAiB,EAAE;EACrB,CAAC;EACDN,IAAI,EAAE;IACJO,UAAU,EAAE,KAAK;IACjBC,kBAAkB,EAAE,KAAK;IACzBC,SAAS,EAAE;EACb;AACF,CAAC,CAAC","ignoreList":[]}