Custom Labels

Name: timepicker-ui
Author: Piotr Glejzer

Customize all text labels for localization

Button Labels

Customize OK and Cancel button text:

Select time

1const picker = new TimepickerUI(input, {
2  labels: {
3    ok: 'Confirm',
4    cancel: 'Close'
5  }
6});
7picker.create();

AM/PM Labels

#

Customize AM and PM labels:

1const picker = new TimepickerUI(input, {
2  clock: { type: '12h' },
3  labels: {
4    am: 'a.m.',
5    pm: 'p.m.'
6  }
7});
8picker.create();

Clock View Title

#

Change the heading of the clock face view with labels.clockTitle:

1const picker = new TimepickerUI(input, {
2  labels: { clockTitle: 'Choose Your Time' }
3});
4picker.create();

Keyboard View Labels

#

Change the labels of the keyboard view. labels.hour and labels.minute also name the fields for screen readers:

1const picker = new TimepickerUI(input, {
2  ui: { initialView: 'keyboard' },
3  labels: {
4    hour: 'Hours',
5    minute: 'Minutes',
6    keyboardTitle: 'Set Time'
7  }
8});
9picker.create();

Polish Localization

#

Example with Polish labels:

Select time

1const picker = new TimepickerUI(input, {
2  labels: {
3    ok: 'Zatwierdź',
4    cancel: 'Anuluj',
5    clockTitle: 'Wybierz godzinę'
6  }
7});
8picker.create();