@ncdai/react-wheel-picker 1.0.3 → 1.0.4

package/dist/index.d.mts

@@ -54,5 +54,4 @@ type WheelPickerWrapperProps = {
 declare const WheelPickerWrapper: React$1.FC<WheelPickerWrapperProps>;
 declare const WheelPicker: React$1.FC<WheelPickerProps>;
 
-export { WheelPicker, WheelPickerWrapper };
-export type { WheelPickerClassNames, WheelPickerOption };
+export { WheelPicker, type WheelPickerClassNames, type WheelPickerOption, WheelPickerWrapper };

package/dist/index.d.ts

@@ -54,5 +54,4 @@ type WheelPickerWrapperProps = {
 declare const WheelPickerWrapper: React$1.FC<WheelPickerWrapperProps>;
 declare const WheelPicker: React$1.FC<WheelPickerProps>;
 
-export { WheelPicker, WheelPickerWrapper };
-export type { WheelPickerClassNames, WheelPickerOption };
+export { WheelPicker, type WheelPickerClassNames, type WheelPickerOption, WheelPickerWrapper };

package/dist/index.js

@@ -1,488 +1 @@
-'use client';
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-/* eslint-disable @typescript-eslint/no-explicit-any */ // This code comes from https://github.com/radix-ui/primitives/blob/main/packages/react/use-controllable-state/src/useControllableState.tsx
-function useCallbackRef(callback) {
-    const callbackRef = React__default.default.useRef(callback);
-    React__default.default.useEffect(()=>{
-        callbackRef.current = callback;
-    });
-    // https://github.com/facebook/react/issues/19240
-    return React__default.default.useMemo(()=>(...args)=>callbackRef.current == null ? void 0 : callbackRef.current.call(callbackRef, ...args), []);
-}
-function useUncontrolledState({ defaultProp, onChange }) {
-    const uncontrolledState = React__default.default.useState(defaultProp);
-    const [value] = uncontrolledState;
-    const prevValueRef = React__default.default.useRef(value);
-    const handleChange = useCallbackRef(onChange);
-    React__default.default.useEffect(()=>{
-        if (prevValueRef.current !== value) {
-            handleChange(value);
-            prevValueRef.current = value;
-        }
-    }, [
-        value,
-        prevValueRef,
-        handleChange
-    ]);
-    return uncontrolledState;
-}
-function useControllableState({ prop, defaultProp, onChange = ()=>{} }) {
-    const [uncontrolledProp, setUncontrolledProp] = useUncontrolledState({
-        defaultProp,
-        onChange
-    });
-    const isControlled = prop !== undefined;
-    const value = isControlled ? prop : uncontrolledProp;
-    const handleChange = useCallbackRef(onChange);
-    const setValue = React__default.default.useCallback((nextValue)=>{
-        if (isControlled) {
-            const setter = nextValue;
-            const value = typeof nextValue === "function" ? setter(prop) : nextValue;
-            if (value !== prop) handleChange(value);
-        } else {
-            setUncontrolledProp(nextValue);
-        }
-    }, [
-        isControlled,
-        prop,
-        setUncontrolledProp,
-        handleChange
-    ]);
-    return [
-        value,
-        setValue
-    ];
-}
-
-const WHEEL_THROTTLE = 150; // ms
-const RESISTANCE = 0.3; // Resistance when scrolling above the top or below the bottom
-const MAX_VELOCITY = 30; // Maximum velocity for the scroll animation
-const easeOutCubic = (p)=>Math.pow(p - 1, 3) + 1;
-const WheelPickerWrapper = ({ className, children })=>{
-    return /*#__PURE__*/ React__default.default.createElement("div", {
-        className: className,
-        "data-rwp-wrapper": true
-    }, children);
-};
-const WheelPicker = ({ defaultValue, value: valueProp, onValueChange, options: optionsProp, infinite: infiniteProp = false, visibleCount: countProp = 20, dragSensitivity: dragSensitivityProp = 3, classNames })=>{
-    var _optionsProp__value;
-    const [value = (()=>{
-        var _optionsProp_;
-        return (_optionsProp__value = (_optionsProp_ = optionsProp[0]) == null ? void 0 : _optionsProp_.value) != null ? _optionsProp__value : "";
-    })(), setValue] = useControllableState({
-        defaultProp: defaultValue,
-        prop: valueProp,
-        onChange: onValueChange
-    });
-    const options = React.useMemo(()=>{
-        if (!infiniteProp) {
-            return optionsProp;
-        }
-        const result = [];
-        const halfCount = Math.ceil(countProp / 2);
-        if (optionsProp.length === 0) {
-            return result;
-        }
-        while(result.length < halfCount){
-            result.push(...optionsProp);
-        }
-        return result;
-    }, [
-        countProp,
-        optionsProp,
-        infiniteProp
-    ]);
-    const itemHeight = 28;
-    const halfItemHeight = itemHeight * 0.5;
-    const itemAngle = 360 / countProp;
-    const radius = itemHeight / Math.tan(itemAngle * Math.PI / 180);
-    const containerHeight = Math.round(radius * 2 + itemHeight * 0.25);
-    const quarterCount = countProp >> 2; // Divide by 4
-    const baseDeceleration = dragSensitivityProp * 10;
-    const snapBackDeceleration = 10;
-    const containerRef = React.useRef(null);
-    const wheelItemsRef = React.useRef(null);
-    const highlightListRef = React.useRef(null);
-    const scrollRef = React.useRef(0);
-    const moveId = React.useRef(0);
-    const dragingRef = React.useRef(false);
-    const lastWheelRef = React.useRef(0);
-    const touchDataRef = React.useRef({
-        startY: 0,
-        yList: []
-    });
-    const dragControllerRef = React.useRef(null);
-    const renderWheelItems = React.useMemo(()=>{
-        const renderItem = (item, index, angle)=>/*#__PURE__*/ React__default.default.createElement("li", {
-                key: index,
-                className: classNames == null ? void 0 : classNames.optionItem,
-                "data-rwp-option": true,
-                "data-index": index,
-                style: {
-                    top: -14,
-                    height: itemHeight,
-                    lineHeight: `${itemHeight}px`,
-                    transform: `rotateX(${angle}deg) translateZ(${radius}px)`,
-                    visibility: "hidden"
-                }
-            }, item.label);
-        const items = options.map((option, index)=>renderItem(option, index, -itemAngle * index));
-        if (infiniteProp) {
-            for(let i = 0; i < quarterCount; ++i){
-                const prependIndex = -i - 1;
-                const appendIndex = i + options.length;
-                items.unshift(renderItem(options[options.length - i - 1], prependIndex, itemAngle * (i + 1)));
-                items.push(renderItem(options[i], appendIndex, -itemAngle * appendIndex));
-            }
-        }
-        return items;
-    }, [
-        halfItemHeight,
-        infiniteProp,
-        itemAngle,
-        options,
-        quarterCount,
-        radius,
-        classNames == null ? void 0 : classNames.optionItem
-    ]);
-    const renderHighlightItems = React.useMemo(()=>{
-        const renderItem = (item, key)=>/*#__PURE__*/ React__default.default.createElement("li", {
-                key: key,
-                "data-slot": "highlight-item",
-                className: classNames == null ? void 0 : classNames.highlightItem,
-                style: {
-                    height: itemHeight
-                }
-            }, item.label);
-        const items = options.map((option, index)=>renderItem(option, index));
-        if (infiniteProp) {
-            const firstItem = options[0];
-            const lastItem = options[options.length - 1];
-            items.unshift(renderItem(lastItem, "infinite-start"));
-            items.push(renderItem(firstItem, "infinite-end"));
-        }
-        return items;
-    }, [
-        classNames == null ? void 0 : classNames.highlightItem,
-        infiniteProp,
-        options
-    ]);
-    const normalizeScroll = (scroll)=>(scroll % options.length + options.length) % options.length;
-    const scrollTo = (scroll)=>{
-        const normalizedScroll = infiniteProp ? normalizeScroll(scroll) : scroll;
-        if (wheelItemsRef.current) {
-            const transform = `translateZ(${-radius}px) rotateX(${itemAngle * normalizedScroll}deg)`;
-            wheelItemsRef.current.style.transform = transform;
-            wheelItemsRef.current.childNodes.forEach((node)=>{
-                const li = node;
-                const distance = Math.abs(Number(li.dataset.index) - normalizedScroll);
-                li.style.visibility = distance > quarterCount ? "hidden" : "visible";
-            });
-        }
-        if (highlightListRef.current) {
-            highlightListRef.current.style.transform = `translateY(${-normalizedScroll * itemHeight}px)`;
-        }
-        return normalizedScroll;
-    };
-    const cancelAnimation = ()=>{
-        cancelAnimationFrame(moveId.current);
-    };
-    const animateScroll = (startScroll, endScroll, duration, onComplete)=>{
-        if (startScroll === endScroll || duration === 0) {
-            scrollTo(startScroll);
-            return;
-        }
-        const startTime = performance.now();
-        const totalDistance = endScroll - startScroll;
-        const tick = (currentTime)=>{
-            const elapsed = (currentTime - startTime) / 1000;
-            if (elapsed < duration) {
-                const progress = easeOutCubic(elapsed / duration);
-                scrollRef.current = scrollTo(startScroll + progress * totalDistance);
-                moveId.current = requestAnimationFrame(tick);
-            } else {
-                cancelAnimation();
-                scrollRef.current = scrollTo(endScroll);
-                onComplete == null ? void 0 : onComplete();
-            }
-        };
-        requestAnimationFrame(tick);
-    };
-    const selectByScroll = (scroll)=>{
-        const normalized = normalizeScroll(scroll) | 0;
-        const boundedScroll = infiniteProp ? normalized : Math.min(Math.max(normalized, 0), options.length - 1);
-        if (!infiniteProp && boundedScroll !== scroll) return;
-        scrollRef.current = scrollTo(boundedScroll);
-        const selected = options[scrollRef.current];
-        setValue(selected.value);
-    };
-    const selectByValue = (value)=>{
-        const index = options.findIndex((opt)=>opt.value === value);
-        if (index === -1) {
-            console.error("Invalid value selected:", value);
-            return;
-        }
-        cancelAnimation();
-        selectByScroll(index);
-    };
-    const updateScrollDuringDrag = (e)=>{
-        try {
-            var _e_touches_, _e_touches;
-            const currentY = (e instanceof MouseEvent ? e.clientY : (_e_touches = e.touches) == null ? void 0 : (_e_touches_ = _e_touches[0]) == null ? void 0 : _e_touches_.clientY) || 0;
-            const touchData = touchDataRef.current;
-            // Record current Y position with timestamp
-            touchData.yList.push([
-                currentY,
-                Date.now()
-            ]);
-            if (touchData.yList.length > 5) {
-                touchData.yList.shift(); // Keep latest 5 points for velocity calc
-            }
-            // Calculate delta in scroll position based on drag distance
-            const dragDelta = (touchData.startY - currentY) / itemHeight;
-            let nextScroll = scrollRef.current + dragDelta;
-            if (infiniteProp) {
-                // Wrap scroll for infinite lists
-                nextScroll = normalizeScroll(nextScroll);
-            } else {
-                const maxIndex = options.length;
-                if (nextScroll < 0) {
-                    // Apply resistance when dragging above top
-                    nextScroll *= RESISTANCE;
-                } else if (nextScroll > maxIndex) {
-                    // Apply resistance when dragging below bottom
-                    nextScroll = maxIndex + (nextScroll - maxIndex) * RESISTANCE;
-                }
-            }
-            // Update visual scroll and store position
-            touchData.touchScroll = scrollTo(nextScroll);
-        } catch (error) {
-            console.error("Error in updateScrollDuringDrag:", error);
-        }
-    };
-    const handleDragMoveEvent = (event)=>{
-        if (!dragingRef.current && !containerRef.current.contains(event.target) && event.target !== containerRef.current) {
-            return;
-        }
-        if (event.cancelable) {
-            event.preventDefault();
-        }
-        if (options.length) {
-            updateScrollDuringDrag(event);
-        }
-    };
-    const initiateDragGesture = (event)=>{
-        try {
-            var _containerRef_current, _event_touches_, _event_touches;
-            dragingRef.current = true;
-            const controller = new AbortController();
-            const { signal } = controller;
-            dragControllerRef.current = controller;
-            // Listen to movement events
-            const passiveOpts = {
-                signal,
-                passive: false
-            };
-            (_containerRef_current = containerRef.current) == null ? void 0 : _containerRef_current.addEventListener("touchmove", handleDragMoveEvent, passiveOpts);
-            document.addEventListener("mousemove", handleDragMoveEvent, passiveOpts);
-            const startY = (event instanceof MouseEvent ? event.clientY : (_event_touches = event.touches) == null ? void 0 : (_event_touches_ = _event_touches[0]) == null ? void 0 : _event_touches_.clientY) || 0;
-            // Initialize touch tracking
-            const touchData = touchDataRef.current;
-            touchData.startY = startY;
-            touchData.yList = [
-                [
-                    startY,
-                    Date.now()
-                ]
-            ];
-            touchData.touchScroll = scrollRef.current;
-            // Stop any ongoing scroll animation
-            cancelAnimation();
-        } catch (error) {
-            console.error("Error in initiateDragGesture:", error);
-        }
-    };
-    const handleDragStartEvent = React.useCallback((e)=>{
-        const isDragging = dragingRef.current;
-        const isTargetValid = containerRef.current.contains(e.target) || e.target === containerRef.current;
-        if ((isDragging || isTargetValid) && e.cancelable) {
-            e.preventDefault();
-            if (options.length) {
-                initiateDragGesture(e);
-            }
-        }
-    }, // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-        initiateDragGesture
-    ]);
-    const decelerateAndAnimateScroll = (initialVelocity)=>{
-        const currentScroll = scrollRef.current;
-        let targetScroll = currentScroll;
-        let deceleration = initialVelocity > 0 ? -baseDeceleration : baseDeceleration;
-        let duration = 0;
-        // Clamp utility to constrain a value within bounds
-        const clamp = (value, min, max)=>Math.max(min, Math.min(value, max));
-        if (infiniteProp) {
-            // Infinite mode: apply uniform deceleration to calculate scroll distance
-            duration = Math.abs(initialVelocity / deceleration);
-            const scrollDistance = initialVelocity * duration + 0.5 * deceleration * duration * duration;
-            targetScroll = Math.round(currentScroll + scrollDistance);
-        } else if (currentScroll < 0 || currentScroll > options.length - 1) {
-            // Out-of-bounds: snap back to nearest valid scroll index
-            const target = clamp(currentScroll, 0, options.length - 1);
-            const scrollDistance = currentScroll - target;
-            deceleration = snapBackDeceleration;
-            duration = Math.sqrt(Math.abs(scrollDistance / deceleration));
-            initialVelocity = deceleration * duration;
-            initialVelocity = currentScroll > 0 ? -initialVelocity : initialVelocity;
-            targetScroll = target;
-        } else {
-            // Normal decelerated scroll within bounds
-            duration = Math.abs(initialVelocity / deceleration);
-            const scrollDistance = initialVelocity * duration + 0.5 * deceleration * duration * duration;
-            targetScroll = Math.round(currentScroll + scrollDistance);
-            targetScroll = clamp(targetScroll, 0, options.length - 1);
-            const adjustedDistance = targetScroll - currentScroll;
-            duration = Math.sqrt(Math.abs(adjustedDistance / deceleration));
-        }
-        // Start animation to target scroll position with calculated duration
-        animateScroll(currentScroll, targetScroll, duration, ()=>{
-            selectByScroll(scrollRef.current); // Ensure selected item updates at end
-        });
-        // Fallback selection update (in case animation callback fails)
-        selectByScroll(scrollRef.current);
-    };
-    const finalizeDragAndStartInertiaScroll = ()=>{
-        try {
-            var _dragControllerRef_current;
-            (_dragControllerRef_current = dragControllerRef.current) == null ? void 0 : _dragControllerRef_current.abort();
-            dragControllerRef.current = null;
-            const touchData = touchDataRef.current;
-            const yList = touchData.yList;
-            let velocity = 0;
-            if (yList.length > 1) {
-                const len = yList.length;
-                var _yList_;
-                const [startY, startTime] = (_yList_ = yList[len - 2]) != null ? _yList_ : [
-                    0,
-                    0
-                ];
-                var _yList_1;
-                const [endY, endTime] = (_yList_1 = yList[len - 1]) != null ? _yList_1 : [
-                    0,
-                    0
-                ];
-                const timeDiff = endTime - startTime;
-                if (timeDiff > 0) {
-                    const distance = startY - endY;
-                    const velocityPerSecond = distance / itemHeight * 1000 / timeDiff;
-                    const maxVelocity = MAX_VELOCITY;
-                    const direction = velocityPerSecond > 0 ? 1 : -1;
-                    const absVelocity = Math.min(Math.abs(velocityPerSecond), maxVelocity);
-                    velocity = absVelocity * direction;
-                }
-            }
-            var _touchData_touchScroll;
-            scrollRef.current = (_touchData_touchScroll = touchData.touchScroll) != null ? _touchData_touchScroll : scrollRef.current;
-            decelerateAndAnimateScroll(velocity);
-        } catch (error) {
-            console.error("Error in finalizeDragAndStartInertiaScroll:", error);
-        } finally{
-            dragingRef.current = false;
-        }
-    };
-    const handleDragEndEvent = React.useCallback((event)=>{
-        if (!options.length) return;
-        const isDragging = dragingRef.current;
-        const isTargetValid = containerRef.current.contains(event.target) || event.target === containerRef.current;
-        if ((isDragging || isTargetValid) && event.cancelable) {
-            event.preventDefault();
-            finalizeDragAndStartInertiaScroll();
-        }
-    }, // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-        finalizeDragAndStartInertiaScroll
-    ]);
-    const scrollByWheel = (event)=>{
-        event.preventDefault();
-        const now = Date.now();
-        if (now - lastWheelRef.current < WHEEL_THROTTLE) return;
-        const direction = Math.sign(event.deltaY);
-        if (direction !== 0) {
-            selectByScroll(scrollRef.current + direction);
-            lastWheelRef.current = now;
-        }
-    };
-    const handleWheelEvent = React.useCallback((event)=>{
-        if (!options.length || !containerRef.current) return;
-        const isDragging = dragingRef.current;
-        const isTargetValid = containerRef.current.contains(event.target) || event.target === containerRef.current;
-        if ((isDragging || isTargetValid) && event.cancelable) {
-            event.preventDefault();
-            scrollByWheel(event);
-        }
-    }, // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-        scrollByWheel
-    ]);
-    React.useEffect(()=>{
-        const container = containerRef.current;
-        if (!container) return;
-        const controller = new AbortController();
-        const { signal } = controller;
-        const opts = {
-            signal,
-            passive: false
-        };
-        container.addEventListener("touchstart", handleDragStartEvent, opts);
-        container.addEventListener("touchend", handleDragEndEvent, opts);
-        container.addEventListener("wheel", handleWheelEvent, opts);
-        document.addEventListener("mousedown", handleDragStartEvent, opts);
-        document.addEventListener("mouseup", handleDragEndEvent, opts);
-        return ()=>controller.abort();
-    }, [
-        handleDragEndEvent,
-        handleDragStartEvent,
-        handleWheelEvent
-    ]);
-    React.useEffect(()=>{
-        selectByValue(value);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [
-        value,
-        valueProp
-    ]);
-    return /*#__PURE__*/ React__default.default.createElement("div", {
-        ref: containerRef,
-        "data-rwp": true,
-        style: {
-            height: containerHeight
-        }
-    }, /*#__PURE__*/ React__default.default.createElement("ul", {
-        ref: wheelItemsRef,
-        "data-rwp-options": true
-    }, renderWheelItems), /*#__PURE__*/ React__default.default.createElement("div", {
-        className: classNames == null ? void 0 : classNames.highlightWrapper,
-        "data-rwp-highlight-wrapper": true,
-        style: {
-            height: itemHeight,
-            lineHeight: itemHeight + "px"
-        }
-    }, /*#__PURE__*/ React__default.default.createElement("ul", {
-        ref: highlightListRef,
-        "data-rwp-highlight-list": true,
-        style: {
-            top: infiniteProp ? -28 : undefined
-        }
-    }, renderHighlightItems)));
-};
-
-exports.WheelPicker = WheelPicker;
-exports.WheelPickerWrapper = WheelPickerWrapper;
+"use client";var vt=Object.create;var x=Object.defineProperty;var Et=Object.getOwnPropertyDescriptor;var Tt=Object.getOwnPropertyNames;var Dt=Object.getPrototypeOf,Mt=Object.prototype.hasOwnProperty;var St=(c,l)=>{for(var d in l)x(c,d,{get:l[d],enumerable:!0})},et=(c,l,d,h)=>{if(l&&typeof l=="object"||typeof l=="function")for(let i of Tt(l))!Mt.call(c,i)&&i!==d&&x(c,i,{get:()=>l[i],enumerable:!(h=Et(l,i))||h.enumerable});return c};var nt=(c,l,d)=>(d=c!=null?vt(Dt(c)):{},et(l||!c||!c.__esModule?x(d,"default",{value:c,enumerable:!0}):d,c)),yt=c=>et(x({},"__esModule",{value:!0}),c);var xt={};St(xt,{WheelPicker:()=>kt,WheelPickerWrapper:()=>wt});module.exports=yt(xt);var M=nt(require("react")),u=require("react");var D=nt(require("react"));function rt(c){let l=D.default.useRef(c);return D.default.useEffect(()=>{l.current=c}),D.default.useMemo(()=>(...d)=>{var h;return(h=l.current)==null?void 0:h.call(l,...d)},[])}function Lt({defaultProp:c,onChange:l}){let d=D.default.useState(c),[h]=d,i=D.default.useRef(h),E=rt(l);return D.default.useEffect(()=>{i.current!==h&&(E(h),i.current=h)},[h,i,E]),d}function ot({prop:c,defaultProp:l,onChange:d=()=>{}}){let[h,i]=Lt({defaultProp:l,onChange:d}),E=c!==void 0,A=E?c:h,f=rt(d),W=D.default.useCallback(S=>{if(E){let m=typeof S=="function"?S(c):S;m!==c&&f(m)}else i(S)},[E,c,i,f]);return[A,W]}var It=150,ct=.3,Wt=30,Ct=c=>Math.pow(c-1,3)+1,wt=({className:c,children:l})=>M.default.createElement("div",{className:c,"data-rwp-wrapper":!0},l),kt=({defaultValue:c,value:l,onValueChange:d,options:h,infinite:i=!1,visibleCount:E=20,dragSensitivity:A=3,classNames:f})=>{var Q,V;let[W=(V=(Q=h[0])==null?void 0:Q.value)!=null?V:"",S]=ot({defaultProp:c,prop:l,onChange:d}),s=(0,u.useMemo)(()=>{if(!i)return h;let t=[],e=Math.ceil(E/2);if(h.length===0)return t;for(;t.length<e;)t.push(...h);return t},[E,h,i]),m=28,z=m*.5,y=360/E,C=m/Math.tan(y*Math.PI/180),st=Math.round(C*2+m*.25),Y=E>>2,B=A*10,at=10,b=(0,u.useRef)(null),w=(0,u.useRef)(null),R=(0,u.useRef)(null),v=(0,u.useRef)(0),X=(0,u.useRef)(0),L=(0,u.useRef)(!1),G=(0,u.useRef)(0),H=(0,u.useRef)({startY:0,yList:[]}),O=(0,u.useRef)(null),lt=(0,u.useMemo)(()=>{let t=(n,r,o)=>M.default.createElement("li",{key:r,className:f==null?void 0:f.optionItem,"data-rwp-option":!0,"data-index":r,style:{top:-z,height:m,lineHeight:`${m}px`,transform:`rotateX(${o}deg) translateZ(${C}px)`,visibility:"hidden"}},n.label),e=s.map((n,r)=>t(n,r,-y*r));if(i)for(let n=0;n<Y;++n){let r=-n-1,o=n+s.length;e.unshift(t(s[s.length-n-1],r,y*(n+1))),e.push(t(s[n],o,-y*o))}return e},[z,i,y,s,Y,C,f==null?void 0:f.optionItem]),it=(0,u.useMemo)(()=>{let t=(n,r)=>M.default.createElement("li",{key:r,"data-slot":"highlight-item",className:f==null?void 0:f.highlightItem,style:{height:m}},n.label),e=s.map((n,r)=>t(n,r));if(i){let n=s[0],r=s[s.length-1];e.unshift(t(r,"infinite-start")),e.push(t(n,"infinite-end"))}return e},[f==null?void 0:f.highlightItem,i,s]),F=t=>(t%s.length+s.length)%s.length,I=t=>{let e=i?F(t):t;if(w.current){let n=`translateZ(${-C}px) rotateX(${y*e}deg)`;w.current.style.transform=n,w.current.childNodes.forEach(r=>{let o=r,p=Math.abs(Number(o.dataset.index)-e);o.style.visibility=p>Y?"hidden":"visible"})}return R.current&&(R.current.style.transform=`translateY(${-e*m}px)`),e},P=()=>{cancelAnimationFrame(X.current)},ut=(t,e,n,r)=>{if(t===e||n===0){I(t);return}let o=performance.now(),p=e-t,a=g=>{let T=(g-o)/1e3;if(T<n){let q=Ct(T/n);v.current=I(t+q*p),X.current=requestAnimationFrame(a)}else P(),v.current=I(e),r==null||r()};requestAnimationFrame(a)},k=t=>{let e=F(t)|0,n=i?e:Math.min(Math.max(e,0),s.length-1);if(!i&&n!==t)return;v.current=I(n);let r=s[v.current];S(r.value)},ht=t=>{let e=s.findIndex(n=>n.value===t);if(e===-1){console.error("Invalid value selected:",t);return}P(),k(e)},dt=t=>{var e,n;try{let r=(t instanceof MouseEvent?t.clientY:(n=(e=t.touches)==null?void 0:e[0])==null?void 0:n.clientY)||0,o=H.current;o.yList.push([r,Date.now()]),o.yList.length>5&&o.yList.shift();let p=(o.startY-r)/m,a=v.current+p;if(i)a=F(a);else{let g=s.length;a<0?a*=ct:a>g&&(a=g+(a-g)*ct)}o.touchScroll=I(a)}catch(r){console.error("Error in updateScrollDuringDrag:",r)}},Z=t=>{!L.current&&!b.current.contains(t.target)&&t.target!==b.current||(t.cancelable&&t.preventDefault(),s.length&&dt(t))},_=t=>{var e,n,r;try{L.current=!0;let o=new AbortController,{signal:p}=o;O.current=o;let a={signal:p,passive:!1};(e=b.current)==null||e.addEventListener("touchmove",Z,a),document.addEventListener("mousemove",Z,a);let g=(t instanceof MouseEvent?t.clientY:(r=(n=t.touches)==null?void 0:n[0])==null?void 0:r.clientY)||0,T=H.current;T.startY=g,T.yList=[[g,Date.now()]],T.touchScroll=v.current,P()}catch(o){console.error("Error in initiateDragGesture:",o)}},U=(0,u.useCallback)(t=>{let e=L.current,n=b.current.contains(t.target)||t.target===b.current;(e||n)&&t.cancelable&&(t.preventDefault(),s.length&&_(t))},[_]),ft=t=>{let e=v.current,n=e,r=t>0?-B:B,o=0,p=(a,g,T)=>Math.max(g,Math.min(a,T));if(i){o=Math.abs(t/r);let a=t*o+.5*r*o*o;n=Math.round(e+a)}else if(e<0||e>s.length-1){let a=p(e,0,s.length-1),g=e-a;r=at,o=Math.sqrt(Math.abs(g/r)),t=r*o,t=e>0?-t:t,n=a}else{o=Math.abs(t/r);let a=t*o+.5*r*o*o;n=Math.round(e+a),n=p(n,0,s.length-1);let g=n-e;o=Math.sqrt(Math.abs(g/r))}ut(e,n,o,()=>{k(v.current)}),k(v.current)},j=()=>{var t,e,n,r;try{(t=O.current)==null||t.abort(),O.current=null;let o=H.current,p=o.yList,a=0;if(p.length>1){let g=p.length,[T,q]=(e=p[g-2])!=null?e:[0,0],[gt,mt]=(n=p[g-1])!=null?n:[0,0],N=mt-q;if(N>0){let tt=(T-gt)/m*1e3/N,pt=Wt,bt=tt>0?1:-1;a=Math.min(Math.abs(tt),pt)*bt}}v.current=(r=o.touchScroll)!=null?r:v.current,ft(a)}catch(o){console.error("Error in finalizeDragAndStartInertiaScroll:",o)}finally{L.current=!1}},$=(0,u.useCallback)(t=>{if(!s.length)return;let e=L.current,n=b.current.contains(t.target)||t.target===b.current;(e||n)&&t.cancelable&&(t.preventDefault(),j())},[j]),K=t=>{t.preventDefault();let e=Date.now();if(e-G.current<It)return;let n=Math.sign(t.deltaY);n!==0&&(k(v.current+n),G.current=e)},J=(0,u.useCallback)(t=>{if(!s.length||!b.current)return;let e=L.current,n=b.current.contains(t.target)||t.target===b.current;(e||n)&&t.cancelable&&(t.preventDefault(),K(t))},[K]);return(0,u.useEffect)(()=>{let t=b.current;if(!t)return;let e=new AbortController,{signal:n}=e,r={signal:n,passive:!1};return t.addEventListener("touchstart",U,r),t.addEventListener("touchend",$,r),t.addEventListener("wheel",J,r),document.addEventListener("mousedown",U,r),document.addEventListener("mouseup",$,r),()=>e.abort()},[$,U,J]),(0,u.useEffect)(()=>{ht(W)},[W,l]),M.default.createElement("div",{ref:b,"data-rwp":!0,style:{height:st}},M.default.createElement("ul",{ref:w,"data-rwp-options":!0},lt),M.default.createElement("div",{className:f==null?void 0:f.highlightWrapper,"data-rwp-highlight-wrapper":!0,style:{height:m,lineHeight:m+"px"}},M.default.createElement("ul",{ref:R,"data-rwp-highlight-list":!0,style:{top:i?-m:void 0}},it)))};0&&(module.exports={WheelPicker,WheelPickerWrapper});

