useClickToggle

@hua-labs/hua/motion

bash

npm install @hua-labs/hua

tsx

import { useClickToggle } from "@hua-labs/hua/framework";

tsx

const { isActive, clickHandlers } = useClickToggle();

return (
  <button
    {...clickHandlers}
    className={isActive ? 'bg-primary text-white' : 'bg-secondary'}
  >
    {isActive ? 'Active' : 'Inactive'}
  </button>
);


initialState	boolean	false	Initial active state
toggleOnClick	boolean	true	Toggle on click
toggleOnDoubleClick	boolean	false	Toggle on double-click
toggleOnEnter	boolean	true	Toggle on Enter key
toggleOnSpace	boolean	true	Toggle on Space key
toggleOnRightClick	boolean	false	Toggle on right-click (context menu)
autoReset	boolean	false	Auto-deactivate after delay
resetDelay	number	3000	Auto-reset delay in milliseconds
preventDefault	boolean	false	Prevent default event behavior
stopPropagation	boolean	false	Stop event propagation
showOnMount	boolean	false	Show initial state on mount (SSR safety)


isActive	boolean	Current toggle state
mounted	boolean	Hydration safety flag
clickHandlers	{ onClick?, onDoubleClick?, onContextMenu?, onKeyDown? }	Event handlers to spread on element
toggle	() => void	Toggle state manually
activate	() => void	Activate (set to true)
deactivate	() => void	Deactivate (set to false)
reset	() => void	Reset to initial state

useToggleMotion useFocusToggle