xref: /expo/packages/expo/build/environment/DevLoadingView.js.map (revision 1d47c8ea)

{"version":3,"file":"DevLoadingView.js","sourceRoot":"","sources":["../../src/environment/DevLoadingView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAE1E,OAAO,0BAA0B,MAAM,8BAA8B,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,MAAM,CAAC,OAAO,UAAU,cAAc;IACpC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,eAAe,CAAC,CAAC;IACxD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IACzD,MAAM,OAAO,GAAG,OAAO,CAAe,GAAG,EAAE;QACzC,IAAI;YACF,OAAO,IAAI,YAAY,CAAC,0BAA0B,CAAC,CAAC;SACrD;QAAC,OAAO,KAAK,EAAE;YACd,MAAM,IAAI,KAAK,CACb,oHAAoH;gBAClH,KAAK,CAAC,OAAO,CAChB,CAAC;SACH;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,SAAS,iBAAiB,CAAC,KAA0B;YACnD,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;YAC1B,sEAAsE;YACtE,oEAAoE;YACpE,cAAc;YAEd,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;YACvB,eAAe,CAAC,IAAI,CAAC,CAAC;QACxB,CAAC;QAED,SAAS,UAAU;YACjB,wEAAwE;YACxE,qCAAqC;YAErC,cAAc,CAAC,IAAI,CAAC,CAAC;YACrB,eAAe,CAAC,KAAK,CAAC,CAAC;YACvB,QAAQ,CAAC,MAAM,CAAC,UAAU,EAAE;gBAC1B,OAAO,EAAE,GAAG;gBACZ,KAAK,EAAE,IAAI;gBACX,QAAQ,EAAE,GAAG;gBACb,eAAe,EAAE,QAAQ,CAAC,EAAE,KAAK,KAAK;aACvC,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;gBACxB,IAAI,QAAQ,EAAE;oBACZ,cAAc,CAAC,KAAK,CAAC,CAAC;oBACtB,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;iBACxB;YACH,CAAC,CAAC,CAAC;QACL,CAAC;QAED,MAAM,uBAAuB,GAAG,OAAO,CAAC,WAAW,CACjD,4BAA4B,EAC5B,iBAAiB,CAClB,CAAC;QACF,MAAM,gBAAgB,GAAG,OAAO,CAAC,WAAW,CAAC,qBAAqB,EAAE,UAAU,CAAC,CAAC;QAEhF,OAAO,SAAS,OAAO;YACrB,uBAAuB,CAAC,MAAM,EAAE,CAAC;YACjC,gBAAgB,CAAC,MAAM,EAAE,CAAC;QAC5B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;IAE1B,IAAI,CAAC,YAAY,IAAI,CAAC,WAAW,EAAE;QACjC,OAAO,IAAI,CAAC;KACb;IAED,OAAO,CACL,oBAAC,QAAQ,CAAC,IAAI,IACZ,KAAK,EAAE,CAAC,MAAM,CAAC,iBAAiB,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,EAClE,aAAa,EAAC,MAAM;QACpB,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,MAAM;YACxB,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,gBAAgB;gBAClC,oBAAC,IAAI,IAAC,KAAK,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE;oBACnC,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,IAAI,IAAG,OAAO,CAAQ,CACrC;gBAEP,oBAAC,IAAI,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE;oBACtB,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,QAAQ,IACzB,YAAY,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,wCAAwC,CAC1E,CACF,CACF,CACF,CACO,CACjB,CAAC;AACJ,CAAC;AAED,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,iBAAiB,EAAE;QACjB,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,CAAC;QACT,IAAI,EAAE,CAAC;QACP,KAAK,EAAE,CAAC;QACR,MAAM,EAAE,EAAE,EAAE,YAAY;KACzB;IAED,MAAM,EAAE;QACN,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,SAAS;QACnB,eAAe,EAAE,kBAAkB;QACnC,aAAa,EAAE,kBAAkB,EAAE,CAAC,MAAM;KAC3C;IACD,gBAAgB,EAAE;QAChB,IAAI,EAAE,CAAC;QACP,UAAU,EAAE,EAAE;QACd,aAAa,EAAE,CAAC;QAChB,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,SAAS,EAAE,QAAQ;KACpB;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,QAAQ,EAAE,EAAE;KACb;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,uBAAuB;KAC/B;CACF,CAAC,CAAC","sourcesContent":["import { EventEmitter } from 'expo-modules-core';\nimport React, { useEffect, useState, useRef, useMemo } from 'react';\nimport { Animated, StyleSheet, Text, Platform, View } from 'react-native';\n\nimport DevLoadingViewNativeModule from './DevLoadingViewNativeModule';\nimport { getInitialSafeArea } from './getInitialSafeArea';\n\nexport default function DevLoadingView() {\n  const [message, setMessage] = useState('Refreshing...');\n  const [isDevLoading, setIsDevLoading] = useState(false);\n  const [isAnimating, setIsAnimating] = useState(false);\n  const translateY = useRef(new Animated.Value(0)).current;\n  const emitter = useMemo<EventEmitter>(() => {\n    try {\n      return new EventEmitter(DevLoadingViewNativeModule);\n    } catch (error) {\n      throw new Error(\n        'Failed to instantiate native emitter in `DevLoadingView` because the native module `DevLoadingView` is undefined: ' +\n          error.message\n      );\n    }\n  }, []);\n\n  useEffect(() => {\n    if (!emitter) return;\n\n    function handleShowMessage(event: { message: string }) {\n      setMessage(event.message);\n      // TODO: if we show the refreshing banner and don't get a hide message\n      // for 3 seconds, warn the user that it's taking a while and suggest\n      // they reload\n\n      translateY.setValue(0);\n      setIsDevLoading(true);\n    }\n\n    function handleHide() {\n      // TODO: if we showed the 'refreshing' banner less than 250ms ago, delay\n      // switching to the 'finished' banner\n\n      setIsAnimating(true);\n      setIsDevLoading(false);\n      Animated.timing(translateY, {\n        toValue: 150,\n        delay: 1000,\n        duration: 350,\n        useNativeDriver: Platform.OS !== 'web',\n      }).start(({ finished }) => {\n        if (finished) {\n          setIsAnimating(false);\n          translateY.setValue(0);\n        }\n      });\n    }\n\n    const showMessageSubscription = emitter.addListener(\n      'devLoadingView:showMessage',\n      handleShowMessage\n    );\n    const hideSubscription = emitter.addListener('devLoadingView:hide', handleHide);\n\n    return function cleanup() {\n      showMessageSubscription.remove();\n      hideSubscription.remove();\n    };\n  }, [translateY, emitter]);\n\n  if (!isDevLoading && !isAnimating) {\n    return null;\n  }\n\n  return (\n    <Animated.View\n      style={[styles.animatedContainer, { transform: [{ translateY }] }]}\n      pointerEvents=\"none\">\n      <View style={styles.banner}>\n        <View style={styles.contentContainer}>\n          <View style={{ flexDirection: 'row' }}>\n            <Text style={styles.text}>{message}</Text>\n          </View>\n\n          <View style={{ flex: 1 }}>\n            <Text style={styles.subtitle}>\n              {isDevLoading ? 'Using Fast Refresh' : \"Don't see your changes? Reload the app\"}\n            </Text>\n          </View>\n        </View>\n      </View>\n    </Animated.View>\n  );\n}\n\nconst styles = StyleSheet.create({\n  animatedContainer: {\n    position: 'absolute',\n    bottom: 0,\n    left: 0,\n    right: 0,\n    zIndex: 42, // arbitrary\n  },\n\n  banner: {\n    flex: 1,\n    overflow: 'visible',\n    backgroundColor: 'rgba(0,0,0,0.75)',\n    paddingBottom: getInitialSafeArea().bottom,\n  },\n  contentContainer: {\n    flex: 1,\n    paddingTop: 10,\n    paddingBottom: 5,\n    alignItems: 'center',\n    justifyContent: 'center',\n    textAlign: 'center',\n  },\n  text: {\n    color: '#fff',\n    fontSize: 15,\n  },\n  subtitle: {\n    color: 'rgba(255,255,255,0.8)',\n  },\n});\n"]}