@amazon-devices/react-navigation__stack 8.0.9000000001 → 8.0.9000000002

package/lib/module/utils/gestureActivationCriteria.js

@@ -1,60 +0,0 @@
-"use strict";
-
-import { getInvertedMultiplier } from "./getInvertedMultiplier.js";
-
-/**
- * The distance of touch start from the edge of the screen where the gesture will be recognized
- */
-const GESTURE_RESPONSE_DISTANCE_HORIZONTAL = 50;
-const GESTURE_RESPONSE_DISTANCE_VERTICAL = 135;
-export const gestureActivationCriteria = ({
-  direction,
-  gestureDirection,
-  gestureResponseDistance,
-  layout
-}) => {
-  const enableTrackpadTwoFingerGesture = true;
-  const distance = gestureResponseDistance !== undefined ? gestureResponseDistance : gestureDirection === 'vertical' || gestureDirection === 'vertical-inverted' ? GESTURE_RESPONSE_DISTANCE_VERTICAL : GESTURE_RESPONSE_DISTANCE_HORIZONTAL;
-  if (gestureDirection === 'vertical') {
-    return {
-      maxDeltaX: 15,
-      minOffsetY: 5,
-      hitSlop: {
-        bottom: -layout.height + distance
-      },
-      enableTrackpadTwoFingerGesture
-    };
-  } else if (gestureDirection === 'vertical-inverted') {
-    return {
-      maxDeltaX: 15,
-      minOffsetY: -5,
-      hitSlop: {
-        top: -layout.height + distance
-      },
-      enableTrackpadTwoFingerGesture
-    };
-  } else {
-    const hitSlop = -layout.width + distance;
-    const invertedMultiplier = getInvertedMultiplier(gestureDirection, direction === 'rtl');
-    if (invertedMultiplier === 1) {
-      return {
-        minOffsetX: 5,
-        maxDeltaY: 20,
-        hitSlop: {
-          right: hitSlop
-        },
-        enableTrackpadTwoFingerGesture
-      };
-    } else {
-      return {
-        minOffsetX: -5,
-        maxDeltaY: 20,
-        hitSlop: {
-          left: hitSlop
-        },
-        enableTrackpadTwoFingerGesture
-      };
-    }
-  }
-};
-//# sourceMappingURL=gestureActivationCriteria.js.map

package/lib/module/utils/getDistanceForDirection.js

@@ -1,15 +0,0 @@
-"use strict";
-
-import { getInvertedMultiplier } from "./getInvertedMultiplier.js";
-export function getDistanceForDirection(layout, gestureDirection, isRTL) {
-  const multiplier = getInvertedMultiplier(gestureDirection, isRTL);
-  switch (gestureDirection) {
-    case 'vertical':
-    case 'vertical-inverted':
-      return layout.height * multiplier;
-    case 'horizontal':
-    case 'horizontal-inverted':
-      return layout.width * multiplier;
-  }
-}
-//# sourceMappingURL=getDistanceForDirection.js.map

package/lib/module/utils/getInvertedMultiplier.js

@@ -1,15 +0,0 @@
-"use strict";
-
-export function getInvertedMultiplier(gestureDirection, isRTL) {
-  switch (gestureDirection) {
-    case 'vertical':
-      return 1;
-    case 'vertical-inverted':
-      return -1;
-    case 'horizontal':
-      return isRTL ? -1 : 1;
-    case 'horizontal-inverted':
-      return isRTL ? 1 : -1;
-  }
-}
-//# sourceMappingURL=getInvertedMultiplier.js.map

package/lib/module/utils/getModalRoutesKeys.js

@@ -1,12 +0,0 @@
-"use strict";
-
-export const getModalRouteKeys = (routes, descriptors) => routes.reduce((acc, route) => {
-  const {
-    presentation
-  } = descriptors[route.key]?.options ?? {};
-  if (acc.length && !presentation || presentation === 'modal' || presentation === 'transparentModal') {
-    acc.push(route.key);
-  }
-  return acc;
-}, []);
-//# sourceMappingURL=getModalRoutesKeys.js.map

package/lib/module/utils/getShadowStyle.js

