All Events

Listen to all available timepicker events

Complete Event Handling

All events are logged below in real-time:

All Callbacks

Every interaction triggers a callback

Event Log

No events yet. Interact with the timepicker above.

import { Timepicker } from "timepicker-ui-react";

function App() {
  return (
    <Timepicker
      onOpen={(data) => console.log("Opened:", data)}
      onConfirm={(data) => console.log("Confirmed:", data)}
      onCancel={() => console.log("Cancelled")}
      onUpdate={(data) => console.log("Updated:", data)}
      onSelectHour={(data) => console.log("Hour:", data)}
      onSelectMinute={(data) => console.log("Minute:", data)}
      onSelectAM={() => console.log("AM selected")}
      onSelectPM={() => console.log("PM selected")}
    />
  );
}

Available Events

Event	Description
onOpen	Timepicker modal opened
onConfirm	OK button clicked
onCancel	Cancel button or backdrop clicked
onUpdate	Time value changed
onSelectHour	Hour selected on clock
onSelectMinute	Minute selected on clock
onSelectAM	AM button clicked (12h mode)
onSelectPM	PM button clicked (12h mode)