import React from 'react';
import { useMultiStyleConfig, Box } from '@chakra-ui/react';
import Flex from '../flex/index.js';
import DotsPaginationIndicator from './DotsPaginationIndicator.js';

var NumbersDotsPagination = function (_a) {
    var currentSlideIndex = _a.currentSlideIndex, numberOfSlides = _a.numberOfSlides;
    var pagination = Array.from({ length: numberOfSlides }, function (_, i) { return i; });
    var dotsPaginationContainer = useMultiStyleConfig('Carousel').dotsPaginationContainer;
    return (React.createElement(Box, { "aria-label": "Dots Pagination", __css: dotsPaginationContainer },
        React.createElement(Flex, { flexDirection: "row", alignItems: "center", justifyContent: "center" }, pagination.map(function (index) { return (React.createElement(DotsPaginationIndicator, { key: "slide-".concat(index), isCurrent: index === currentSlideIndex })); }))));
};

export { NumbersDotsPagination as default };
//# sourceMappingURL=DotsPagination.js.map