@@ -1,24 +0,0 @@
-"use strict";
-
-import Color from 'color';
-import { Platform } from 'react-native';
-export function getShadowStyle({
-  offset,
-  radius,
-  opacity,
-  color = '#000'
-}) {
-  const result = Platform.select({
-    web: {
-      boxShadow: `${offset.width}px ${offset.height}px ${radius}px ${Color(color).alpha(opacity).toString()}`
-    },
-    default: {
-      shadowOffset: offset,
-      shadowRadius: radius,
-      shadowColor: color,
-      shadowOpacity: opacity
-    }
-  });
-  return result;
-}
-//# sourceMappingURL=getShadowStyle.js.map

package/lib/module/utils/throttle.js

@@ -1,14 +0,0 @@
-"use strict";
-
-export function throttle(func, duration) {
-  let timeout;
-  return function (...args) {
-    if (timeout == null) {
-      func.apply(this, args);
-      timeout = setTimeout(() => {
-        timeout = undefined;
-      }, duration);
-    }
-  };
-}
-//# sourceMappingURL=throttle.js.map

package/lib/module/utils/useCardAnimation.js

@@ -1,12 +0,0 @@
-"use strict";
-
-import * as React from 'react';
-import { CardAnimationContext } from "./CardAnimationContext.js";
-export function useCardAnimation() {
-  const animation = React.useContext(CardAnimationContext);
-  if (animation === undefined) {
-    throw new Error("Couldn't find values for card animation. Are you inside a screen in Stack?");
-  }
-  return animation;
-}
-//# sourceMappingURL=useCardAnimation.js.map

package/lib/module/utils/useGestureHandlerRef.js

@@ -1,12 +0,0 @@
-"use strict";
-
-import * as React from 'react';
-import { GestureHandlerRefContext } from "./GestureHandlerRefContext.js";
-export function useGestureHandlerRef() {
-  const ref = React.useContext(GestureHandlerRefContext);
-  if (ref === undefined) {
-    throw new Error("Couldn't find a ref for gesture handler. Are you inside a screen in Stack?");
-  }
-  return ref;
-}
-//# sourceMappingURL=useGestureHandlerRef.js.map

package/lib/module/utils/useKeyboardManager.js

@@ -1,90 +0,0 @@
-"use strict";
-
-import * as React from 'react';
-import { Keyboard, TextInput } from 'react-native';
-export function useKeyboardManager(isEnabled) {
-  // Numeric id of the previously focused text input
-  // When a gesture didn't change the tab, we can restore the focused input with this
-  const previouslyFocusedTextInputRef = React.useRef(undefined);
-  const startTimestampRef = React.useRef(0);
-  const keyboardTimeoutRef = React.useRef(undefined);
-  const clearKeyboardTimeout = React.useCallback(() => {
-    if (keyboardTimeoutRef.current !== undefined) {
-      clearTimeout(keyboardTimeoutRef.current);
-      keyboardTimeoutRef.current = undefined;
-    }
-  }, []);
-  const onPageChangeStart = React.useCallback(() => {
-    if (!isEnabled()) {
-      return;
-    }
-    clearKeyboardTimeout();
-    const input = TextInput.State.currentlyFocusedInput();
-
-    // When a page change begins, blur the currently focused input
-    input?.blur();
-
-    // Store the id of this input so we can refocus it if change was cancelled
-    previouslyFocusedTextInputRef.current = input;
-
-    // Store timestamp for touch start
-    startTimestampRef.current = Date.now();
-  }, [clearKeyboardTimeout, isEnabled]);
-  const onPageChangeConfirm = React.useCallback(force => {
-    if (!isEnabled()) {
-      return;
-    }
-    clearKeyboardTimeout();
-    if (force) {
-      // Always dismiss input, even if we don't have a ref to it
-      // We might not have the ref if onPageChangeStart was never called
-      // This can happen if page change was not from a gesture
-      Keyboard.dismiss();
-    } else {
-      const input = previouslyFocusedTextInputRef.current;
-
-      // Dismiss the keyboard only if an input was a focused before
-      // This makes sure we don't dismiss input on going back and focusing an input
-      input?.blur();
-    }
-
-    // Cleanup the ID on successful page change
-    previouslyFocusedTextInputRef.current = undefined;
-  }, [clearKeyboardTimeout, isEnabled]);
-  const onPageChangeCancel = React.useCallback(() => {
-    if (!isEnabled()) {
-      return;
-    }
-    clearKeyboardTimeout();
-
-    // The page didn't change, we should restore the focus of text input
-    const input = previouslyFocusedTextInputRef.current;
-    if (input) {
-      // If the interaction was super short we should make sure keyboard won't hide again.
-
-      // Too fast input refocus will result only in keyboard flashing on screen and hiding right away.
-      // During first ~100ms keyboard will be dismissed no matter what,
-      // so we have to make sure it won't interrupt input refocus logic.
-      // That's why when the interaction is shorter than 100ms we add delay so it won't hide once again.
-      // Subtracting timestamps makes us sure the delay is executed only when needed.
-      if (Date.now() - startTimestampRef.current < 100) {
-        keyboardTimeoutRef.current = setTimeout(() => {
-          input?.focus();
-          previouslyFocusedTextInputRef.current = undefined;
-        }, 100);
-      } else {
-        input?.focus();
-        previouslyFocusedTextInputRef.current = undefined;
-      }
-    }
-  }, [clearKeyboardTimeout, isEnabled]);
-  React.useEffect(() => {
-    return () => clearKeyboardTimeout();
-  }, [clearKeyboardTimeout]);
-  return {
-    onPageChangeStart,
-    onPageChangeConfirm,
-    onPageChangeCancel
-  };
-}
-//# sourceMappingURL=useKeyboardManager.js.map

