Skip to content
timepicker-ui
React · Features

Custom Labels

Customize button and label text

Button Labels

Change OK and Cancel button text:

Custom Buttons

Confirm and Close instead of OK and Cancel

index.tsxtsx
1import { Timepicker } from "timepicker-ui-react";
2

3function App() {
4  return (
5    <Timepicker
6      options={{
7        labels: {
8          ok: "Confirm",
9          cancel: "Close"
10        }
11      }}
12    />
13  );
14}

Localization

Translate labels to different languages:

index.tsxtsx
1// Polish localization
2<Timepicker
3  placeholder="Wybierz czas"
4  options={{
5    labels: {
6      ok: "Potwierdź",
7      cancel: "Anuluj"
8    }
9  }}
10/>

Available Labels

index.tstypescript
1interface LabelsOptions {
2  ok?: string;        // Default: "OK"
3  cancel?: string;    // Default: "Cancel"
4}