// Metro module 5470 (f5471).
import Module19, { useCallback, useLayoutEffect, useMemo, useRef } from "react";
import { getInvertedTransformStyle } from "./Module5433";
import { CompatView } from "./Module5466";
export const ViewHolder = Module19.memo((a0) => {
  const ref = useRef(null);
  const { index, refHolder, layout, onSizeChanged, renderItem, extraData, item, target } = a0;
  let CellRendererComponent = a0.CellRendererComponent;
  const { ItemSeparatorComponent, trailingItem, horizontal, hidden, inverted } = a0;
  useLayoutEffect(() => {
    refHolder.set(index, ref);
    return () => {
      if (refHolder.get(index) === ref) {
        refHolder.delete(index);
      }
    };
  }, [index, refHolder]);
  const callback = useCallback((a0) => {
    if (onSizeChanged != null) {
      onSizeChanged(index, a0.nativeEvent.layout);
    }
  }, [index, onSizeChanged]);
  const memo = useMemo(() => ItemSeparatorComponent ? trailingItem !== void 0 ? <ItemSeparatorComponent leadingItem={item} trailingItem={trailingItem} /> : null : null, [ItemSeparatorComponent, item, trailingItem]);
  const memo2 = useMemo(() => {
    let r3 = renderItem == null ? void 0 : renderItem({
      item,
      index,
      extraData,
      target
    });
    if (r3 == null) {
      r3 = null;
    }
    return r3;
  }, [item, extraData, target, renderItem]);
  const style = {
    flexDirection: horizontal ? "row" : "column",
    position: target === "StickyHeader" ? "relative" : "absolute",
    width: layout.enforcedWidth ? layout.width : void 0,
    height: layout.enforcedHeight ? layout.height : void 0,
    minHeight: layout.minHeight,
    minWidth: layout.minWidth,
    maxHeight: layout.maxHeight,
    maxWidth: layout.maxWidth,
    left: layout.x,
    top: layout.y,
    opacity: hidden ? 0 : 1,
    ...inverted ? getInvertedTransformStyle(horizontal) : void 0
  };
  if (CellRendererComponent == null) {
    CellRendererComponent = CompatView;
  }
  return <CellRendererComponent ref={ref} onLayout={callback} style={style} index={index}>
    {memo2}
    {memo}
  </CellRendererComponent>;
}, (a0, a1) => {
  let r0 = a0.index === a1.index;
  if (r0) {
    const layout = a0.layout;
    const layout2 = a1.layout;
    r0 = layout.x === layout2.x && layout.y === layout2.y && layout.width === layout2.width && layout.height === layout2.height && layout.enforcedWidth === layout2.enforcedWidth && layout.enforcedHeight === layout2.enforcedHeight && layout.minWidth === layout2.minWidth && layout.minHeight === layout2.minHeight && layout.maxWidth === layout2.maxWidth && layout.maxHeight === layout2.maxHeight;
  }
  if (r0) {
    r0 = a0.refHolder === a1.refHolder;
  }
  if (r0) {
    r0 = a0.onSizeChanged === a1.onSizeChanged;
  }
  if (r0) {
    r0 = a0.extraData === a1.extraData;
  }
  if (r0) {
    r0 = a0.target === a1.target;
  }
  if (r0) {
    r0 = a0.item === a1.item;
  }
  if (r0) {
    r0 = a0.renderItem === a1.renderItem;
  }
  if (r0) {
    r0 = a0.CellRendererComponent === a1.CellRendererComponent;
  }
  if (r0) {
    r0 = a0.ItemSeparatorComponent === a1.ItemSeparatorComponent;
  }
  if (r0) {
    r0 = a0.trailingItem === a1.trailingItem;
  }
  if (r0) {
    r0 = a0.horizontal === a1.horizontal;
  }
  if (r0) {
    r0 = a0.hidden === a1.hidden;
  }
  if (r0) {
    r0 = a0.inverted === a1.inverted;
  }
  return r0;
});