yeet

modules/media_viewer/native/components/MediaModalSpoilerOverlay.tsx

@@ -0,0 +1,69 @@
+// Metro module 12318 (f12319).
+import { memo } from "react";
+import { StyleSheet, View } from "react-native";
+import { createStyles } from "../../../../design/components/Styles/native/createStyles";
+import Module712 from "../../../../_bundle/Module712";
+import { isAndroid } from "../../../../utils/PlatformUtils";
+import { useToken } from "../../../../design/tokens/native/useToken";
+import { useMediaItemSpoilerState } from "../useMediaItemSpoilerState";
+import ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
+import VisualEffectView from "../../../visual_effect_view/native/VisualEffectView";
+import { ImageWarningIcon } from "../../../../design/components/Icon/native/redesign/generated/ImageWarningIcon";
+import { Text } from "../../../../design/components/Text/native/Text";
+import { intl, t } from "../../../../intl/index.native";
+const useStyles = createStyles({
+  spoilerOverlayContainer: {
+    justifyContent: "center",
+    alignContent: "center",
+    flex: 1
+  },
+  obscureContentContainer: {
+    gap: Module712.space.PX_4,
+    justifyContent: "center",
+    alignItems: "center",
+    alignSelf: "center"
+  },
+  spoilerOverlayBackground: {
+    paddingHorizontal: Module712.space.PX_16,
+    borderRadius: Module712.radii.lg,
+    height: Module712.space.PX_32,
+    backgroundColor: isAndroid() ? Module712.unsafe_rawColors.PRIMARY_800 : Module712.unsafe_rawColors.PRIMARY_600,
+    flexGrow: 0,
+    justifyContent: "center",
+    alignItems: "center",
+    alignSelf: "center"
+  }
+});
+const r59 = memo(function MediaModalSpoilerOverlay(props) {
+  let r72;
+  const { style, index, source } = props;
+  const styles = useStyles();
+  const token = useToken(Module712.colors.SPOILER_HIDDEN_BACKGROUND);
+  const [r31, r9] = useMediaItemSpoilerState(index);
+  let r32 = null;
+  if (r31) {
+    const r51 = [<VisualEffectView blurTheme={source.obscure ? "dark" : isAndroid() ? "dark" : "light"} android_fallbackColor={token} style={StyleSheet.absoluteFill} />, ,];
+    const obscure = source.obscure;
+    const props2 = {
+      style: null,
+      children: null
+    };
+    if (obscure) {
+      props2.style = styles.obscureContentContainer;
+      props2.children = [<ImageWarningIcon size="lg" color="white" />, <Text accessibilityRole="text" variant="heading-md/medium" color="text-overlay-light">
+        {intl.string(t.SpxcUR)}
+      </Text>];
+      r72 = <View {...props2} />;
+    } else {
+      props2.style = styles.spoilerOverlayBackground;
+      props2.children = <Text accessibilityRole="text" variant="heading-md/medium" color="text-overlay-light">
+        {intl.string(t["F+x38C"]).toUpperCase()}
+      </Text>;
+      r72 = <View {...props2} />;
+    }
+    r51[1] = <View style={styles.spoilerOverlayContainer}>{r72}</View>;
+    r32 = <ReanimatedRexport.View style={[style, StyleSheet.absoluteFill, r9]}>{r51}</ReanimatedRexport.View>;
+  }
+  return r32;
+});
+export default r59;