UNPKG

one

Version:

One is a React framework for web, iOS, and Android apps.

77 lines (74 loc) • 2.11 kB
import { jsx } from "react/jsx-runtime"; import { useEffect, useState } from "react"; import { View } from "react-native"; import { router } from "../router/imperative-api.native.js"; var LoadProgressBar = function LoadProgressBar2(param) { var { startDelay = 500, finishDelay = 50, initialPercent = 20, updateInterval = 300, sporadicness = 3, ...props } = param; var [loaded, setLoaded] = useState(0); var [width, setWidth] = useState(0); useEffect(function() { var loadInterval; var dispose = router.onLoadState(function(state) { clearTimeout(loadInterval); switch (state) { case "loading": { loadInterval = setTimeout(function() { setLoaded(initialPercent); var intervalCount = 0; loadInterval = setInterval(function() { intervalCount++; if (intervalCount % sporadicness === 0) { return; } setLoaded(function(prev) { var increment = (100 - prev) * (prev > 80 ? .05 : .1) * Math.random(); return Math.min(prev + increment, 100); }); }, updateInterval); }, startDelay); break; } case "loaded": { setLoaded(100); clearInterval(loadInterval); setTimeout(function() { setLoaded(0); }, finishDelay); break; } } }); return function() { dispose(); clearInterval(loadInterval); }; }, [ finishDelay, initialPercent, sporadicness, startDelay, updateInterval ]); return /* @__PURE__ */ jsx(View, { ...props, onLayout: function onLayout(e) { var _props_onLayout; setWidth(e.nativeEvent.layout.width); (_props_onLayout = props.onLayout) === null || _props_onLayout === void 0 ? void 0 : _props_onLayout.call(props, e); }, style: [{ display: loaded === 0 ? "none" : "flex", height: 1, position: "absolute", top: 0, left: 0, right: 0, backgroundColor: "rgba(60, 100, 200, 0.65)", width: "100%", transform: [{ translateX: -(1 - loaded * .01) * width }], zIndex: Number.MAX_SAFE_INTEGER }, props.style] }); }; export { LoadProgressBar }; //# sourceMappingURL=LoadProgressBar.native.js.map