Wikiki/bulma-calendar

Custom labels are not working on time range picker.

davidszanto opened this issue · 2 comments

labelFrom and labelTo are not shown in inline timerange-picker!

There should be a custom label option in inline picker, but even in the demo it is not shown:
https://demo.creativebulma.net/components/calendar/v6/demonstration/time/#range-selection

My configuration:

this.timePicker = bulmaCalendar.attach('[type="time"]', {
      start: this.defaultStart,
      end: this.defaultEnd,
      minuteSteps: 10,
      showFooter: false,
      displayMode: 'inline',
      labelFrom: 'From',
      labelTo: 'To'
    });

Workaround:

 const timePicker = bulmaCalendar.attach('[type="time"]', {
      minuteSteps: 10,
      showFooter: false,
      displayMode: 'inline',
      labelFrom: 'From',
      labelTo: 'To'
    });

const element = timePicker[0]._ui.wrapper;
const header = element.getElementsByClassName('datetimepicker-header')[0];
header.style.flexDirection = 'row';
header.classList.remove('is-hidden');
element.getElementsByClassName('datetimepicker-selection-start')[0].classList.add('is-hidden');
element.getElementsByClassName('datetimepicker-selection-end')[0].classList.add('is-hidden');

image

Fixed with 6.1.2