132 lines
4.0 KiB
TypeScript
132 lines
4.0 KiB
TypeScript
// Metro module 10338 (f10339).
|
|
import _slicedToArray from "../../../_bundle/_slicedToArray";
|
|
import { useState, useCallback } from "react";
|
|
import { View } from "react-native";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../_bundle/Module712";
|
|
import ReanimatedRexport, { useAnimatedStyle } from "../../reanimated/ReanimatedRexport";
|
|
import { useInAppNotificationContext } from "./InAppNotificationContext";
|
|
function $mk84445($env) {
|
|
return (a0) => (0, $env[2])(a0.nativeEvent.layout.width);
|
|
}
|
|
function $mk84446($env) {
|
|
return function n() {
|
|
const r2 = $env;
|
|
const r4 = r2[0];
|
|
let r1 = r4;
|
|
if (typeof r1 !== "number") {
|
|
r1 = r4.get();
|
|
}
|
|
const r5 = r1 / 100;
|
|
const r6 = r2[1];
|
|
return {
|
|
transform: [{
|
|
translateX: r6 * r5 - r6
|
|
}]
|
|
};
|
|
};
|
|
}
|
|
let useStyles, __initData, RedesignProgress;
|
|
const Progress = function Progress(props) {
|
|
let env17885;
|
|
const { percent, hideProgress } = props;
|
|
const styles = useStyles();
|
|
const r15 = env17885 = {};
|
|
env17885[0] = percent;
|
|
env17885[1] = void 0;
|
|
env17885[2] = void 0;
|
|
const r17 = _slicedToArray(useState(0), 2);
|
|
const width = r17[0];
|
|
env17885[1] = width;
|
|
env17885[2] = r17[1];
|
|
const callback = useCallback($mk84445(r15), []);
|
|
const r26 = $mk84446(r15);
|
|
r26.__closure = {
|
|
percent,
|
|
width
|
|
};
|
|
r26.__workletHash = 14879761869068;
|
|
r26.__initData = __initData;
|
|
return <View onLayout={callback} style={[styles.progressContainerBottom, {
|
|
opacity: hideProgress ? 0 : 1
|
|
}]}>
|
|
<ReanimatedRexport.View style={[styles.progress, useAnimatedStyle(r26)]} />
|
|
</View>;
|
|
};
|
|
RedesignProgress = function RedesignProgress(props) {
|
|
let env17886;
|
|
const { percent, hideProgress, type } = props;
|
|
const styles = useStyles();
|
|
const r16 = env17886 = {};
|
|
env17886[0] = percent;
|
|
env17886[1] = void 0;
|
|
env17886[2] = void 0;
|
|
const r18 = _slicedToArray(useState(0), 2);
|
|
const width = r18[0];
|
|
env17886[1] = width;
|
|
env17886[2] = r18[1];
|
|
const callback = useCallback($mk84445(r16), []);
|
|
const r28 = $mk84446(r16);
|
|
r28.__closure = {
|
|
percent,
|
|
width
|
|
};
|
|
r28.__workletHash = 14879761869068;
|
|
r28.__initData = __initData;
|
|
return <View onLayout={callback} style={[styles.progressContainerTop, {
|
|
opacity: hideProgress ? 0 : 1
|
|
}]}>
|
|
<View style={styles.progressTrack}>
|
|
<ReanimatedRexport.View style={[styles.progressRedesign, type === "ALERT" ? styles.progressBarWarning : styles.progressBarBrand, useAnimatedStyle(r28)]} />
|
|
</View>
|
|
</View>;
|
|
};
|
|
useStyles = createStyles({
|
|
progress: {
|
|
borderRadius: Module712.radii.xs,
|
|
backgroundColor: Module712.colors.BACKGROUND_BRAND,
|
|
height: 4
|
|
},
|
|
progressRedesign: {
|
|
borderRadius: Module712.radii.xs,
|
|
height: 8
|
|
},
|
|
progressBarBrand: {
|
|
backgroundColor: Module712.colors.BACKGROUND_BRAND
|
|
},
|
|
progressBarWarning: {
|
|
backgroundColor: Module712.unsafe_rawColors.YELLOW_300
|
|
},
|
|
progressTrack: {
|
|
width: "100%",
|
|
borderRadius: Module712.radii.xs,
|
|
backgroundColor: Module712.colors.BACKGROUND_MOD_SUBTLE,
|
|
height: 8,
|
|
overflow: "hidden"
|
|
},
|
|
progressContainerTop: {
|
|
position: "absolute",
|
|
top: -5,
|
|
left: 16,
|
|
right: 16
|
|
},
|
|
progressContainerBottom: {
|
|
width: "100%",
|
|
position: "absolute",
|
|
bottom: -1
|
|
}
|
|
});
|
|
__initData = {
|
|
code: "function NotificationProgressTsx1(){const{percent,width}=this.__closure;const percentRemaining=(typeof percent==='number'?percent:percent.get())/100;return{transform:[{translateX:-width+width*percentRemaining}]};}"
|
|
};
|
|
export default function NotificationProgress(props) {
|
|
const { canExpand, percent, type } = props;
|
|
const inAppNotificationContext = useInAppNotificationContext();
|
|
let autoDismissing = inAppNotificationContext.autoDismissing;
|
|
const isExpanded = inAppNotificationContext.isExpanded;
|
|
if (!autoDismissing) {
|
|
autoDismissing = isExpanded;
|
|
}
|
|
return canExpand ? <RedesignProgress percent={percent} hideProgress={autoDismissing} type={type} /> : <Progress percent={percent} hideProgress={autoDismissing} />;
|
|
};
|