package/lib/module/views/GestureHandler.android.js

@@ -1,4 +0,0 @@
-"use strict";
-
-export * from "./GestureHandlerNative.js";
-//# sourceMappingURL=GestureHandler.android.js.map

package/lib/module/views/GestureHandler.ios.js

@@ -1,4 +0,0 @@
-"use strict";
-
-export * from "./GestureHandlerNative.js";
-//# sourceMappingURL=GestureHandler.ios.js.map

package/lib/module/views/GestureHandler.js

@@ -1,21 +0,0 @@
-"use strict";
-
-import * as React from 'react';
-import { View } from 'react-native';
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-const Dummy = ({
-  children
-}) => /*#__PURE__*/_jsx(_Fragment, {
-  children: children
-});
-export const PanGestureHandler = Dummy;
-export const GestureHandlerRootView = View;
-export const GestureState = {
-  UNDETERMINED: 0,
-  FAILED: 1,
-  BEGAN: 2,
-  CANCELLED: 3,
-  ACTIVE: 4,
-  END: 5
-};
-//# sourceMappingURL=GestureHandler.js.map

package/lib/module/views/GestureHandler.kepler.js

@@ -1,4 +0,0 @@
-"use strict";
-
-export * from "./GestureHandlerNative.js";
-//# sourceMappingURL=GestureHandler.kepler.js.map

package/lib/module/views/GestureHandlerNative.js

@@ -1,18 +0,0 @@
-"use strict";
-
-import * as React from 'react';
-import { PanGestureHandler as PanGestureHandlerNative } from '@amazon-devices/react-native-gesture-handler';
-import { GestureHandlerRefContext } from "../utils/GestureHandlerRefContext.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export function PanGestureHandler(props) {
-  const gestureRef = React.useRef(null);
-  return /*#__PURE__*/_jsx(GestureHandlerRefContext.Provider, {
-    value: gestureRef,
-    children: /*#__PURE__*/_jsx(PanGestureHandlerNative, {
-      ...props,
-      ref: gestureRef
-    })
-  });
-}
-export { GestureHandlerRootView, State as GestureState } from '@amazon-devices/react-native-gesture-handler';
-//# sourceMappingURL=GestureHandlerNative.js.map

package/lib/module/views/Header/Header.js

