Almost all examples are not working

[transli]

Pagination is not exported on latest releases

[dosubot[bot]]

Hey @transli! I'm here to help you with any bugs, questions, or contributions you may have regarding the repository. Let me know how I can assist you!

To resolve the issue where almost all examples are not working because Pagination is not exported in the latest releases, ensure that the Pagination component is correctly exported. The Pagination component is being exported from src/index.tsx:

import Carousel from "./components/Carousel";
export { Pagination } from "./components/Pagination";

export type {
  TCarouselProps,
  ICarouselInstance,
  IComputedDirectionTypes,
  CarouselRenderItem,
} from "./types";
export type { TAnimationStyle } from "./components/BaseLayout";
export type { ILayoutConfig } from "./layouts/stack";

export default Carousel;

If the examples are still not working, check if the import paths in the examples are correct and if the Pagination component is properly implemented and exported in ./components/Pagination.

Ensure that the Pagination component is being imported correctly in the examples:

import { Pagination } from 'path-to-pagination-component';

Refer to the usage example provided in the documentation to ensure correct usage:

import * as React from "react";
import { Dimensions, Text, View } from "react-native";
import { useSharedValue } from "react-native-reanimated";
import Carousel, {
  ICarouselInstance,
  Pagination,
} from "react-native-reanimated-carousel";

const data = [...new Array(6).keys()];
const width = Dimensions.get("window").width;

function App() {
  const ref = React.useRef<ICarouselInstance>(null);
  const progress = useSharedValue<number>(0);

  const onPressPagination = (index: number) => {
    ref.current?.scrollTo({
      count: index - progress.value,
      animated: true,
    });
  };

  return (
    <View style={{ flex: 1 }}>
      <Carousel
        ref={ref}
        width={width}
        height={width / 2}
        data={data}
        onProgressChange={progress}
        renderItem={({ index }) => (
          <View
            style={{
              flex: 1,
              borderWidth: 1,
              justifyContent: "center",
            }}
          >
            <Text style={{ textAlign: "center", fontSize: 30 }}>{index}</Text>
          </View>
        )}
      />
      <Pagination.Basic
        progress={progress}
        data={data}
        dotStyle={{ backgroundColor: "rgba(0,0,0,0.2)", borderRadius: 50 }}
        containerStyle={{ gap: 5, marginTop: 10 }}
        onPress={onPressPagination}
      />
    </View>
  );
}

export default App;

If the Pagination component is not being found, double-check the file paths and ensure that the module is correctly included in your project ^[1][2].

To continue talking to Dosu, mention @dosu.

[rochajulian]

Second this. I can't use Pagination!

[Zakisb]

Same can't use paginaton. !

[haeniya]

Had the same issue. Using version 4.0.0-alpha.12 worked for me.

[AnfalHussain]

I have the same issue with version 3.5.1