@scrolia/react-native
Version:
A headless scrollbar component
45 lines (42 loc) • 1.3 kB
JavaScript
"use client";
import { useScrollCore } from "../../contexts/scrollcore.mjs";
import { getComponentProps } from "../../functions/props.mjs";
import { useThumbXHandler } from "../../hooks/thumb/index.mjs";
import { Animated, View } from "react-native";
import * as React from "react";
import { jsx } from "react/jsx-runtime";
/** Horizontal thumb component. */
const ThumbX = (props) => {
const { options: { animated, plugins }, x: { setHvThumb, scrollbarLength, scrollbarOffset } } = useScrollCore();
const p = getComponentProps({
name: "thumbX",
props,
plugins
});
React.useEffect(() => {
setHvThumb(true);
}, [setHvThumb]);
const { panResponder } = useThumbXHandler();
if (animated) return /* @__PURE__ */ jsx(Animated.View, {
...p,
...panResponder.panHandlers,
ref: p.ref,
style: [p.style, {
width: Number.isNaN(scrollbarLength) ? 0 : scrollbarLength,
left: Number.isNaN(scrollbarOffset) ? 0 : scrollbarOffset
}],
children: p.children
});
return /* @__PURE__ */ jsx(View, {
...p,
...panResponder.panHandlers,
ref: p.ref,
style: [p.style, {
width: Number.isNaN(scrollbarLength) ? 0 : scrollbarLength,
left: Number.isNaN(scrollbarOffset) ? 0 : scrollbarOffset
}],
children: p.children
});
};
export { ThumbX };
//# sourceMappingURL=x.mjs.map