package/dist/index.mjs

@@ -1,481 +1 @@
-'use client';
-import React, { useMemo, useRef, useCallback, useEffect } from 'react';
-
-/* eslint-disable @typescript-eslint/no-explicit-any */ // This code comes from https://github.com/radix-ui/primitives/blob/main/packages/react/use-controllable-state/src/useControllableState.tsx
-function useCallbackRef(callback) {
-    const callbackRef = React.useRef(callback);
-    React.useEffect(()=>{
-        callbackRef.current = callback;
-    });
-    // https://github.com/facebook/react/issues/19240
-    return React.useMemo(()=>(...args)=>callbackRef.current == null ? void 0 : callbackRef.current.call(callbackRef, ...args), []);
-}
-function useUncontrolledState({ defaultProp, onChange }) {
-    const uncontrolledState = React.useState(defaultProp);
-    const [value] = uncontrolledState;
-    const prevValueRef = React.useRef(value);
-    const handleChange = useCallbackRef(onChange);
-    React.useEffect(()=>{
-        if (prevValueRef.current !== value) {
-            handleChange(value);
-            prevValueRef.current = value;
-        }
-    }, [
-        value,
-        prevValueRef,
-        handleChange
-    ]);
-    return uncontrolledState;
-}
-function useControllableState({ prop, defaultProp, onChange = ()=>{} }) {
-    const [uncontrolledProp, setUncontrolledProp] = useUncontrolledState({
-        defaultProp,
-        onChange
-    });
-    const isControlled = prop !== undefined;
-    const value = isControlled ? prop : uncontrolledProp;
-    const handleChange = useCallbackRef(onChange);
-    const setValue = React.useCallback((nextValue)=>{
-        if (isControlled) {
-            const setter = nextValue;
-            const value = typeof nextValue === "function" ? setter(prop) : nextValue;
-            if (value !== prop) handleChange(value);
-        } else {
-            setUncontrolledProp(nextValue);
-        }
-    }, [
-        isControlled,
-        prop,
-        setUncontrolledProp,
-        handleChange
-    ]);
-    return [
-        value,
-        setValue
-    ];
-}
-
-const WHEEL_THROTTLE = 150; // ms
-const RESISTANCE = 0.3; // Resistance when scrolling above the top or below the bottom
-const MAX_VELOCITY = 30; // Maximum velocity for the scroll animation
-const easeOutCubic = (p)=>Math.pow(p - 1, 3) + 1;
-const WheelPickerWrapper = ({ className, children })=>{
-    return /*#__PURE__*/ React.createElement("div", {
-        className: className,
-        "data-rwp-wrapper": true
-    }, children);
-};
-const WheelPicker = ({ defaultValue, value: valueProp, onValueChange, options: optionsProp, infinite: infiniteProp = false, visibleCount: countProp = 20, dragSensitivity: dragSensitivityProp = 3, classNames })=>{
-    var _optionsProp__value;
-    const [value = (()=>{
-        var _optionsProp_;
-        return (_optionsProp__value = (_optionsProp_ = optionsProp[0]) == null ? void 0 : _optionsProp_.value) != null ? _optionsProp__value : "";
-    })(), setValue] = useControllableState({
-        defaultProp: defaultValue,
-        prop: valueProp,
-        onChange: onValueChange
-    });
-    const options = useMemo(()=>{
-        if (!infiniteProp) {
-            return optionsProp;
-        }
-        const result = [];
-        const halfCount = Math.ceil(countProp / 2);
-        if (optionsProp.length === 0) {
-            return result;
-        }
-        while(result.length < halfCount){
-            result.push(...optionsProp);
-        }
-        return result;
-    }, [
-        countProp,
-        optionsProp,
-        infiniteProp
-    ]);
-    const itemHeight = 28;
-    const halfItemHeight = itemHeight * 0.5;
-    const itemAngle = 360 / countProp;
-    const radius = itemHeight / Math.tan(itemAngle * Math.PI / 180);
-    const containerHeight = Math.round(radius * 2 + itemHeight * 0.25);
-    const quarterCount = countProp >> 2; // Divide by 4
-    const baseDeceleration = dragSensitivityProp * 10;
-    const snapBackDeceleration = 10;
-    const containerRef = useRef(null);
-    const wheelItemsRef = useRef(null);
-    const highlightListRef = useRef(null);
-    const scrollRef = useRef(0);
-    const moveId = useRef(0);
-    const dragingRef = useRef(false);
-    const lastWheelRef = useRef(0);
-    const touchDataRef = useRef({
-        startY: 0,
-        yList: []
-    });
-    const dragControllerRef = useRef(null);
-    const renderWheelItems = useMemo(()=>{
-        const renderItem = (item, index, angle)=>/*#__PURE__*/ React.createElement("li", {
-                key: index,
-                className: classNames == null ? void 0 : classNames.optionItem,
-                "data-rwp-option": true,
-                "data-index": index,
-                style: {
-                    top: -14,
-                    height: itemHeight,
-                    lineHeight: `${itemHeight}px`,
-                    transform: `rotateX(${angle}deg) translateZ(${radius}px)`,
-                    visibility: "hidden"
-                }
-            }, item.label);
-        const items = options.map((option, index)=>renderItem(option, index, -itemAngle * index));
-        if (infiniteProp) {
-            for(let i = 0; i < quarterCount; ++i){
-                const prependIndex = -i - 1;
-                const appendIndex = i + options.length;
-                items.unshift(renderItem(options[options.length - i - 1], prependIndex, itemAngle * (i + 1)));
-                items.push(renderItem(options[i], appendIndex, -itemAngle * appendIndex));
-            }
-        }
-        return items;
-    }, [
-        halfItemHeight,
-        infiniteProp,
-        itemAngle,
-        options,
-        quarterCount,
-        radius,
-        classNames == null ? void 0 : classNames.optionItem
-    ]);
-    const renderHighlightItems = useMemo(()=>{
-        const renderItem = (item, key)=>/*#__PURE__*/ React.createElement("li", {
-                key: key,
-                "data-slot": "highlight-item",
-                className: classNames == null ? void 0 : classNames.highlightItem,
-                style: {
-                    height: itemHeight
-                }
-            }, item.label);
-        const items = options.map((option, index)=>renderItem(option, index));
-        if (infiniteProp) {
-            const firstItem = options[0];
-            const lastItem = options[options.length - 1];
-            items.unshift(renderItem(lastItem, "infinite-start"));
-            items.push(renderItem(firstItem, "infinite-end"));
-        }
-        return items;
-    }, [
-        classNames == null ? void 0 : classNames.highlightItem,
-        infiniteProp,
-        options
-    ]);
-    const normalizeScroll = (scroll)=>(scroll % options.length + options.length) % options.length;
-    const scrollTo = (scroll)=>{
-        const normalizedScroll = infiniteProp ? normalizeScroll(scroll) : scroll;
-        if (wheelItemsRef.current) {
-            const transform = `translateZ(${-radius}px) rotateX(${itemAngle * normalizedScroll}deg)`;
-            wheelItemsRef.current.style.transform = transform;
-            wheelItemsRef.current.childNodes.forEach((node)=>{
-                const li = node;
-                const distance = Math.abs(Number(li.dataset.index) - normalizedScroll);
-                li.style.visibility = distance > quarterCount ? "hidden" : "visible";
-            });
-        }
-        if (highlightListRef.current) {
-            highlightListRef.current.style.transform = `translateY(${-normalizedScroll * itemHeight}px)`;
-        }
-        return normalizedScroll;
-    };
-    const cancelAnimation = ()=>{
-        cancelAnimationFrame(moveId.current);
-    };
-    const animateScroll = (startScroll, endScroll, duration, onComplete)=>{
-        if (startScroll === endScroll || duration === 0) {
-            scrollTo(startScroll);
-            return;
-        }
-        const startTime = performance.now();
-        const totalDistance = endScroll - startScroll;
-        const tick = (currentTime)=>{
-            const elapsed = (currentTime - startTime) / 1000;
-            if (elapsed < duration) {
-                const progress = easeOutCubic(elapsed / duration);
-                scrollRef.current = scrollTo(startScroll + progress * totalDistance);
-                moveId.current = requestAnimationFrame(tick);
-            } else {
-                cancelAnimation();
-                scrollRef.current = scrollTo(endScroll);
-                onComplete == null ? void 0 : onComplete();
-            }
-        };
-        requestAnimationFrame(tick);
-    };
-    const selectByScroll = (scroll)=>{
-        const normalized = normalizeScroll(scroll) | 0;
-        const boundedScroll = infiniteProp ? normalized : Math.min(Math.max(normalized, 0), options.length - 1);
-        if (!infiniteProp && boundedScroll !== scroll) return;
-        scrollRef.current = scrollTo(boundedScroll);
-        const selected = options[scrollRef.current];
-        setValue(selected.value);
-    };
-    const selectByValue = (value)=>{
-        const index = options.findIndex((opt)=>opt.value === value);
-        if (index === -1) {
-            console.error("Invalid value selected:", value);
-            return;
-        }
-        cancelAnimation();
-        selectByScroll(index);
-    };
-    const updateScrollDuringDrag = (e)=>{
-        try {
-            var _e_touches_, _e_touches;
-            const currentY = (e instanceof MouseEvent ? e.clientY : (_e_touches = e.touches) == null ? void 0 : (_e_touches_ = _e_touches[0]) == null ? void 0 : _e_touches_.clientY) || 0;
-            const touchData = touchDataRef.current;
-            // Record current Y position with timestamp
-            touchData.yList.push([
-                currentY,
-                Date.now()
-            ]);
-            if (touchData.yList.length > 5) {
-                touchData.yList.shift(); // Keep latest 5 points for velocity calc
-            }
-            // Calculate delta in scroll position based on drag distance
-            const dragDelta = (touchData.startY - currentY) / itemHeight;
-            let nextScroll = scrollRef.current + dragDelta;
-            if (infiniteProp) {
-                // Wrap scroll for infinite lists
-                nextScroll = normalizeScroll(nextScroll);
-            } else {
-                const maxIndex = options.length;
-                if (nextScroll < 0) {
-                    // Apply resistance when dragging above top
-                    nextScroll *= RESISTANCE;
-                } else if (nextScroll > maxIndex) {
-                    // Apply resistance when dragging below bottom
-                    nextScroll = maxIndex + (nextScroll - maxIndex) * RESISTANCE;
-                }
-            }
-            // Update visual scroll and store position
-            touchData.touchScroll = scrollTo(nextScroll);
-        } catch (error) {
-            console.error("Error in updateScrollDuringDrag:", error);
-        }
-    };
-    const handleDragMoveEvent = (event)=>{
-        if (!dragingRef.current && !containerRef.current.contains(event.target) && event.target !== containerRef.current) {
-            return;
-        }
-        if (event.cancelable) {
-            event.preventDefault();
-        }
-        if (options.length) {
-            updateScrollDuringDrag(event);
-        }
-    };
-    const initiateDragGesture = (event)=>{
-        try {
-            var _containerRef_current, _event_touches_, _event_touches;
-            dragingRef.current = true;
-            const controller = new AbortController();
-            const { signal } = controller;
-            dragControllerRef.current = controller;
-            // Listen to movement events
-            const passiveOpts = {
-                signal,
-                passive: false
-            };
-            (_containerRef_current = containerRef.current) == null ? void 0 : _containerRef_current.addEventListener("touchmove", handleDragMoveEvent, passiveOpts);
-            document.addEventListener("mousemove", handleDragMoveEvent, passiveOpts);
-            const startY = (event instanceof MouseEvent ? event.clientY : (_event_touches = event.touches) == null ? void 0 : (_event_touches_ = _event_touches[0]) == null ? void 0 : _event_touches_.clientY) || 0;
-            // Initialize touch tracking
-            const touchData = touchDataRef.current;
-            touchData.startY = startY;
-            touchData.yList = [
-                [
-                    startY,
-                    Date.now()
-                ]
-            ];
-            touchData.touchScroll = scrollRef.current;
-            // Stop any ongoing scroll animation
-            cancelAnimation();
-        } catch (error) {
-            console.error("Error in initiateDragGesture:", error);
-        }
-    };
-    const handleDragStartEvent = useCallback((e)=>{
-        const isDragging = dragingRef.current;
-        const isTargetValid = containerRef.current.contains(e.target) || e.target === containerRef.current;
-        if ((isDragging || isTargetValid) && e.cancelable) {
-            e.preventDefault();
-            if (options.length) {
-                initiateDragGesture(e);
-            }
-        }
-    }, // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-        initiateDragGesture
-    ]);
-    const decelerateAndAnimateScroll = (initialVelocity)=>{
-        const currentScroll = scrollRef.current;
-        let targetScroll = currentScroll;
-        let deceleration = initialVelocity > 0 ? -baseDeceleration : baseDeceleration;
-        let duration = 0;
-        // Clamp utility to constrain a value within bounds
-        const clamp = (value, min, max)=>Math.max(min, Math.min(value, max));
-        if (infiniteProp) {
-            // Infinite mode: apply uniform deceleration to calculate scroll distance
-            duration = Math.abs(initialVelocity / deceleration);
-            const scrollDistance = initialVelocity * duration + 0.5 * deceleration * duration * duration;
-            targetScroll = Math.round(currentScroll + scrollDistance);
-        } else if (currentScroll < 0 || currentScroll > options.length - 1) {
-            // Out-of-bounds: snap back to nearest valid scroll index
-            const target = clamp(currentScroll, 0, options.length - 1);
-            const scrollDistance = currentScroll - target;
-            deceleration = snapBackDeceleration;
-            duration = Math.sqrt(Math.abs(scrollDistance / deceleration));
-            initialVelocity = deceleration * duration;
-            initialVelocity = currentScroll > 0 ? -initialVelocity : initialVelocity;
-            targetScroll = target;
-        } else {
-            // Normal decelerated scroll within bounds
-            duration = Math.abs(initialVelocity / deceleration);
-            const scrollDistance = initialVelocity * duration + 0.5 * deceleration * duration * duration;
-            targetScroll = Math.round(currentScroll + scrollDistance);
-            targetScroll = clamp(targetScroll, 0, options.length - 1);
-            const adjustedDistance = targetScroll - currentScroll;
-            duration = Math.sqrt(Math.abs(adjustedDistance / deceleration));
-        }
-        // Start animation to target scroll position with calculated duration
-        animateScroll(currentScroll, targetScroll, duration, ()=>{
-            selectByScroll(scrollRef.current); // Ensure selected item updates at end
-        });
-        // Fallback selection update (in case animation callback fails)
-        selectByScroll(scrollRef.current);
-    };
-    const finalizeDragAndStartInertiaScroll = ()=>{
-        try {
-            var _dragControllerRef_current;
-            (_dragControllerRef_current = dragControllerRef.current) == null ? void 0 : _dragControllerRef_current.abort();
-            dragControllerRef.current = null;
-            const touchData = touchDataRef.current;
-            const yList = touchData.yList;
-            let velocity = 0;
-            if (yList.length > 1) {
-                const len = yList.length;
-                var _yList_;
-                const [startY, startTime] = (_yList_ = yList[len - 2]) != null ? _yList_ : [
-                    0,
-                    0
-                ];
-                var _yList_1;
-                const [endY, endTime] = (_yList_1 = yList[len - 1]) != null ? _yList_1 : [
-                    0,
-                    0
-                ];
-                const timeDiff = endTime - startTime;
-                if (timeDiff > 0) {
-                    const distance = startY - endY;
-                    const velocityPerSecond = distance / itemHeight * 1000 / timeDiff;
-                    const maxVelocity = MAX_VELOCITY;
-                    const direction = velocityPerSecond > 0 ? 1 : -1;
-                    const absVelocity = Math.min(Math.abs(velocityPerSecond), maxVelocity);
-                    velocity = absVelocity * direction;
-                }
-            }
-            var _touchData_touchScroll;
-            scrollRef.current = (_touchData_touchScroll = touchData.touchScroll) != null ? _touchData_touchScroll : scrollRef.current;
-            decelerateAndAnimateScroll(velocity);
-        } catch (error) {
-            console.error("Error in finalizeDragAndStartInertiaScroll:", error);
-        } finally{
-            dragingRef.current = false;
-        }
-    };
-    const handleDragEndEvent = useCallback((event)=>{
-        if (!options.length) return;
-        const isDragging = dragingRef.current;
-        const isTargetValid = containerRef.current.contains(event.target) || event.target === containerRef.current;
-        if ((isDragging || isTargetValid) && event.cancelable) {
-            event.preventDefault();
-            finalizeDragAndStartInertiaScroll();
-        }
-    }, // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-        finalizeDragAndStartInertiaScroll
-    ]);
-    const scrollByWheel = (event)=>{
-        event.preventDefault();
-        const now = Date.now();
-        if (now - lastWheelRef.current < WHEEL_THROTTLE) return;
-        const direction = Math.sign(event.deltaY);
-        if (direction !== 0) {
-            selectByScroll(scrollRef.current + direction);
-            lastWheelRef.current = now;
-        }
-    };
-    const handleWheelEvent = useCallback((event)=>{
-        if (!options.length || !containerRef.current) return;
-        const isDragging = dragingRef.current;
-        const isTargetValid = containerRef.current.contains(event.target) || event.target === containerRef.current;
-        if ((isDragging || isTargetValid) && event.cancelable) {
-            event.preventDefault();
-            scrollByWheel(event);
-        }
-    }, // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-        scrollByWheel
-    ]);
-    useEffect(()=>{
-        const container = containerRef.current;
-        if (!container) return;
-        const controller = new AbortController();
-        const { signal } = controller;
-        const opts = {
-            signal,
-            passive: false
-        };
-        container.addEventListener("touchstart", handleDragStartEvent, opts);
-        container.addEventListener("touchend", handleDragEndEvent, opts);
-        container.addEventListener("wheel", handleWheelEvent, opts);
-        document.addEventListener("mousedown", handleDragStartEvent, opts);
-        document.addEventListener("mouseup", handleDragEndEvent, opts);
-        return ()=>controller.abort();
-    }, [
-        handleDragEndEvent,
-        handleDragStartEvent,
-        handleWheelEvent
-    ]);
-    useEffect(()=>{
-        selectByValue(value);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [
-        value,
-        valueProp
-    ]);
-    return /*#__PURE__*/ React.createElement("div", {
-        ref: containerRef,
-        "data-rwp": true,
-        style: {
-            height: containerHeight
-        }
-    }, /*#__PURE__*/ React.createElement("ul", {
-        ref: wheelItemsRef,
-        "data-rwp-options": true
-    }, renderWheelItems), /*#__PURE__*/ React.createElement("div", {
-        className: classNames == null ? void 0 : classNames.highlightWrapper,
-        "data-rwp-highlight-wrapper": true,
-        style: {
-            height: itemHeight,
-            lineHeight: itemHeight + "px"
-        }
-    }, /*#__PURE__*/ React.createElement("ul", {
-        ref: highlightListRef,
-        "data-rwp-highlight-list": true,
-        style: {
-            top: infiniteProp ? -28 : undefined
-        }
-    }, renderHighlightItems)));
-};
-
-export { WheelPicker, WheelPickerWrapper };
+"use client";import M from"react";import{useCallback as q,useEffect as ot,useMemo as z,useRef as T}from"react";import D from"react";function nt(u){let g=D.useRef(u);return D.useEffect(()=>{g.current=u}),D.useMemo(()=>(...E)=>{var h;return(h=g.current)==null?void 0:h.call(g,...E)},[])}function vt({defaultProp:u,onChange:g}){let E=D.useState(u),[h]=E,a=D.useRef(h),b=nt(g);return D.useEffect(()=>{a.current!==h&&(b(h),a.current=h)},[h,a,b]),E}function rt({prop:u,defaultProp:g,onChange:E=()=>{}}){let[h,a]=vt({defaultProp:g,onChange:E}),b=u!==void 0,x=b?u:h,l=nt(E),W=D.useCallback(S=>{if(b){let d=typeof S=="function"?S(u):S;d!==u&&l(d)}else a(S)},[b,u,a,l]);return[x,W]}var Et=150,ct=.3,Tt=30,Dt=u=>Math.pow(u-1,3)+1,wt=({className:u,children:g})=>M.createElement("div",{className:u,"data-rwp-wrapper":!0},g),kt=({defaultValue:u,value:g,onValueChange:E,options:h,infinite:a=!1,visibleCount:b=20,dragSensitivity:x=3,classNames:l})=>{var V,N;let[W=(N=(V=h[0])==null?void 0:V.value)!=null?N:"",S]=rt({defaultProp:u,prop:g,onChange:E}),c=z(()=>{if(!a)return h;let t=[],e=Math.ceil(b/2);if(h.length===0)return t;for(;t.length<e;)t.push(...h);return t},[b,h,a]),d=28,B=d*.5,y=360/b,C=d/Math.tan(y*Math.PI/180),st=Math.round(C*2+d*.25),A=b>>2,X=x*10,at=10,m=T(null),w=T(null),Y=T(null),p=T(0),G=T(0),L=T(!1),Z=T(0),R=T({startY:0,yList:[]}),H=T(null),lt=z(()=>{let t=(n,r,o)=>M.createElement("li",{key:r,className:l==null?void 0:l.optionItem,"data-rwp-option":!0,"data-index":r,style:{top:-B,height:d,lineHeight:`${d}px`,transform:`rotateX(${o}deg) translateZ(${C}px)`,visibility:"hidden"}},n.label),e=c.map((n,r)=>t(n,r,-y*r));if(a)for(let n=0;n<A;++n){let r=-n-1,o=n+c.length;e.unshift(t(c[c.length-n-1],r,y*(n+1))),e.push(t(c[n],o,-y*o))}return e},[B,a,y,c,A,C,l==null?void 0:l.optionItem]),it=z(()=>{let t=(n,r)=>M.createElement("li",{key:r,"data-slot":"highlight-item",className:l==null?void 0:l.highlightItem,style:{height:d}},n.label),e=c.map((n,r)=>t(n,r));if(a){let n=c[0],r=c[c.length-1];e.unshift(t(r,"infinite-start")),e.push(t(n,"infinite-end"))}return e},[l==null?void 0:l.highlightItem,a,c]),O=t=>(t%c.length+c.length)%c.length,I=t=>{let e=a?O(t):t;if(w.current){let n=`translateZ(${-C}px) rotateX(${y*e}deg)`;w.current.style.transform=n,w.current.childNodes.forEach(r=>{let o=r,f=Math.abs(Number(o.dataset.index)-e);o.style.visibility=f>A?"hidden":"visible"})}return Y.current&&(Y.current.style.transform=`translateY(${-e*d}px)`),e},F=()=>{cancelAnimationFrame(G.current)},ut=(t,e,n,r)=>{if(t===e||n===0){I(t);return}let o=performance.now(),f=e-t,s=i=>{let v=(i-o)/1e3;if(v<n){let $=Dt(v/n);p.current=I(t+$*f),G.current=requestAnimationFrame(s)}else F(),p.current=I(e),r==null||r()};requestAnimationFrame(s)},k=t=>{let e=O(t)|0,n=a?e:Math.min(Math.max(e,0),c.length-1);if(!a&&n!==t)return;p.current=I(n);let r=c[p.current];S(r.value)},ht=t=>{let e=c.findIndex(n=>n.value===t);if(e===-1){console.error("Invalid value selected:",t);return}F(),k(e)},dt=t=>{var e,n;try{let r=(t instanceof MouseEvent?t.clientY:(n=(e=t.touches)==null?void 0:e[0])==null?void 0:n.clientY)||0,o=R.current;o.yList.push([r,Date.now()]),o.yList.length>5&&o.yList.shift();let f=(o.startY-r)/d,s=p.current+f;if(a)s=O(s);else{let i=c.length;s<0?s*=ct:s>i&&(s=i+(s-i)*ct)}o.touchScroll=I(s)}catch(r){console.error("Error in updateScrollDuringDrag:",r)}},_=t=>{!L.current&&!m.current.contains(t.target)&&t.target!==m.current||(t.cancelable&&t.preventDefault(),c.length&&dt(t))},j=t=>{var e,n,r;try{L.current=!0;let o=new AbortController,{signal:f}=o;H.current=o;let s={signal:f,passive:!1};(e=m.current)==null||e.addEventListener("touchmove",_,s),document.addEventListener("mousemove",_,s);let i=(t instanceof MouseEvent?t.clientY:(r=(n=t.touches)==null?void 0:n[0])==null?void 0:r.clientY)||0,v=R.current;v.startY=i,v.yList=[[i,Date.now()]],v.touchScroll=p.current,F()}catch(o){console.error("Error in initiateDragGesture:",o)}},P=q(t=>{let e=L.current,n=m.current.contains(t.target)||t.target===m.current;(e||n)&&t.cancelable&&(t.preventDefault(),c.length&&j(t))},[j]),ft=t=>{let e=p.current,n=e,r=t>0?-X:X,o=0,f=(s,i,v)=>Math.max(i,Math.min(s,v));if(a){o=Math.abs(t/r);let s=t*o+.5*r*o*o;n=Math.round(e+s)}else if(e<0||e>c.length-1){let s=f(e,0,c.length-1),i=e-s;r=at,o=Math.sqrt(Math.abs(i/r)),t=r*o,t=e>0?-t:t,n=s}else{o=Math.abs(t/r);let s=t*o+.5*r*o*o;n=Math.round(e+s),n=f(n,0,c.length-1);let i=n-e;o=Math.sqrt(Math.abs(i/r))}ut(e,n,o,()=>{k(p.current)}),k(p.current)},K=()=>{var t,e,n,r;try{(t=H.current)==null||t.abort(),H.current=null;let o=R.current,f=o.yList,s=0;if(f.length>1){let i=f.length,[v,$]=(e=f[i-2])!=null?e:[0,0],[gt,mt]=(n=f[i-1])!=null?n:[0,0],tt=mt-$;if(tt>0){let et=(v-gt)/d*1e3/tt,pt=Tt,bt=et>0?1:-1;s=Math.min(Math.abs(et),pt)*bt}}p.current=(r=o.touchScroll)!=null?r:p.current,ft(s)}catch(o){console.error("Error in finalizeDragAndStartInertiaScroll:",o)}finally{L.current=!1}},U=q(t=>{if(!c.length)return;let e=L.current,n=m.current.contains(t.target)||t.target===m.current;(e||n)&&t.cancelable&&(t.preventDefault(),K())},[K]),J=t=>{t.preventDefault();let e=Date.now();if(e-Z.current<Et)return;let n=Math.sign(t.deltaY);n!==0&&(k(p.current+n),Z.current=e)},Q=q(t=>{if(!c.length||!m.current)return;let e=L.current,n=m.current.contains(t.target)||t.target===m.current;(e||n)&&t.cancelable&&(t.preventDefault(),J(t))},[J]);return ot(()=>{let t=m.current;if(!t)return;let e=new AbortController,{signal:n}=e,r={signal:n,passive:!1};return t.addEventListener("touchstart",P,r),t.addEventListener("touchend",U,r),t.addEventListener("wheel",Q,r),document.addEventListener("mousedown",P,r),document.addEventListener("mouseup",U,r),()=>e.abort()},[U,P,Q]),ot(()=>{ht(W)},[W,g]),M.createElement("div",{ref:m,"data-rwp":!0,style:{height:st}},M.createElement("ul",{ref:w,"data-rwp-options":!0},lt),M.createElement("div",{className:l==null?void 0:l.highlightWrapper,"data-rwp-highlight-wrapper":!0,style:{height:d,lineHeight:d+"px"}},M.createElement("ul",{ref:Y,"data-rwp-highlight-list":!0,style:{top:a?-d:void 0}},it)))};export{kt as WheelPicker,wt as WheelPickerWrapper};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ncdai/react-wheel-picker",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "iOS-like wheel picker for React with smooth inertia scrolling and infinite loop support.",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -21,11 +21,22 @@
     },
     "./dist/style.css": "./dist/style.css"
   },
+  "tsup": {
+    "entry": [
+      "src/index.tsx"
+    ],
+    "format": [
+      "esm",
+      "cjs"
+    ],
+    "dts": true,
+    "clean": true,
+    "publicDir": "./src/assets"
+  },
   "scripts": {
-    "dev": "bunchee --watch",
-    "build": "bunchee && pnpm copy-assets",
+    "dev": "tsup --watch",
+    "build": "tsup --minify",
     "type-check": "tsc --noEmit",
-    "copy-assets": "cp -r ./src/style.css ./dist/style.css",
     "dev:website": "turbo run dev --filter=website...",
     "prettier:check": "prettier --check .",
     "format": "prettier --write .",
@@ -53,9 +64,9 @@
   "devDependencies": {
     "@types/node": "^20",
     "@types/react": "^19",
-    "bunchee": "^6.5.1",
     "prettier": "3.5.3",
     "react": "^19.0.0",
+    "tsup": "8.5.0",
     "turbo": "^2.5.3",
     "typescript": "^5.8.3"
   },