@kubit-ui-web/react-components/dist/cjs/components/pageControl/pageControlStandAlone.js

Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.PageControlStandAlone = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = __importDefault(require("react"));
const arrowControlStandAlone_1 = require("./components/arrowControlStandAlone");
const buttonControlStandAlone_1 = require("./components/buttonControlStandAlone");
const controlType_1 = require("./helper/controlType");
const pageControl_styled_1 = require("./pageControl.styled");
const pageControlStates_1 = require("./types/pageControlStates");
const PageControlStandAloneComponent = ({ dataTestId = 'page-control', ...props }, ref) => {
    return ((0, jsx_runtime_1.jsx)(pageControl_styled_1.PageControlContainer, { ref: ref, "data-testid": dataTestId, styles: props.styles, children: props.dots > 0 && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [props.leftControl && !(0, controlType_1.isIElementOrIcon)(props.leftControl) && ((0, jsx_runtime_1.jsx)(buttonControlStandAlone_1.ButtonControlStandAlone, { ...props.leftControl, buttonControlStyles: props.styles.leftButtonControl, dataTestId: `${dataTestId}-left-control` })), ((props.arrowsControlStyles && (0, controlType_1.isIElementOrIcon)(props.leftControl)) ||
                    (props.arrowsControlStyles && props.leftArrowControl)) && ((0, jsx_runtime_1.jsx)(pageControl_styled_1.LeftArrowControlWrapperStyled, { arrowsControlStyles: props.arrowsControlStyles, children: (0, jsx_runtime_1.jsx)(arrowControlStandAlone_1.ArrowControlStandAlone, { arrowsControlStyles: props.arrowsControlStyles, ...props.leftControl, ...props.leftArrowControl }) })), (0, jsx_runtime_1.jsxs)(pageControl_styled_1.DotsWrapper, { styles: props.styles, children: [props.styles.isBullet && props.firstVisiblePosition > 0 ? ((0, jsx_runtime_1.jsx)(pageControl_styled_1.PageControlDot, { state: pageControlStates_1.PageControlState.LAST, styles: props.styles })) : null, [...Array(props.dots)].map((_, _index) => {
                            const index = _index + props.firstVisiblePosition;
                            const state = index === props.currentPosition
                                ? pageControlStates_1.PageControlState.CURRENT
                                : pageControlStates_1.PageControlState.DEFAULT;
                            return ((0, jsx_runtime_1.jsx)(pageControl_styled_1.PageControlDot, { state: state, styles: props.styles }, `Dot-middle--${index}`));
                        }), props.styles.isBullet && props.lastVisiblePosition < props.pages - 1 && ((0, jsx_runtime_1.jsx)(pageControl_styled_1.PageControlDot, { state: pageControlStates_1.PageControlState.LAST, styles: props.styles }))] }), props.rightControl && !(0, controlType_1.isIElementOrIcon)(props.rightControl) && ((0, jsx_runtime_1.jsx)(buttonControlStandAlone_1.ButtonControlStandAlone, { ...props.rightControl, buttonControlStyles: props.styles.rightButtonControl, dataTestId: `${dataTestId}-right-control` })), ((props.arrowsControlStyles && (0, controlType_1.isIElementOrIcon)(props.rightControl)) ||
                    (props.arrowsControlStyles && props.rightArrowControl)) && ((0, jsx_runtime_1.jsx)(pageControl_styled_1.RightArrowControlWrapperStyled, { arrowsControlStyles: props.arrowsControlStyles, children: (0, jsx_runtime_1.jsx)(arrowControlStandAlone_1.ArrowControlStandAlone, { arrowsControlStyles: props.arrowsControlStyles, ...props.rightControl, ...props.rightArrowControl }) }))] })) }));
};
exports.PageControlStandAlone = react_1.default.forwardRef(PageControlStandAloneComponent);
//# sourceMappingURL=pageControlStandAlone.js.map