@react-navigation/elements 3.0.0-alpha.3 → 3.0.0-alpha.31

package/lib/module/ActivityView.js

@@ -0,0 +1,90 @@
+"use strict";
+
+import { Activity, useCallback, useEffect, useState } from 'react';
+import { Platform } from 'react-native';
+import { Container } from "./Container.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export function ActivityView({
+  mode,
+  visible,
+  delay = 500,
+  style,
+  children
+}) {
+  const [delayedMode, setDelayedMode] = useState(mode);
+  useEffect(() => {
+    if (!delay) {
+      return;
+    }
+    const timer = setTimeout(() => {
+      setDelayedMode(mode);
+    }, delay);
+    return () => clearTimeout(timer);
+  }, [delay, mode]);
+  const display = visible ? 'flex' : 'none';
+  const activityMode = mode !== 'paused' || delay && delayedMode !== 'paused' ? 'visible' : 'hidden';
+
+  /**
+   * Activity has 2 modes, visible and hidden - hidden unmounts effects
+   * But what we want is to unmount effects, without hiding content
+   * So we use hidden mode, but unset display: none to make content visible
+   */
+  const onRef = useCallback(node => {
+    if (Platform.OS !== 'web' || !(node && node instanceof HTMLElement)) {
+      return;
+    }
+    const observers = [];
+    const observe = () => {
+      // Remove previous observers
+      observers.forEach(o => o.disconnect());
+      observers.length = 0;
+      const children = node.childNodes;
+
+      // When the style attribute for children is updated by React
+      // We observe it and update display to make content visible
+      children.forEach(child => {
+        if (child instanceof HTMLElement) {
+          child.style.display = display;
+          const o = new MutationObserver(() => {
+            child.style.display = display;
+          });
+          o.observe(child, {
+            attributes: true,
+            attributeFilter: ['style']
+          });
+          observers.push(o);
+        }
+      });
+    };
+    observe();
+
+    // React removes refs when `Activity` is hidden
+    // So we render outside of the `Activity` and observer child list
+    const observer = new MutationObserver(observe);
+    observer.observe(node, {
+      childList: true
+    });
+    return () => {
+      observer.disconnect();
+      observers.forEach(o => o.disconnect());
+    };
+  }, [display]);
+  return /*#__PURE__*/_jsx(Container, {
+    ref: onRef,
+    style: {
+      display: 'contents'
+    },
+    children: /*#__PURE__*/_jsx(Activity, {
+      mode: activityMode,
+      children: /*#__PURE__*/_jsx(Container, {
+        inert: mode !== 'normal',
+        style: {
+          ...style,
+          display
+        },
+        children: children
+      })
+    })
+  });
+}
+//# sourceMappingURL=ActivityView.js.map

package/lib/module/ActivityView.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Activity","useCallback","useEffect","useState","Platform","Container","jsx","_jsx","ActivityView","mode","visible","delay","style","children","delayedMode","setDelayedMode","timer","setTimeout","clearTimeout","display","activityMode","onRef","node","OS","HTMLElement","observers","observe","forEach","o","disconnect","length","childNodes","child","MutationObserver","attributes","attributeFilter","push","observer","childList","ref","inert"],"sourceRoot":"../../src","sources":["ActivityView.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/ActivityView.native.js

@@ -0,0 +1,67 @@
+"use strict";
+
+import { Activity, useEffect, useState } from 'react';
+import { NativeComponentRegistry } from 'react-native';
+
+// eslint-disable-next-line import-x/extensions
+
+import { Container } from "./Container.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export function ActivityView({
+  mode,
+  visible,
+  delay = 500,
+  style,
+  children
+}) {
+  const [delayedMode, setDelayedMode] = useState(mode);
+  useEffect(() => {
+    if (!delay) {
+      return;
+    }
+    const timer = setTimeout(() => {
+      setDelayedMode(mode);
+    }, delay);
+    return () => clearTimeout(timer);
+  }, [delay, mode]);
+  const display = visible ? 'flex' : 'none';
+  const activityMode = mode !== 'paused' || delay && delayedMode !== 'paused' ? 'visible' : 'hidden';
+  return /*#__PURE__*/_jsx(Activity, {
+    mode: activityMode,
+    children: /*#__PURE__*/_jsx(ActivityContentView, {
+      style: {
+        display: 'contents'
+      },
+      children: /*#__PURE__*/_jsx(Container, {
+        inert: mode !== 'normal',
+        style: {
+          ...style,
+          /**
+           * The visibility of the nested view is controlled by `Activity`
+           * It'll be overridden to `display: 'none'` when `mode="hidden"` regardless of what we set
+           * So we set the visibility on another view instead
+           */
+          display
+        },
+        children: children
+      })
+    })
+  });
+}
+const STYLE = {
+  display: {
+    /**
+     * React `Activity` sets `display: 'none'` when `mode="hidden"` to unmount effects
+     * But we want to keep the content visible, so we switch it to `display: 'contents'`
+     */
+    process: () => 'contents'
+  }
+};
+const VIEW_CONFIG = {
+  uiViewClassName: 'RCTView',
+  validAttributes: {
+    style: STYLE
+  }
+};
+const ActivityContentView = NativeComponentRegistry.get('ReactNavigationActivityContentView', () => VIEW_CONFIG);
+//# sourceMappingURL=ActivityView.native.js.map

