110 lines
4.3 KiB
TypeScript
110 lines
4.3 KiB
TypeScript
// Metro module 9628 (f9629).
|
|
import { memo, useState, useRef, useEffect } from "react";
|
|
import { MIN_MARGIN, STICKER_SIZE } from "./StickerPickerConstants";
|
|
import { AnalyticEvents } from "../../../Constants";
|
|
import { ACTION_SHEET_MAX_WIDTH } from "../../action_sheet/native/ActionSheetConstants";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import useWindowDimensions_native from "../../screen/useWindowDimensions.native";
|
|
import useSafeAreaInsets_native from "../../safe_area/useSafeAreaInsets.native";
|
|
import Module12 from "../../../_bundle/Module12";
|
|
import AnalyticsUtils from "../../../utils/AnalyticsUtils";
|
|
import { BottomSheet } from "../../../design/components/Sheet/native/BottomSheet.native";
|
|
import StickerPackHeader from "./StickerPackHeader";
|
|
import StickerPackInformationPopout, { doesStickerPackHavePopoutInformation } from "./StickerPackInformationPopout";
|
|
import { ActionSheetHeaderBar } from "../../../design/components/Sheet/native/ActionSheetHeaderBar.native";
|
|
import { BottomSheetScrollView } from "../../../_bundle/Module5245";
|
|
import StickerPickerListRow from "./StickerPickerListRow";
|
|
import { PressableOpacity } from "../../../design/void/Pressables/native/Pressables";
|
|
import Sticker from "./Sticker";
|
|
const useStyles = createStyles({
|
|
focusedStickerPreviewContainer: {
|
|
position: "absolute",
|
|
left: 0,
|
|
top: 0,
|
|
height: "100%",
|
|
width: "100%",
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
backgroundColor: "rgba(0, 0, 0, 0.85)"
|
|
},
|
|
header: {
|
|
marginHorizontal: 16,
|
|
marginVertical: 8,
|
|
backgroundColor: "transparent",
|
|
height: void 0
|
|
},
|
|
stickers: {
|
|
paddingHorizontal: 16,
|
|
marginBottom: 16
|
|
},
|
|
popoutContainer: {
|
|
position: "absolute",
|
|
bottom: 50
|
|
}
|
|
});
|
|
const r43 = memo(function StickerPackDetailActionSheet(props) {
|
|
let setState, state, setState2, ref, containerWidth, ref2;
|
|
const { stickerPack, analyticsPopoutType, onClose } = props;
|
|
setState = void 0;
|
|
state = void 0;
|
|
setState2 = void 0;
|
|
ref = void 0;
|
|
containerWidth = void 0;
|
|
ref2 = void 0;
|
|
const onPressSticker2 = function onPressSticker(a0) {
|
|
setState(a0);
|
|
};
|
|
const toggleDisplayingPackDetails = function toggleDisplayingPackDetails() {
|
|
if (ref.current != null) {
|
|
clearTimeout(ref.current);
|
|
}
|
|
setState2(!state);
|
|
if (!state) {
|
|
ref.current = setTimeout(() => setState2(false), 4000);
|
|
}
|
|
};
|
|
const styles = useStyles();
|
|
const width = useWindowDimensions_native().width;
|
|
let sticker;
|
|
[sticker, setState] = useState(null);
|
|
let state2;
|
|
[state2, setState2] = useState(false);
|
|
state = state2;
|
|
ref = useRef(null);
|
|
const bottom = useSafeAreaInsets_native().bottom;
|
|
containerWidth = Math.floor(Math.min(ACTION_SHEET_MAX_WIDTH, width) / (STICKER_SIZE + MIN_MARGIN));
|
|
const r55 = Module12.chunk(stickerPack.stickers, containerWidth);
|
|
ref2 = useRef(onClose);
|
|
useEffect(() => {
|
|
ref2.current = onClose;
|
|
}, [onClose]);
|
|
useEffect(() => () => {
|
|
const current = ref2.current;
|
|
return current == null ? void 0 : current.call(ref2);
|
|
}, []);
|
|
useEffect(() => {
|
|
AnalyticsUtils.track(AnalyticEvents.OPEN_POPOUT, {
|
|
type: analyticsPopoutType,
|
|
sticker_pack_id: stickerPack.id
|
|
});
|
|
}, [analyticsPopoutType, stickerPack.id]);
|
|
const r109 = [<BottomSheet scrollable startExpanded handleDisabled header={<>
|
|
<StickerPackHeader stickerPack={stickerPack} style={styles.header} onPress={doesStickerPackHavePopoutInformation(stickerPack) ? toggleDisplayingPackDetails : void 0} withBanner withDescription />
|
|
<ActionSheetHeaderBar variant="floating" />
|
|
</>}>
|
|
<BottomSheetScrollView style={styles.stickers} contentContainerStyle={{
|
|
paddingBottom: 32 + bottom
|
|
}}>
|
|
{r55.map((item, index) => <StickerPickerListRow key={index} containerWidth={containerWidth} stickers={item} rowSize={containerWidth} onPressSticker={onPressSticker2} nativeRow={false} />)}
|
|
</BottomSheetScrollView>
|
|
</BottomSheet>, sticker != null && <PressableOpacity accessibilityRole="none" style={styles.focusedStickerPreviewContainer} onPress={() => setState(null)}>
|
|
<Sticker sticker={sticker} size={128} />
|
|
</PressableOpacity>, ,];
|
|
if (state) {
|
|
state2 = <StickerPackInformationPopout stickerPack={stickerPack} style={styles.popoutContainer} onClose={toggleDisplayingPackDetails} />;
|
|
}
|
|
r109[2] = state2;
|
|
return <>{r109}</>;
|
|
});
|
|
export default r43;
|