@crossed/ui/lib/module/scroll/FlatList.js

A universal & performant styling library for React Native, Next.js & React

import { jsx } from "react/jsx-runtime";
import { Layout } from "./utils/Layout";
import { Title } from "./utils/Title";
import { Footer } from "./utils/Footer";
import { forwardRef, memo, useId } from "react";
import { useLogic } from "./utils/useLogic";
import Animated from "react-native-reanimated";
import { composeStyles } from "@crossed/styled";
const FlatList = memo(
  forwardRef((props, ref) => {
    const {
      stickyHeader,
      stickyFooter,
      containerProps,
      style,
      animatedStyle,
      children,
      title: titleProps,
      footer: footerProps,
      ...rest
    } = props;
    const id = useId();
    const {
      title,
      footer,
      onLayout,
      onContentSizeChange,
      showFooter,
      paddingRight,
      renderFooter
    } = useLogic({
      ...props,
      children: [
        /* @__PURE__ */ jsx(Title, { children: titleProps }, `${id}-title`),
        /* @__PURE__ */ jsx(Footer, { children: footerProps }, `${id}-footer`)
      ]
    });
    return /* @__PURE__ */ jsx(
      Layout,
      {
        footer,
        showFooter,
        paddingRight,
        stickyFooter,
        ...containerProps,
        children: /* @__PURE__ */ jsx(
          Animated.FlatList,
          {
            ref,
            stickyHeaderIndices: stickyHeader && title ? [0] : void 0,
            ListHeaderComponent: title ? () => title : void 0,
            ListFooterComponent: footer ? renderFooter : void 0,
            ...rest,
            onLayout,
            onContentSizeChange,
            style: [composeStyles(style).style().style, animatedStyle]
          }
        )
      }
    );
  })
);
export {
  FlatList
};
//# sourceMappingURL=FlatList.js.map