@@ -1,56 +0,0 @@
-"use strict";
-
-import { getHeaderTitle, HeaderShownContext } from '@amazon-devices/react-navigation__elements';
-import { StackActions } from '@amazon-devices/react-navigation__native';
-import * as React from 'react';
-import { useSafeAreaInsets } from '@amazon-devices/react-native-safe-area-context';
-import { ModalPresentationContext } from "../../utils/ModalPresentationContext.js";
-import { throttle } from "../../utils/throttle.js";
-import { HeaderSegment } from "./HeaderSegment.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Header = /*#__PURE__*/React.memo(function Header({
-  back,
-  layout,
-  progress,
-  options,
-  route,
-  navigation,
-  styleInterpolator
-}) {
-  const insets = useSafeAreaInsets();
-  let previousTitle;
-
-  // The label for the left back button shows the title of the previous screen
-  // If a custom label is specified, we use it, otherwise use previous screen's title
-  if (options.headerBackTitle !== undefined) {
-    previousTitle = options.headerBackTitle;
-  } else if (back) {
-    previousTitle = back.title;
-  }
-
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  const goBack = React.useCallback(throttle(() => {
-    if (navigation.isFocused() && navigation.canGoBack()) {
-      navigation.dispatch({
-        ...StackActions.pop(),
-        source: route.key
-      });
-    }
-  }, 50), [navigation, route.key]);
-  const isModal = React.useContext(ModalPresentationContext);
-  const isParentHeaderShown = React.useContext(HeaderShownContext);
-  const statusBarHeight = options.headerStatusBarHeight !== undefined ? options.headerStatusBarHeight : isModal || isParentHeaderShown ? 0 : insets.top;
-  return /*#__PURE__*/_jsx(HeaderSegment, {
-    ...options,
-    title: getHeaderTitle(options, route.name),
-    progress: progress,
-    layout: layout,
-    modal: isModal,
-    headerBackTitle: options.headerBackTitle !== undefined ? options.headerBackTitle : previousTitle,
-    headerStatusBarHeight: statusBarHeight,
-    onGoBack: back ? goBack : undefined,
-    backHref: back ? back.href : undefined,
-    styleInterpolator: styleInterpolator
-  });
-});
-//# sourceMappingURL=Header.js.map

package/lib/module/views/Header/HeaderContainer.js