package/lib/module/ActivityView.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Activity","useEffect","useState","NativeComponentRegistry","Container","jsx","_jsx","ActivityView","mode","visible","delay","style","children","delayedMode","setDelayedMode","timer","setTimeout","clearTimeout","display","activityMode","ActivityContentView","inert","STYLE","process","VIEW_CONFIG","uiViewClassName","validAttributes","get"],"sourceRoot":"../../src","sources":["ActivityView.native.tsx"],"mappings":";;AAAA,SAASA,QAAQ,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AACrD,SAEEC,uBAAuB,QAElB,cAAc;;AAErB;;AAEA,SAASC,SAAS,QAAQ,gBAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAExC,OAAO,SAASC,YAAYA,CAAC;EAC3BC,IAAI;EACJC,OAAO;EACPC,KAAK,GAAG,GAAG;EACXC,KAAK;EACLC;AACK,CAAC,EAAE;EACR,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGZ,QAAQ,CAACM,IAAI,CAAC;EAEpDP,SAAS,CAAC,MAAM;IACd,IAAI,CAACS,KAAK,EAAE;MACV;IACF;IAEA,MAAMK,KAAK,GAAGC,UAAU,CAAC,MAAM;MAC7BF,cAAc,CAACN,IAAI,CAAC;IACtB,CAAC,EAAEE,KAAK,CAAC;IAET,OAAO,MAAMO,YAAY,CAACF,KAAK,CAAC;EAClC,CAAC,EAAE,CAACL,KAAK,EAAEF,IAAI,CAAC,CAAC;EAEjB,MAAMU,OAAO,GAAGT,OAAO,GAAG,MAAM,GAAG,MAAM;EACzC,MAAMU,YAAY,GAChBX,IAAI,KAAK,QAAQ,IAAKE,KAAK,IAAIG,WAAW,KAAK,QAAS,GACpD,SAAS,GACT,QAAQ;EAEd,oBACEP,IAAA,CAACN,QAAQ;IAACQ,IAAI,EAAEW,YAAa;IAAAP,QAAA,eAC3BN,IAAA,CAACc,mBAAmB;MAACT,KAAK,EAAE;QAAEO,OAAO,EAAE;MAAW,CAAE;MAAAN,QAAA,eAClDN,IAAA,CAACF,SAAS;QACRiB,KAAK,EAAEb,IAAI,KAAK,QAAS;QACzBG,KAAK,EAAE;UACL,GAAGA,KAAK;UACR;AACZ;AACA;AACA;AACA;UACYO;QACF,CAAE;QAAAN,QAAA,EAEDA;MAAQ,CACA;IAAC,CACO;EAAC,CACd,CAAC;AAEf;AAEA,MAAMU,KAA8D,GAAG;EACrEJ,OAAO,EAAE;IACP;AACJ;AACA;AACA;IACIK,OAAO,EAAEA,CAAA,KAAM;EACjB;AACF,CAAC;AAED,MAAMC,WAAW,GAAG;EAClBC,eAAe,EAAE,SAAS;EAC1BC,eAAe,EAAE;IACff,KAAK,EAAEW;EACT;AACF,CAAC;AAUD,MAAMF,mBAA4D,GAChEjB,uBAAuB,CAACwB,GAAG,CACzB,oCAAoC,EACpC,MAAMH,WACR,CAAC","ignoreList":[]}

package/lib/module/Badge.js

