ashvin27 / react-time-range-slider Goto Github PK

In the following line hours/minutes are numeric, so the calling hours.length will return undefined value. Thus leading zero are not added.

running the latest NextJs' build command while using this library causes the build to fail. I tracked it down to the css required in the dist/index.js file. Would like to propose that the css be imported by the user in their app and not something you require/import within your dist.

See PR.

Can someone give a basic sample code of react-time-range-slider using the functional component?

Step appears to be 15 minutes despite of the value provided. Checked in /dist/index.js and it does not seem to have a function that would implement step change.
Please make changes or allow access to repo so I could create a PR for this.
Thank you

I noticed the maxValue and minValue is not working correctly for example:

 const valueRange: {
      start: "00:00",
      end: "23:59"
    }
const value: { 
  start: "08:30",
 end: "11:30"
}
<template>
<TimeRangeSlider
          format={24}
          disabled={false}
	draggableTrack={true}
          maxValue={valueRange.end}
          minValue={valueRange.start}
          name={"time_range"}
          step={15}
          value={this.value}/>
</template>

Expected: for the above code the draggableTrack shouldn't be draggable when it reach to it maxValue and same for minValue.

Current: I can drag the track about the maxValue and same for minValue.

I'm using formik with yup in my form and I Wanna call manually the onChange of formik in my own onChange function, but I realized that onChange of the TimeRangeSlider just has the current value.

        <TimeRangeSlider
               disabled={!values[day.value]}
               format={24}
               maxValue="23:59"
               minValue="00:00"
               name={`${day.value}Range`}
               onChange={value => { 
                     onChange(); //here I wanna pass the event object
                     setFieldValue(`${day.value}Range`, value)
              }}
               step={15}
               value={values[`${day.value}Range`]} />