@quidone/react-native-wheel-picker
Version:
Picker is a UI component for selecting an item from a list of options.
74 lines (72 loc) • 2.15 kB
JavaScript
;
import { useEffect, useState } from 'react';
import { useStableCallback } from '@rozhkov/react-useful-hooks';
const useConnectSub = ({
control,
pickerName,
currentItem
}) => {
const [subscriber, setSubscriber] = useState(null);
useEffect(() => {
const sub = control._connect({
pickerName,
item: currentItem
});
setSubscriber(sub);
return () => {
sub.disconnect();
};
}, [control, pickerName]); // eslint-disable-line react-hooks/exhaustive-deps
return subscriber;
};
export const usePickerControlSubscriber = ({
control,
pickerName,
currentItem
}) => {
const subscriber = useConnectSub({
control,
pickerName,
currentItem
});
const [extraValues, setExtraValues] = useState([]);
const [enableSyncScrollAfterScrollEnd, setEnableSyncScrollAfterScrollEnd] = useState(true);
const onScrollStart = useStableCallback(() => {
setEnableSyncScrollAfterScrollEnd(false);
subscriber?.emitOnScrollStart();
});
const onScrollEnd = useStableCallback(subscriber?.emitOnScrollEnd);
const emitOnValueChanged = useStableCallback(subscriber?.emitOnValueChanged);
const emitOnValueChanging = useStableCallback(subscriber?.emitOnValueChanging);
useEffect(() => {
if (!subscriber) {
return;
}
setExtraValues(subscriber.getExtraValues());
const unsubscribeNewExtraValues = subscriber.onNewExtraValues(() => {
setExtraValues(subscriber.getExtraValues());
});
setEnableSyncScrollAfterScrollEnd(subscriber.getEveryIsStopped());
const unsubscribeAllScrollEnd = subscriber.onAllScrollEnd(() => {
setEnableSyncScrollAfterScrollEnd(subscriber.getEveryIsStopped());
});
return () => {
unsubscribeNewExtraValues();
unsubscribeAllScrollEnd();
};
}, [subscriber]);
useEffect(() => {
subscriber?.emitOnNewPropValue({
item: currentItem
});
}, [currentItem, subscriber]);
return {
extraValues,
enableSyncScrollAfterScrollEnd,
onScrollStart,
onScrollEnd,
emitOnValueChanged,
emitOnValueChanging
};
};
//# sourceMappingURL=usePickerControlSubscriber.js.map