@scrolia/react/dist/components/thumb/x.js

A headless scrollbar component

"use client";


const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.js');
const require_contexts_scrollcore = require('../../contexts/scrollcore.js');
const require_functions_props = require('../../functions/props.js');
const require_hooks_thumb = require('../../hooks/thumb.js');
const react = require_rolldown_runtime.__toESM(require("react"));
const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));

/** Horizontal thumb component. */
const ThumbX = (props) => {
	const { options: { plugins }, x: { setHvThumb, scrollbarLength, scrollbarOffset } } = require_contexts_scrollcore.useScrollCore();
	const p = require_functions_props.getComponentProps({
		name: "thumbX",
		props,
		plugins
	});
	react.useEffect(() => {
		setHvThumb(true);
	}, [setHvThumb]);
	const { onPointerDown } = require_hooks_thumb.useThumbXHandler();
	const handlePointerDown = (event) => {
		onPointerDown(event);
		p.onPointerDown?.(event);
	};
	const thumbStyle = {
		...p.style,
		width: Number.isNaN(scrollbarLength) ? 0 : scrollbarLength,
		left: Number.isNaN(scrollbarOffset) ? 0 : scrollbarOffset
	};
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
		...p,
		style: thumbStyle,
		onPointerDown: handlePointerDown,
		children: p.children
	});
};

exports.ThumbX = ThumbX;
//# sourceMappingURL=x.js.map