@@ -1,128 +0,0 @@
-"use strict";
-
-import { getHeaderTitle, HeaderBackContext } from '@amazon-devices/react-navigation__elements';
-import { NavigationContext, NavigationRouteContext, useLinkBuilder } from '@amazon-devices/react-navigation__native';
-import * as React from 'react';
-import { StyleSheet, View } from 'react-native';
-import { forNoAnimation, forSlideLeft, forSlideRight, forSlideUp } from "../../TransitionConfigs/HeaderStyleInterpolators.js";
-import { Header } from "./Header.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export function HeaderContainer({
-  mode,
-  scenes,
-  layout,
-  getPreviousScene,
-  getFocusedRoute,
-  onContentHeightChange,
-  style
-}) {
-  const focusedRoute = getFocusedRoute();
-  const parentHeaderBack = React.useContext(HeaderBackContext);
-  const {
-    buildHref
-  } = useLinkBuilder();
-  return /*#__PURE__*/_jsx(View, {
-    pointerEvents: "box-none",
-    style: style,
-    children: scenes.slice(-2).map((scene, i, self) => {
-      if (mode === 'screen' && i !== self.length - 1 || !scene) {
-        return null;
-      }
-      const {
-        header,
-        headerMode,
-        headerShown = true,
-        headerTransparent,
-        headerStyleInterpolator
-      } = scene.descriptor.options;
-      if (headerMode !== mode || !headerShown) {
-        return null;
-      }
-      const isFocused = focusedRoute.key === scene.descriptor.route.key;
-      const previousScene = getPreviousScene({
-        route: scene.descriptor.route
-      });
-      let headerBack = parentHeaderBack;
-      if (previousScene) {
-        const {
-          options,
-          route
-        } = previousScene.descriptor;
-        headerBack = previousScene ? {
-          title: getHeaderTitle(options, route.name),
-          href: buildHref(route.name, route.params)
-        } : parentHeaderBack;
-      }
-
-      // If the screen is next to a headerless screen, we need to make the header appear static
-      // This makes the header look like it's moving with the screen
-      const previousDescriptor = self[i - 1]?.descriptor;
-      const nextDescriptor = self[i + 1]?.descriptor;
-      const {
-        headerShown: previousHeaderShown = true,
-        headerMode: previousHeaderMode
-      } = previousDescriptor?.options || {};
-
-      // If any of the next screens don't have a header or header is part of the screen
-      // Then we need to move this header offscreen so that it doesn't cover it
-      const nextHeaderlessScene = self.slice(i + 1).find(scene => {
-        const {
-          headerShown: currentHeaderShown = true,
-          headerMode: currentHeaderMode
-        } = scene?.descriptor.options || {};
-        return currentHeaderShown === false || currentHeaderMode === 'screen';
-      });
-      const {
-        gestureDirection: nextHeaderlessGestureDirection
-      } = nextHeaderlessScene?.descriptor.options || {};
-      const isHeaderStatic = (previousHeaderShown === false || previousHeaderMode === 'screen') &&
-      // We still need to animate when coming back from next scene
-      // A hacky way to check this is if the next scene exists
-      !nextDescriptor || nextHeaderlessScene;
-      const props = {
-        layout,
-        back: headerBack,
-        progress: scene.progress,
-        options: scene.descriptor.options,
-        route: scene.descriptor.route,
-        navigation: scene.descriptor.navigation,
-        styleInterpolator: mode === 'float' ? isHeaderStatic ? nextHeaderlessGestureDirection === 'vertical' || nextHeaderlessGestureDirection === 'vertical-inverted' ? forSlideUp : nextHeaderlessGestureDirection === 'horizontal-inverted' ? forSlideRight : forSlideLeft : headerStyleInterpolator : forNoAnimation
-      };
-      return /*#__PURE__*/_jsx(NavigationContext.Provider, {
-        value: scene.descriptor.navigation,
-        children: /*#__PURE__*/_jsx(NavigationRouteContext.Provider, {
-          value: scene.descriptor.route,
-          children: /*#__PURE__*/_jsx(View, {
-            onLayout: onContentHeightChange ? e => {
-              const {
-                height
-              } = e.nativeEvent.layout;
-              onContentHeightChange({
-                route: scene.descriptor.route,
-                height
-              });
-            } : undefined,
-            pointerEvents: isFocused ? 'box-none' : 'none',
-            "aria-hidden": !isFocused,
-            style:
-            // Avoid positioning the focused header absolutely
-            // Otherwise accessibility tools don't seem to be able to find it
-            mode === 'float' && !isFocused || headerTransparent ? styles.header : null,
-            children: header !== undefined ? header(props) : /*#__PURE__*/_jsx(Header, {
-              ...props
-            })
-          })
-        })
-      }, scene.descriptor.route.key);
-    })
-  });
-}
-const styles = StyleSheet.create({
-  header: {
-    position: 'absolute',
-    top: 0,
-    start: 0,
-    end: 0
-  }
-});
-//# sourceMappingURL=HeaderContainer.js.map

package/lib/module/views/Header/HeaderSegment.js