@@ -23,18 +23,19 @@ export function Badge({
     if (!rendered) {
       return;
     }
-    Animated.timing(opacity, {
+    const animation = Animated.timing(opacity, {
       toValue: visible ? 1 : 0,
       duration: 150,
       useNativeDriver
-    }).start(({
+    });
+    animation.start(({
       finished
     }) => {
       if (finished && !visible) {
         setRendered(false);
       }
     });
-    return () => opacity.stopAnimation();
+    return () => animation.stop();
   }, [opacity, rendered, visible]);
   if (!rendered) {
     if (visible) {
@@ -49,7 +50,7 @@ export function Badge({
     backgroundColor = colors.notification,
     ...restStyle
   } = StyleSheet.flatten(style) || {};
-  const textColor = Color(backgroundColor)?.isLight() ? 'black' : 'white';
+  const textColor = Color.foreground(backgroundColor);
   const borderRadius = size / 2;
   const fontSize = Math.floor(size * 3 / 4);
   return /*#__PURE__*/_jsx(Animated.Text, {

package/lib/module/Badge.js.map

@@ -1 +1 @@
-{"version":3,"names":["useTheme","React","Animated","Platform","StyleSheet","Color","jsx","_jsx","useNativeDriver","OS","Badge","children","style","visible","size","rest","opacity","useState","Value","rendered","setRendered","colors","fonts","useEffect","timing","toValue","duration","start","finished","stopAnimation","backgroundColor","notification","restStyle","flatten","textColor","isLight","borderRadius","fontSize","Math","floor","Text","numberOfLines","transform","scale","interpolate","inputRange","outputRange","color","lineHeight","height","minWidth","borderCurve","regular","styles","container","create","alignSelf","textAlign","paddingHorizontal","overflow"],"sourceRoot":"../../src","sources":["Badge.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useTheme","React","Animated","Platform","StyleSheet","Color","jsx","_jsx","useNativeDriver","OS","Badge","children","style","visible","size","rest","opacity","useState","Value","rendered","setRendered","colors","fonts","useEffect","animation","timing","toValue","duration","start","finished","stop","backgroundColor","notification","restStyle","flatten","textColor","foreground","borderRadius","fontSize","Math","floor","Text","numberOfLines","transform","scale","interpolate","inputRange","outputRange","color","lineHeight","height","minWidth","borderCurve","regular","styles","container","create","alignSelf","textAlign","paddingHorizontal","overflow"],"sourceRoot":"../../src","sources":["Badge.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/Button.js

@@ -1,13 +1,14 @@
 "use strict";
 
-import { useLinkProps, useTheme } from '@react-navigation/native';
+import { MaterialSymbol, SFSymbol, useLinkProps, useTheme } from '@react-navigation/native';
 import * as React from 'react';
-import { Platform, StyleSheet } from 'react-native';
+import { Image, Platform, StyleSheet, View } from 'react-native';
 import { Color } from "./Color.js";
 import { PlatformPressable } from "./PlatformPressable.js";
 import { Text } from "./Text.js";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const BUTTON_RADIUS = 40;
+const ICON_SIZE = 14;
 export function Button(props) {
   if ('screen' in props || 'action' in props) {
     // @ts-expect-error: This is already type-checked by the prop types
@@ -25,6 +26,7 @@ function ButtonLink({
   params,
   action,
   href,
+  onPress,
   ...rest
 }) {
   // @ts-expect-error: This is already type-checked by the prop types
@@ -36,13 +38,19 @@ function ButtonLink({
   });
   return /*#__PURE__*/_jsx(ButtonBase, {
     ...rest,
-    ...props
+    ...props,
+    onPress: e => {
+      onPress?.(e);
+      props.onPress?.(e);
+    }
   });
 }
 function ButtonBase({
   variant = 'tinted',
   color: customColor,
+  icon,
   android_ripple,
+  disabled,
   style,
   children,
   ...rest
@@ -66,14 +74,23 @@ function ButtonBase({
       break;
     case 'filled':
       backgroundColor = color;
-      textColor = Color(color)?.isDark() ? 'white' : Color(color)?.darken(0.71).string() ?? '#fff';
+      textColor = Color.foreground(backgroundColor);
       break;
   }
+  if (disabled) {
+    textColor = dark ? 'rgba(235, 235, 245, 0.3)' : 'rgba(60, 60, 67, 0.3)';
+    if (variant !== 'plain') {
+      backgroundColor = dark ? 'rgba(118, 118, 128, 0.24)' : 'rgba(118, 118, 128, 0.12)';
+    }
+  }
+  const rippleColor = Color(textColor)?.fade(0.88).string() ?? (variant === 'filled' || dark ? 'rgba(255, 255, 255, 0.12)' : 'rgba(0, 0, 0, 0.12)');
+  const iconNode = renderIcon(icon, textColor, ICON_SIZE);
   return /*#__PURE__*/_jsx(PlatformPressable, {
     ...rest,
+    disabled: disabled,
     android_ripple: {
-      radius: BUTTON_RADIUS,
-      color: Color(textColor)?.fade(0.85).string() ?? 'rgba(0, 0, 0, 0.1)',
+      foreground: true,
+      color: rippleColor,
       ...android_ripple
     },
     pressOpacity: Platform.OS === 'ios' ? undefined : 1,
@@ -83,20 +100,81 @@ function ButtonBase({
     style: [{
       backgroundColor
     }, styles.button, style],
-    children: /*#__PURE__*/_jsx(Text, {
-      style: [{
-        color: textColor
-      }, fonts.regular, styles.text],
-      children: children
+    children: /*#__PURE__*/_jsxs(View, {
+      style: styles.content,
+      children: [iconNode && /*#__PURE__*/_jsx(View, {
+        style: styles.icon,
+        children: iconNode
+      }), /*#__PURE__*/_jsx(Text, {
+        style: [{
+          color: textColor
+        }, fonts.regular, styles.text],
+        children: children
+      })]
     })
   });
 }
+function renderIcon(icon, color, size) {
+  if (!icon) {
+    return null;
+  }
+  const iconValue = typeof icon === 'function' ? icon({
+    color,
+    size
+  }) : icon;
+  if (/*#__PURE__*/React.isValidElement(iconValue)) {
+    return iconValue;
+  }
+  if (typeof iconValue === 'object' && iconValue != null && 'type' in iconValue) {
+    switch (iconValue.type) {
+      case 'image':
+        return /*#__PURE__*/_jsx(Image, {
+          source: iconValue.source,
+          style: {
+            width: size,
+            height: size,
+            tintColor: iconValue.tinted === false ? undefined : color
+          }
+        });
+      case 'sfSymbol':
+        return /*#__PURE__*/_jsx(SFSymbol, {
+          name: iconValue.name,
+          size: size,
+          color: color
+        });
+      case 'materialSymbol':
+        return /*#__PURE__*/_jsx(MaterialSymbol, {
+          name: iconValue.name,
+          variant: iconValue.variant,
+          weight: iconValue.weight,
+          size: size,
+          color: color
+        });
+      default:
+        {
+          const _exhaustiveCheck = iconValue;
+          return _exhaustiveCheck;
+        }
+    }
+  }
+  return null;
+}
 const styles = StyleSheet.create({
   button: {
     paddingHorizontal: 24,
     paddingVertical: 10,
     borderRadius: BUTTON_RADIUS,
-    borderCurve: 'continuous'
+    borderCurve: 'continuous',
+    overflow: 'hidden'
+  },
+  content: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    gap: 8
+  },
+  icon: {
+    marginLeft: -6
   },
   text: {
     fontSize: 14,

package/lib/module/Button.js.map

@@ -1 +1 @@
-{"version":3,"names":["useLinkProps","useTheme","React","Platform","StyleSheet","Color","PlatformPressable","Text","jsx","_jsx","BUTTON_RADIUS","Button","props","ButtonLink","ButtonBase","screen","params","action","href","rest","variant","color","customColor","android_ripple","style","children","dark","colors","fonts","primary","backgroundColor","textColor","fade","string","isDark","darken","radius","pressOpacity","OS","undefined","hoverEffect","styles","button","regular","text","create","paddingHorizontal","paddingVertical","borderRadius","borderCurve","fontSize","lineHeight","letterSpacing","textAlign"],"sourceRoot":"../../src","sources":["Button.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["MaterialSymbol","SFSymbol","useLinkProps","useTheme","React","Image","Platform","StyleSheet","View","Color","PlatformPressable","Text","jsx","_jsx","jsxs","_jsxs","BUTTON_RADIUS","ICON_SIZE","Button","props","ButtonLink","ButtonBase","screen","params","action","href","onPress","rest","e","variant","color","customColor","icon","android_ripple","disabled","style","children","dark","colors","fonts","primary","backgroundColor","textColor","fade","string","foreground","rippleColor","iconNode","renderIcon","pressOpacity","OS","undefined","hoverEffect","styles","button","content","regular","text","size","iconValue","isValidElement","type","source","width","height","tintColor","tinted","name","weight","_exhaustiveCheck","create","paddingHorizontal","paddingVertical","borderRadius","borderCurve","overflow","flexDirection","alignItems","justifyContent","gap","marginLeft","fontSize","lineHeight","letterSpacing","textAlign"],"sourceRoot":"../../src","sources":["Button.tsx"],"mappings":"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","ignoreList":[]}