react-native-timer-picker 1.2.0 → 1.2.1

package/README.md

@@ -377,12 +377,12 @@ The following custom styles can be supplied to re-style the component in any way
 
 ## Methods 🔄
 
-### TimerPickerModal
+### TimerPicker
 
-The library exposes a TimerPickerModalRef type, which can be used to type your ref to the modal:
+The library exposes a TimerPickerRef type, which can be used to type your ref to the picker:
 
 ```javascript
-const timerPickerModalRef = useRef<TimerPickerModalRef>(null);
+const timerPickerRef = useRef<TimerPickerRef>(null);
 ```
 
 It has the following available methods:
@@ -390,15 +390,19 @@ It has the following available methods:
 `reset` - imperative method to reset the selected duration to their initial values.
 
 ```javascript
-timerPickerModalRef.current.reset();
+timerPickerRef.current.reset(options?: { animated: boolean });
 ```
 
 `setValue` - imperative method to set the selected duration to a particular value
 
 ```javascript
-timerPickerModalRef.current.setValue({hours: number, minutes: number, seconds: number});
+timerPickerRef.current.setValue({ hours: number, minutes: number, seconds: number }, options?: { animated: boolean });
 ```
 
+### TimerPickerModal
+
+An identical ref is also exposed for the TimerPickerModal component.
+
 ## License 📝
 
 This project is licensed under the [MIT License](LICENSE).

package/dist/components/TimerPicker/DurationScroll.d.ts

@@ -1,6 +1,14 @@
 import React from "react";
 import { View } from "react-native";
 import { generateStyles } from "./TimerPicker.styles";
