"use client";
import { renderElement } from "../../utils/use-render.js";
import { useSliderContext } from "./context.js";
import { forwardRef } from "react";
//#region src/ui/slider/slider-thumb.tsx
/** Draggable handle for setting the slider value. Receives focus and handles keyboard interaction. */
const SliderThumb = forwardRef(function SliderThumb(componentProps, forwardedRef) {
	const { render, className, style, ...elementProps } = componentProps;
	const context = useSliderContext();
	const { state, thumbRef, thumbProps, getAttrs } = context;
	const attrs = getAttrs(state);
	return renderElement("div", {
		render,
		className,
		style
	}, {
		state,
		stateAttrMap: context.stateAttrMap,
		ref: [forwardedRef, thumbRef],
		props: [
			attrs,
			thumbProps,
			elementProps
		]
	});
});
//#endregion
export { SliderThumb };

//# sourceMappingURL=slider-thumb.js.map