// Metro module 9650 (f9651).
import * as Module19 from "react";
import { useRef, useState, useMemo, useEffect, useCallback } from "react";
import { View } from "react-native";
import StickersStore from "../StickersStore";
import { useStickerPickerStore } from "./StickerPickerStore";
import { STICKER_SCROLL_LOAD_DELAY_AFTER_HEIGHT_CHANGE_MS, STICKER_SCROLL_LOAD_DELAY_MS, STICKER_SIZE } from "./StickerPickerConstants";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import { Icon } from "../../../design/void/native";
import Module9651 from "../../../_bundle/Module9651";
import { Text } from "../../../design/components/Text/native/Text";
import { intl, t } from "../../../intl/index.native";
import { StickerFormat } from "../StickersTypes";
import { useIsPortalKeyboardInModal } from "../../keyboard/native/PortalKeyboardModalContext";
import useExpressionPickerListWidth_native from "../../expression_picker/native/useExpressionPickerListWidth.native";
import { useStateFromStores } from "../../../_bundle/Module589";
import useStickerPickerListData, { StickerPickerSectionType } from "./useStickerPickerListData";
import StickerPickerListRow from "./StickerPickerListRow";
import Module12 from "../../../_bundle/Module12";
import { FastestListPropsPlaceholderType } from "../../fastest_list/props/FastestListPropsPlaceholder";
import StickerPickerListEmptyState from "./StickerPickerListEmptyState";
import FastestList_android from "../../fastest_list/FastestList.android";
import { getCustomKeyboardHeight } from "../../keyboard/native/useCustomKeyboardHeight";
let Component, Component2;
const useStyles = createStyles({
  listPlaceholder: {
    color: Module712.colors.BACKGROUND_MOD_MUTED
  },
  section: {
    justifyContent: "center",
    overflow: "hidden",
    backgroundColor: Module712.colors.MOBILE_ACTIONSHEET_BACKGROUND
  },
  sectionSticker: {
    backgroundColor: Module712.colors.MOBILE_EXPRESSION_PICKER_BACKGROUND_DEFAULT
  },
  nsfwContainer: {
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "center",
    borderRadius: Module712.radii.sm,
    marginLeft: 12,
    marginRight: 12,
    backgroundColor: Module712.colors.BACKGROUND_MOD_NORMAL
  },
  nsfwText: {
    marginLeft: 4,
    textAlign: "center"
  }
});
let Component3 = Module19.memo(function({ height }) {
  const styles2 = useStyles();
  return <View style={[styles2.nsfwContainer, {
    height
  }]}>
    <Icon source={Module9651} size={Icon.Sizes.SMALL} />
    <Text style={styles2.nsfwText} variant="text-sm/normal" color="interactive-text-active">
      {intl.string(t.uy25Qz)}
    </Text>
  </View>;
});
Component = Module19.memo(function({ height, label, sectionStyle }) {
  return <View style={[useStyles().section, sectionStyle, {
    height
  }]}>
    <Text lineClamp={1} color="interactive-text-default" variant="heading-sm/semibold">{label}</Text>
  </View>;
});
Component2 = Module19.memo(function(a0) {
  return <View style={{
    height: a0.height
  }} />;
});
const r75 = Module19.memo(function(a0) {
  let stickerPickerStore, memo, sectionHeights, sectionSize, sectionFooterSize, sectionLabels, rowsBySection, rowHeight, rowSize, packToScrollToIndex, setCategory;
  const { bottomSheetRef, bottomSheetIndex, setCategoryIndex, searchResults, onPressSticker, onLongPressStickerDetail, insetBottom = 0, insetTop = 0, channel, inPortalKeyboard = false } = a0;
  let c17373_6 = inPortalKeyboard;
  let stickerFormats = a0.stickerFormats;
  if (stickerFormats === void 0) {
    stickerFormats = [StickerFormat.PNG, StickerFormat.APNG, StickerFormat.LOTTIE, StickerFormat.GIF];
  }
  stickerPickerStore = void 0;
  memo = void 0;
  sectionHeights = void 0;
  sectionSize = void 0;
  sectionFooterSize = void 0;
  sectionLabels = void 0;
  rowsBySection = void 0;
  rowHeight = void 0;
  rowSize = void 0;
  packToScrollToIndex = void 0;
  setCategory = void 0;
  const ref = useRef(null);
  const styles = useStyles();
  const [state, setState] = useState(null);
  const isPortalKeyboardInModal = useIsPortalKeyboardInModal();
  const containerWidth = useExpressionPickerListWidth_native(inPortalKeyboard);
  const stateFromStores = useStateFromStores([StickersStore], () => StickersStore.hasLoadedStickerPacks);
  stickerPickerStore = useStickerPickerStore((a0) => a0.setPackToScrollTo);
  memo = useMemo(() => {
    let c26499_0;
    const scrollToCancel2 = function scrollToCancel() {
      return clearTimeout(c26499_0.scrollTo);
    };
    c26499_0 = {
      scrollTo: -1
    };
    return {
      scroll: function scroll({ index, delay, expand }) {
        const r10 = clearTimeout;
        r10(c26499_0.scrollTo);
        if (expand) {
          const current = bottomSheetRef.current;
          if (current != null) {
            current.expandActionSheet();
          }
        }
        c26499_0.scrollTo = setTimeout(() => {
          const current = ref.current;
          if (current != null) {
            current.scrollToLocation({
              section: index,
              item: 0,
              animated: true
            });
          }
          stickerPickerStore(null);
        }, delay);
        setCategoryIndex(index);
      },
      cancel: () => scrollToCancel2
    };
  }, [setCategoryIndex, stickerPickerStore, bottomSheetRef]);
  const stickerPickerListData = useStickerPickerListData({
    channel,
    containerWidth,
    searchResults,
    stickerFormats
  });
  const sections = stickerPickerListData.sections;
  sectionHeights = stickerPickerListData.sectionHeights;
  sectionSize = stickerPickerListData.sectionSize;
  sectionFooterSize = stickerPickerListData.sectionFooterSize;
  sectionLabels = stickerPickerListData.sectionLabels;
  rowsBySection = stickerPickerListData.rowsBySection;
  rowHeight = stickerPickerListData.rowHeight;
  rowSize = stickerPickerListData.rowSize;
  packToScrollToIndex = stickerPickerListData.packToScrollToIndex;
  useEffect(() => {
    const r3 = packToScrollToIndex != null && stateFromStores;
    L7: {
      if (r3) {
        if (c17373_6 && bottomSheetIndex.get() < 1) {
          memo.scroll({
            index: packToScrollToIndex,
            delay: STICKER_SCROLL_LOAD_DELAY_AFTER_HEIGHT_CHANGE_MS,
            expand: true
          });
          break L7;
        }
        memo.scroll({
          index: packToScrollToIndex,
          delay: STICKER_SCROLL_LOAD_DELAY_MS
        });
      }
    }
    return () => {
      memo.cancel();
    };
  }, [inPortalKeyboard, bottomSheetIndex, stateFromStores, packToScrollToIndex, memo]);
  const callback = useCallback((a0) => <Component label={sectionLabels[a0]} sectionStyle={styles.sectionSticker} height={sectionSize} />, [sectionLabels, sectionSize, styles.sectionSticker]);
  const callback2 = useCallback(() => <Component2 height={sectionFooterSize} />, [sectionFooterSize]);
  const callback3 = useCallback((a0, a1) => {
    const r4 = rowsBySection[a0];
    if (r4 == null) {
      return null;
    }
    const type = r4.type;
    if (StickerPickerSectionType.STICKERS === type) {
      return <StickerPickerListRow containerWidth={containerWidth} stickers={r4.stickersByRow[a1]} rowSize={rowSize} onPressSticker={onPressSticker} onLongPressStickerDetail={onLongPressStickerDetail} focusedSticker={state} setFocusedSticker={setState} channel={channel} />;
    }
    if (StickerPickerSectionType.NSFW === type) {
      return <Component3 height={rowHeight} />;
    }
    return null;
  }, [channel, containerWidth, state, onLongPressStickerDetail, onPressSticker, rowHeight, rowSize, rowsBySection]);
  const memo2 = useMemo(() => {
    let c26500_0;
    const setCategory2 = Module12.debounce((a0) => {
      let r16;
      const r6 = 0 < sectionHeights.length;
      let r4 = 0;
      if (r6) {
        const r13 = a0 >= sectionHeights[0];
        let r1 = 0;
        let r0 = 0;
        r4 = 0;
        if (r13) {
          do {
            const r14 = r0 + 1;
            const r3 = r1 + 1;
            const length = sectionHeights.length;
            r4 = r14;
            if (!(r3 < length)) {
              break;
            }
            r16 = sectionHeights[r3];
            r1 = r3;
            r0 = r14;
            r4 = r0;
          } while (a0 >= r16);
        }
      }
      setCategoryIndex(r4);
    }, 100);
    c26500_0 = setCategory2;
    return {
      onScroll: function onScroll(a0) {
        c26500_0(a0.nativeEvent.contentOffset.y);
        a0.nativeEvent.layoutMeasurement.height;
        a0.nativeEvent.contentOffset.y;
        a0.nativeEvent.contentSize.height;
      },
      setCategory: setCategory2
    };
  }, [setCategoryIndex, sectionHeights]);
  const onScroll2 = memo2.onScroll;
  setCategory = memo2.setCategory;
  const memo3 = useMemo(() => ({
    sectionHeader: {
      type: FastestListPropsPlaceholderType.SHAPE,
      colorHex: styles.listPlaceholder.color,
      shape: "rect",
      borderRadius: Module712.radii.md,
      paddingVertical: Module712.space.PX_4
    },
    sectionItem: {
      type: FastestListPropsPlaceholderType.SHAPE,
      colorHex: styles.listPlaceholder.color,
      shape: "circle",
      shapeCount: rowSize,
      width: STICKER_SIZE,
      height: STICKER_SIZE
    }
  }), [styles, rowSize]);
  useEffect(() => () => setCategory.cancel(), [setCategory]);
  useEffect(() => () => {
    memo.cancel();
  }, [memo]);
  return searchResults?.length === 0 ? <StickerPickerListEmptyState inActionSheet insetTop={insetTop} insetBottom={insetBottom} /> : <FastestList_android accessibilityLabel={intl.string(t.nf1s3u)} estimatedListSize={getCustomKeyboardHeight()} inActionSheet preventNativeModalDismiss={isPortalKeyboardInModal} insetEnd={insetBottom} insetStart={insetTop} itemSize={rowHeight} keyboardShouldPersistTaps="always" listId="sticker-picker-list" onScroll={onScroll2} placeholderConfig={memo3} renderItem={callback3} renderSectionHeader={callback} renderSectionFooter={callback2} ref={ref} scrollReporting="callbacks" sections={sections} sectionHeaderSize={sectionSize} sectionFooterSize={sectionFooterSize} />;
});
export default r75;