+export interface DurationScrollRef {
+    reset: (options?: {
+        animated?: boolean;
+    }) => void;
+    setValue: (value: number, options?: {
+        animated?: boolean;
+    }) => void;
+}
 type LinearGradientPoint = {
     x: number;
     y: number;
@@ -18,7 +26,7 @@ export type LimitType = {
 interface DurationScrollProps {
     numberOfItems: number;
     label?: string | React.ReactElement;
-    initialIndex?: number;
+    initialValue?: number;
     onDurationChange: (duration: number) => void;
     padNumbersWithZero?: boolean;
     disableInfiniteScroll?: boolean;
@@ -29,5 +37,5 @@ interface DurationScrollProps {
     testID?: string;
     styles: ReturnType<typeof generateStyles>;
 }
-declare const _default: React.MemoExoticComponent<({ numberOfItems, label, initialIndex, onDurationChange, padNumbersWithZero, disableInfiniteScroll, limit, padWithNItems, pickerGradientOverlayProps, LinearGradient, testID, styles, }: DurationScrollProps) => React.ReactElement<any, string | React.JSXElementConstructor<any>>>;
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<DurationScrollProps & React.RefAttributes<DurationScrollRef>>>;
 export default _default;

package/dist/components/TimerPicker/DurationScroll.js

@@ -38,11 +38,12 @@ var react_native_1 = require("react-native");
 var generateNumbers_1 = require("../../utils/generateNumbers");
 var colorToRgba_1 = require("../../utils/colorToRgba");
 var getAdjustedLimit_1 = require("../../utils/getAdjustedLimit");
+var getScrollIndex_1 = require("../../utils/getScrollIndex");
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 var KEY_EXTRACTOR = function (_, index) { return index.toString(); };
-var DurationScroll = function (_a) {
+var DurationScroll = (0, react_1.forwardRef)(function (_a, ref) {
     var _b, _c, _d, _e;
-    var numberOfItems = _a.numberOfItems, label = _a.label, _f = _a.initialIndex, initialIndex = _f === void 0 ? 0 : _f, onDurationChange = _a.onDurationChange, _g = _a.padNumbersWithZero, padNumbersWithZero = _g === void 0 ? false : _g, _h = _a.disableInfiniteScroll, disableInfiniteScroll = _h === void 0 ? false : _h, limit = _a.limit, padWithNItems = _a.padWithNItems, pickerGradientOverlayProps = _a.pickerGradientOverlayProps, LinearGradient = _a.LinearGradient, testID = _a.testID, styles = _a.styles;
+    var numberOfItems = _a.numberOfItems, label = _a.label, _f = _a.initialValue, initialValue = _f === void 0 ? 0 : _f, onDurationChange = _a.onDurationChange, _g = _a.padNumbersWithZero, padNumbersWithZero = _g === void 0 ? false : _g, _h = _a.disableInfiniteScroll, disableInfiniteScroll = _h === void 0 ? false : _h, limit = _a.limit, padWithNItems = _a.padWithNItems, pickerGradientOverlayProps = _a.pickerGradientOverlayProps, LinearGradient = _a.LinearGradient, testID = _a.testID, styles = _a.styles;
     var flatListRef = (0, react_1.useRef)(null);
     var data = (0, generateNumbers_1.generateNumbers)(numberOfItems, {
         padWithZero: padNumbersWithZero,
@@ -52,20 +53,47 @@ var DurationScroll = function (_a) {
     });
     var numberOfItemsToShow = 1 + padWithNItems * 2;
     var adjustedLimited = (0, getAdjustedLimit_1.getAdjustedLimit)(limit, numberOfItems);
+    var initialScrollIndex = (0, getScrollIndex_1.getScrollIndex)({
+        value: initialValue,
+        numberOfItems: numberOfItems,
+        padWithNItems: padWithNItems,
+        disableInfiniteScroll: disableInfiniteScroll,
+    });
+    (0, react_1.useImperativeHandle)(ref, function () { return ({
+        reset: function (options) {
+            var _a, _b;
+            (_a = flatListRef.current) === null || _a === void 0 ? void 0 : _a.scrollToIndex({
+                animated: (_b = options === null || options === void 0 ? void 0 : options.animated) !== null && _b !== void 0 ? _b : false,
+                index: initialScrollIndex,
+            });
+        },
+        setValue: function (value, options) {
+            var _a, _b;
+            (_a = flatListRef.current) === null || _a === void 0 ? void 0 : _a.scrollToIndex({
+                animated: (_b = options === null || options === void 0 ? void 0 : options.animated) !== null && _b !== void 0 ? _b : false,
+                index: (0, getScrollIndex_1.getScrollIndex)({
+                    value: value,
+                    numberOfItems: numberOfItems,
+                    padWithNItems: padWithNItems,
+                    disableInfiniteScroll: disableInfiniteScroll,
+                }),
+            });
+        },
+    }); });
     var renderItem = (0, react_1.useCallback)(function (_a) {
         var item = _a.item;
         var intItem = parseInt(item);
         return (<react_native_1.View key={item} style={styles.pickerItemContainer} testID="picker-item">
-                    <react_native_1.Text style={[
+                        <react_native_1.Text style={[
                 styles.pickerItem,
                 intItem > adjustedLimited.max ||
                     intItem < adjustedLimited.min
                     ? styles.disabledPickerItem
                     : {},
             ]}>
-                        {item}
-                    </react_native_1.Text>
-                </react_native_1.View>);
+                            {item}
+                        </react_native_1.Text>
+                    </react_native_1.View>);
     }, [
         adjustedLimited.max,
         adjustedLimited.min,
@@ -77,7 +105,9 @@ var DurationScroll = function (_a) {
         var _a, _b;
         var newIndex = Math.round(e.nativeEvent.contentOffset.y /
             styles.pickerItemContainer.height);
-        var newDuration = (disableInfiniteScroll ? newIndex : newIndex + padWithNItems) %
+        var newDuration = (disableInfiniteScroll
+            ? newIndex
+            : newIndex + padWithNItems) %
             (numberOfItems + 1);
         // check limits
         if (newDuration > adjustedLimited.max) {
@@ -148,33 +178,35 @@ var DurationScroll = function (_a) {
             height: styles.pickerItemContainer.height * numberOfItemsToShow,
             overflow: "hidden",
         }}>
-            <react_native_1.FlatList ref={flatListRef} data={data} getItemLayout={getItemLayout} initialScrollIndex={(initialIndex % numberOfItems) +
-            numberOfItems +
-            (disableInfiniteScroll ? padWithNItems : 0) -
-            (padWithNItems - 1)} windowSize={numberOfItemsToShow} renderItem={renderItem} keyExtractor={KEY_EXTRACTOR} showsVerticalScrollIndicator={false} decelerationRate="fast" scrollEventThrottle={16} snapToAlignment="start" 
+                <react_native_1.FlatList ref={flatListRef} data={data} getItemLayout={getItemLayout} initialScrollIndex={initialScrollIndex} windowSize={numberOfItemsToShow} renderItem={renderItem} keyExtractor={KEY_EXTRACTOR} showsVerticalScrollIndicator={false} decelerationRate="fast" scrollEventThrottle={16} snapToAlignment="start" 
     // used in place of snapToOffset due to bug on Android
     snapToOffsets={__spreadArray([], Array(data.length), true).map(function (_, i) { return i * styles.pickerItemContainer.height; })} viewabilityConfigCallbackPairs={!disableInfiniteScroll
             ? viewabilityConfigCallbackPairs === null || viewabilityConfigCallbackPairs === void 0 ? void 0 : viewabilityConfigCallbackPairs.current
             : undefined} onMomentumScrollEnd={onMomentumScrollEnd} testID="duration-scroll-flatlist"/>
-            <react_native_1.View style={styles.pickerLabelContainer}>
-                {typeof label === "string" ? (<react_native_1.Text style={styles.pickerLabel}>{label}</react_native_1.Text>) : (label !== null && label !== void 0 ? label : null)}
-            </react_native_1.View>
-            {LinearGradient ? (<>
-                    <LinearGradient colors={[
+                <react_native_1.View style={styles.pickerLabelContainer}>
+                    {typeof label === "string" ? (<react_native_1.Text style={styles.pickerLabel}>{label}</react_native_1.Text>) : (label !== null && label !== void 0 ? label : null)}
+                </react_native_1.View>
+                {LinearGradient ? (<>
+                        <LinearGradient colors={[
                 (_b = styles.pickerContainer.backgroundColor) !== null && _b !== void 0 ? _b : "white",
                 (0, colorToRgba_1.colorToRgba)({
-                    color: (_c = styles.pickerContainer.backgroundColor) !== null && _c !== void 0 ? _c : "white",
+                    color: (_c = styles.pickerContainer
+                        .backgroundColor) !== null && _c !== void 0 ? _c : "white",
                     opacity: 0,
                 }),
             ]} start={{ x: 1, y: 0.3 }} end={{ x: 1, y: 1 }} {...pickerGradientOverlayProps} style={[styles.pickerGradientOverlay, { top: 0 }]}/>
-                    <LinearGradient colors={[
+                        <LinearGradient colors={[
                 (0, colorToRgba_1.colorToRgba)({
-                    color: (_d = styles.pickerContainer.backgroundColor) !== null && _d !== void 0 ? _d : "white",
+                    color: (_d = styles.pickerContainer
+                        .backgroundColor) !== null && _d !== void 0 ? _d : "white",
                     opacity: 0,
                 }),
                 (_e = styles.pickerContainer.backgroundColor) !== null && _e !== void 0 ? _e : "white",
-            ]} start={{ x: 1, y: 0 }} end={{ x: 1, y: 0.7 }} {...pickerGradientOverlayProps} style={[styles.pickerGradientOverlay, { bottom: -1 }]}/>
-                </>) : null}
-        </react_native_1.View>);
-};
+            ]} start={{ x: 1, y: 0 }} end={{ x: 1, y: 0.7 }} {...pickerGradientOverlayProps} style={[
+                styles.pickerGradientOverlay,
+                { bottom: -1 },
+            ]}/>
+                    </>) : null}
+            </react_native_1.View>);
+});
 exports.default = react_1.default.memo(DurationScroll);

package/dist/components/TimerPicker/index.d.ts

@@ -3,6 +3,18 @@ import { View } from "react-native";
 import { LimitType } from "./DurationScroll";
 import { CustomTimerPickerStyles } from "./TimerPicker.styles";
 import { LinearGradientProps } from "./DurationScroll";
+export interface TimerPickerRef {
+    reset: (options?: {
+        animated?: boolean;
+    }) => void;
+    setValue: (value: {
+        hours: number;
+        minutes: number;
+        seconds: number;
+    }, options?: {
+        animated?: boolean;
+    }) => void;
+}
 export interface TimerPickerProps {
     onDurationChange?: (duration: {
         hours: number;
@@ -28,5 +40,5 @@ export interface TimerPickerProps {
     pickerGradientOverlayProps?: LinearGradientProps;
     styles?: CustomTimerPickerStyles;
 }
-declare const _default: React.MemoExoticComponent<({ onDurationChange, initialHours, initialMinutes, initialSeconds, hideHours, hideMinutes, hideSeconds, hourLimit, minuteLimit, secondLimit, hourLabel, minuteLabel, secondLabel, padWithNItems, disableInfiniteScroll, LinearGradient, pickerContainerProps, pickerGradientOverlayProps, styles: customStyles, }: TimerPickerProps) => React.ReactElement<any, string | React.JSXElementConstructor<any>>>;
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<TimerPickerProps & React.RefAttributes<TimerPickerRef>>>;
 export default _default;

package/dist/components/TimerPicker/index.js

@@ -30,7 +30,7 @@ var react_1 = __importStar(require("react"));
 var react_native_1 = require("react-native");
 var DurationScroll_1 = __importDefault(require("./DurationScroll"));
 var TimerPicker_styles_1 = require("./TimerPicker.styles");
-var TimerPicker = function (_a) {
+var TimerPicker = (0, react_1.forwardRef)(function (_a, ref) {
     var onDurationChange = _a.onDurationChange, _b = _a.initialHours, initialHours = _b === void 0 ? 0 : _b, _c = _a.initialMinutes, initialMinutes = _c === void 0 ? 0 : _c, _d = _a.initialSeconds, initialSeconds = _d === void 0 ? 0 : _d, _e = _a.hideHours, hideHours = _e === void 0 ? false : _e, _f = _a.hideMinutes, hideMinutes = _f === void 0 ? false : _f, _g = _a.hideSeconds, hideSeconds = _g === void 0 ? false : _g, hourLimit = _a.hourLimit, minuteLimit = _a.minuteLimit, secondLimit = _a.secondLimit, _h = _a.hourLabel, hourLabel = _h === void 0 ? "h" : _h, _j = _a.minuteLabel, minuteLabel = _j === void 0 ? "m" : _j, _k = _a.secondLabel, secondLabel = _k === void 0 ? "s" : _k, _l = _a.padWithNItems, padWithNItems = _l === void 0 ? 1 : _l, _m = _a.disableInfiniteScroll, disableInfiniteScroll = _m === void 0 ? false : _m, LinearGradient = _a.LinearGradient, pickerContainerProps = _a.pickerContainerProps, pickerGradientOverlayProps = _a.pickerGradientOverlayProps, customStyles = _a.styles;
     var checkedPadWithNItems = padWithNItems >= 0 ? Math.round(padWithNItems) : 0;
     var styles = (0, react_1.useMemo)(function () {
@@ -49,10 +49,33 @@ var TimerPicker = function (_a) {
         });
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [selectedHours, selectedMinutes, selectedSeconds]);
+    var hoursDurationScrollRef = (0, react_1.useRef)(null);
+    var minutesDurationScrollRef = (0, react_1.useRef)(null);
+    var secondsDurationScrollRef = (0, react_1.useRef)(null);
+    (0, react_1.useImperativeHandle)(ref, function () { return ({
+        reset: function (options) {
+            var _a, _b, _c;
+            setSelectedHours(initialHours);
+            setSelectedMinutes(initialMinutes);
+            setSelectedSeconds(initialSeconds);
+            (_a = hoursDurationScrollRef.current) === null || _a === void 0 ? void 0 : _a.reset(options);
+            (_b = minutesDurationScrollRef.current) === null || _b === void 0 ? void 0 : _b.reset(options);
+            (_c = secondsDurationScrollRef.current) === null || _c === void 0 ? void 0 : _c.reset(options);
+        },
+        setValue: function (value, options) {
+            var _a, _b, _c;
+            setSelectedHours(value.hours);
+            setSelectedMinutes(value.minutes);
+            setSelectedSeconds(value.seconds);
+            (_a = hoursDurationScrollRef.current) === null || _a === void 0 ? void 0 : _a.setValue(value.hours, options);
+            (_b = minutesDurationScrollRef.current) === null || _b === void 0 ? void 0 : _b.setValue(value.minutes, options);
+            (_c = secondsDurationScrollRef.current) === null || _c === void 0 ? void 0 : _c.setValue(value.seconds, options);
+        },
+    }); });
     return (<react_native_1.View {...pickerContainerProps} style={styles.pickerContainer} testID="timer-picker">
-            {!hideHours ? (<DurationScroll_1.default numberOfItems={23} label={hourLabel} initialIndex={initialHours} onDurationChange={setSelectedHours} pickerGradientOverlayProps={pickerGradientOverlayProps} disableInfiniteScroll={disableInfiniteScroll} padWithNItems={checkedPadWithNItems} limit={hourLimit} LinearGradient={LinearGradient} styles={styles} testID="duration-scroll-hour"/>) : null}
-            {!hideMinutes ? (<DurationScroll_1.default numberOfItems={59} label={minuteLabel} initialIndex={initialMinutes} onDurationChange={setSelectedMinutes} padNumbersWithZero pickerGradientOverlayProps={pickerGradientOverlayProps} disableInfiniteScroll={disableInfiniteScroll} padWithNItems={checkedPadWithNItems} limit={minuteLimit} LinearGradient={LinearGradient} styles={styles} testID="duration-scroll-minute"/>) : null}
-            {!hideSeconds ? (<DurationScroll_1.default numberOfItems={59} label={secondLabel} initialIndex={initialSeconds} onDurationChange={setSelectedSeconds} padNumbersWithZero pickerGradientOverlayProps={pickerGradientOverlayProps} disableInfiniteScroll={disableInfiniteScroll} padWithNItems={checkedPadWithNItems} limit={secondLimit} LinearGradient={LinearGradient} styles={styles} testID="duration-scroll-second"/>) : null}
-        </react_native_1.View>);
-};
+                {!hideHours ? (<DurationScroll_1.default ref={hoursDurationScrollRef} numberOfItems={23} label={hourLabel} initialValue={initialHours} onDurationChange={setSelectedHours} pickerGradientOverlayProps={pickerGradientOverlayProps} disableInfiniteScroll={disableInfiniteScroll} padWithNItems={checkedPadWithNItems} limit={hourLimit} LinearGradient={LinearGradient} styles={styles} testID="duration-scroll-hour"/>) : null}
+                {!hideMinutes ? (<DurationScroll_1.default ref={minutesDurationScrollRef} numberOfItems={59} label={minuteLabel} initialValue={initialMinutes} onDurationChange={setSelectedMinutes} padNumbersWithZero pickerGradientOverlayProps={pickerGradientOverlayProps} disableInfiniteScroll={disableInfiniteScroll} padWithNItems={checkedPadWithNItems} limit={minuteLimit} LinearGradient={LinearGradient} styles={styles} testID="duration-scroll-minute"/>) : null}
+                {!hideSeconds ? (<DurationScroll_1.default ref={secondsDurationScrollRef} numberOfItems={59} label={secondLabel} initialValue={initialSeconds} onDurationChange={setSelectedSeconds} padNumbersWithZero pickerGradientOverlayProps={pickerGradientOverlayProps} disableInfiniteScroll={disableInfiniteScroll} padWithNItems={checkedPadWithNItems} limit={secondLimit} LinearGradient={LinearGradient} styles={styles} testID="duration-scroll-second"/>) : null}
+            </react_native_1.View>);
+});
 exports.default = react_1.default.memo(TimerPicker);

package/dist/components/index.d.ts

@@ -4,11 +4,15 @@ import { TimerPickerProps } from "./TimerPicker";
 import Modal from "./Modal";
 import { CustomTimerPickerModalStyles } from "./TimerPickerModal.styles";
 export interface TimerPickerModalRef {
-    reset: () => void;
+    reset: (options?: {
+        animated?: boolean;
+    }) => void;
     setValue: (value: {
         hours: number;
         minutes: number;
         seconds: number;
+    }, options?: {
+        animated?: boolean;
     }) => void;
 }
 export interface TimerPickerModalProps extends TimerPickerProps {

package/dist/components/index.js

@@ -66,8 +66,10 @@ var TimerPickerModal = (0, react_1.forwardRef)(function (_a, ref) {
         setSelectedDuration(duration);
         onDurationChange === null || onDurationChange === void 0 ? void 0 : onDurationChange(duration);
     }, [onDurationChange]);
+    var timerPickerRef = (0, react_1.useRef)(null);
     (0, react_1.useImperativeHandle)(ref, function () { return ({
-        reset: function () {
+        reset: function (options) {
+            var _a;
             var initialDuration = {
                 hours: initialHours,
                 minutes: initialMinutes,
@@ -75,11 +77,13 @@ var TimerPickerModal = (0, react_1.forwardRef)(function (_a, ref) {
             };
             setSelectedDuration(initialDuration);
             setConfirmedDuration(initialDuration);
-            setIsVisible(false);
+            (_a = timerPickerRef.current) === null || _a === void 0 ? void 0 : _a.reset(options);
         },
-        setValue: function (value) {
+        setValue: function (value, options) {
+            var _a;
             setSelectedDuration(value);
             setConfirmedDuration(value);
+            (_a = timerPickerRef.current) === null || _a === void 0 ? void 0 : _a.setValue(value, options);
         },
     }); });
     return (<Modal_1.default isVisible={visible} onOverlayPress={closeOnOverlayPress ? hideModal : undefined} {...modalProps} testID="timer-picker-modal">
@@ -88,7 +92,7 @@ var TimerPickerModal = (0, react_1.forwardRef)(function (_a, ref) {
                         {modalTitle ? (<react_native_1.Text {...modalTitleProps} style={styles.modalTitle}>
                                 {modalTitle}
                             </react_native_1.Text>) : null}
-                        <TimerPicker_1.default onDurationChange={durationChange} initialHours={confirmedDuration.hours} initialMinutes={confirmedDuration.minutes} initialSeconds={confirmedDuration.seconds} hideHours={hideHours} hideMinutes={hideMinutes} hideSeconds={hideSeconds} hourLimit={hourLimit} minuteLimit={minuteLimit} secondLimit={secondLimit} hourLabel={hourLabel} minuteLabel={minuteLabel} secondLabel={secondLabel} padWithNItems={padWithNItems} disableInfiniteScroll={disableInfiniteScroll} LinearGradient={LinearGradient} pickerContainerProps={pickerContainerProps} pickerGradientOverlayProps={pickerGradientOverlayProps} styles={customStyles}/>
+                        <TimerPicker_1.default ref={timerPickerRef} onDurationChange={durationChange} initialHours={confirmedDuration.hours} initialMinutes={confirmedDuration.minutes} initialSeconds={confirmedDuration.seconds} hideHours={hideHours} hideMinutes={hideMinutes} hideSeconds={hideSeconds} hourLimit={hourLimit} minuteLimit={minuteLimit} secondLimit={secondLimit} hourLabel={hourLabel} minuteLabel={minuteLabel} secondLabel={secondLabel} padWithNItems={padWithNItems} disableInfiniteScroll={disableInfiniteScroll} LinearGradient={LinearGradient} pickerContainerProps={pickerContainerProps} pickerGradientOverlayProps={pickerGradientOverlayProps} styles={customStyles}/>
                         <react_native_1.View {...buttonContainerProps} style={styles.buttonContainer}>
                             {!hideCancelButton ? (<react_native_1.TouchableOpacity onPress={cancel}>
                                     <react_native_1.Text style={[

package/dist/index.d.ts

@@ -1,4 +1,4 @@
 export { default as TimerPickerModal, TimerPickerModalProps, TimerPickerModalRef, } from "./components";
-export { default as TimerPicker, TimerPickerProps, } from "./components/TimerPicker";
+export { default as TimerPicker, TimerPickerProps, TimerPickerRef, } from "./components/TimerPicker";
 export { CustomTimerPickerModalStyles } from "./components/TimerPickerModal.styles";
 export { CustomTimerPickerStyles } from "./components/TimerPicker/TimerPicker.styles";

package/dist/utils/getScrollIndex.d.ts

@@ -0,0 +1,6 @@
+export declare const getScrollIndex: (variables: {
+    value: number;
+    numberOfItems: number;
+    padWithNItems: number;
+    disableInfiniteScroll?: boolean | undefined;
+}) => number;

package/dist/utils/getScrollIndex.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getScrollIndex = void 0;
+var getScrollIndex = function (variables) {
+    var value = variables.value, numberOfItems = variables.numberOfItems, padWithNItems = variables.padWithNItems, disableInfiniteScroll = variables.disableInfiniteScroll;
+    return (((value + numberOfItems) % (numberOfItems * 3)) +
+        (disableInfiniteScroll ? padWithNItems : 0) -
+        (padWithNItems - 1));
+};
+exports.getScrollIndex = getScrollIndex;

package/package.json

@@ -6,7 +6,7 @@
         "url": "https://github.com/troberts-28"
     },
     "license": "MIT",
-    "version": "1.2.0",
+    "version": "1.2.1",
     "main": "dist/index.js",
     "types": "dist/index.d.ts",
     "scripts": {