@@ -1,142 +0,0 @@
-"use strict";
-
-import { getDefaultHeaderHeight, Header, HeaderBackButton, HeaderTitle } from '@amazon-devices/react-navigation__elements';
-import { useLocale } from '@amazon-devices/react-navigation__native';
-import * as React from 'react';
-import { Platform, StyleSheet } from 'react-native';
-import { jsx as _jsx } from "react/jsx-runtime";
-export function HeaderSegment(props) {
-  const {
-    direction
-  } = useLocale();
-  const [leftLabelLayout, setLeftLabelLayout] = React.useState(undefined);
-  const [titleLayout, setTitleLayout] = React.useState(undefined);
-  const handleTitleLayout = e => {
-    const {
-      height,
-      width
-    } = e.nativeEvent.layout;
-    setTitleLayout(titleLayout => {
-      if (titleLayout && height === titleLayout.height && width === titleLayout.width) {
-        return titleLayout;
-      }
-      return {
-        height,
-        width
-      };
-    });
-  };
-  const handleLeftLabelLayout = e => {
-    const {
-      height,
-      width
-    } = e.nativeEvent.layout;
-    if (leftLabelLayout && height === leftLabelLayout.height && width === leftLabelLayout.width) {
-      return;
-    }
-    setLeftLabelLayout({
-      height,
-      width
-    });
-  };
-  const {
-    progress,
-    layout,
-    modal,
-    onGoBack,
-    backHref,
-    headerTitle: title,
-    headerLeft: left = onGoBack ? props => /*#__PURE__*/_jsx(HeaderBackButton, {
-      ...props
-    }) : undefined,
-    headerRight: right,
-    headerBackImage,
-    headerBackTitle,
-    headerBackButtonDisplayMode = Platform.OS === 'ios' ? 'default' : 'minimal',
-    headerBackTruncatedTitle,
-    headerBackAccessibilityLabel,
-    headerBackTestID,
-    headerBackAllowFontScaling,
-    headerBackTitleStyle,
-    headerTitleContainerStyle,
-    headerLeftContainerStyle,
-    headerRightContainerStyle,
-    headerBackgroundContainerStyle,
-    headerStyle: customHeaderStyle,
-    headerStatusBarHeight,
-    styleInterpolator,
-    ...rest
-  } = props;
-  const defaultHeight = getDefaultHeaderHeight(layout, modal, headerStatusBarHeight);
-  const {
-    height = defaultHeight
-  } = StyleSheet.flatten(customHeaderStyle || {});
-  const headerHeight = typeof height === 'number' ? height : defaultHeight;
-  const {
-    titleStyle,
-    leftButtonStyle,
-    leftLabelStyle,
-    rightButtonStyle,
-    backgroundStyle
-  } = React.useMemo(() => styleInterpolator({
-    current: {
-      progress: progress.current
-    },
-    next: progress.next && {
-      progress: progress.next
-    },
-    direction,
-    layouts: {
-      header: {
-        height: headerHeight,
-        width: layout.width
-      },
-      screen: layout,
-      title: titleLayout,
-      leftLabel: leftLabelLayout
-    }
-  }), [styleInterpolator, progress, direction, headerHeight, layout, titleLayout, leftLabelLayout]);
-  const headerLeft = left ? props => left({
-    ...props,
-    href: backHref,
-    backImage: headerBackImage,
-    accessibilityLabel: headerBackAccessibilityLabel,
-    testID: headerBackTestID,
-    allowFontScaling: headerBackAllowFontScaling,
-    onPress: onGoBack,
-    label: headerBackTitle,
-    truncatedLabel: headerBackTruncatedTitle,
-    labelStyle: [leftLabelStyle, headerBackTitleStyle],
-    onLabelLayout: handleLeftLabelLayout,
-    screenLayout: layout,
-    titleLayout,
-    canGoBack: Boolean(onGoBack)
-  }) : undefined;
-  const headerRight = right ? props => right({
-    ...props,
-    canGoBack: Boolean(onGoBack)
-  }) : undefined;
-  const headerTitle = typeof title !== 'function' ? props => /*#__PURE__*/_jsx(HeaderTitle, {
-    ...props,
-    onLayout: handleTitleLayout
-  }) : props => title({
-    ...props,
-    onLayout: handleTitleLayout
-  });
-  return /*#__PURE__*/_jsx(Header, {
-    modal: modal,
-    layout: layout,
-    headerTitle: headerTitle,
-    headerLeft: headerLeft,
-    headerRight: headerRight,
-    headerTitleContainerStyle: [titleStyle, headerTitleContainerStyle],
-    headerLeftContainerStyle: [leftButtonStyle, headerLeftContainerStyle],
-    headerRightContainerStyle: [rightButtonStyle, headerRightContainerStyle],
-    headerBackButtonDisplayMode: headerBackButtonDisplayMode,
-    headerBackgroundContainerStyle: [backgroundStyle, headerBackgroundContainerStyle],
-    headerStyle: customHeaderStyle,
-    headerStatusBarHeight: headerStatusBarHeight,
-    ...rest
-  });
-}
-//# sourceMappingURL=HeaderSegment.js.map