"use client";
import { mergeProps } from "../../utils/merge-props.js";
import { createButton } from "@videojs/core/dom";
import { useCallback } from "react";
//#region src/ui/hooks/use-button.ts
/**
* Hook for button behavior with keyboard and pointer interaction.
*
* @example
* ```tsx
* const { getButtonProps, buttonRef } = useButton({
*   displayName: 'PlayButton',
*   onActivate: () => togglePlayback(),
*   isDisabled: () => disabled,
* });
*
* return useRender('button', componentProps, {
*   state,
*   ref: [forwardedRef, buttonRef],
*   props: [elementProps, getButtonProps],
* });
* ```
*
* @param params - Button configuration with activation handler and disabled check.
*/
function useButton(params) {
	const { displayName, onActivate, isDisabled } = params;
	const buttonRef = useCallback((element) => {
		if (element && element.tagName !== "BUTTON") console.warn(`${displayName} should render a <button> element for accessibility`);
	}, [displayName]);
	return {
		getButtonProps: useCallback((externalProps) => {
			return mergeProps(createButton({
				onActivate,
				isDisabled
			}), externalProps);
		}, [onActivate, isDisabled]),
		buttonRef
	};
}
//#endregion
export { useButton };

//# sourceMappingURL=use-button.js.map