v2.0.3-beta.0 - Beta release for React scripts v5 support

This has not been tested in IE yet and one of the unit tests are failing in a minor way but it fixes the React scripts v5 error mentioned in issue #23

Install using npm i @time-input-polyfill/react@beta

v2.0.2-switching-tests-to-npm-package

• Switched to using my new @time-input-polyfill/tests package for running the Cypress tests.
• Updated dependencies
• Added note about not supporting react-scripts v5

v2.0.0 - Major Overhaul

I completely rebuilt the plugin from the ground up to have more easily shared code with other time-input-polyfills I'm planning on making.

It also has robust automated testing built into it now for quality assurance.

Breaking changes in v2.0.0

onChange replaced with setValue

In v1 you updated the value using an onChange event. This was really clunky though.

// v1 syntax

const [value, setValue] = useState()

// ...

<TimeInput value={value} onChange={({ value }) => {
    doStuff(value)
    setValue(value)
}} />

In v2, the syntax has been simplified down to this:

// v2 syntax

const [value, setValue] = useState()

useEffect(()=>{
    doStuff(value)
}, [value])

// ...

<TimeInput value={value} setValue={setValue} />

Note: It is still possible to use onChange, however this is just an extension of the native <input type="time"> onChange event now. It is not compatible with v1 and it does not provide a consistent value between polyfilled and non-polyfilled browsers.

Warning: events like onChange and onKeyUp fire before the state in the polyfill has settled. This means that event.target.currentValue will not return the expected value in the polyfill version. It was out of scope to adjust the timing on every possible event to fire after the state has settled.

polyfillSource value has changed location

In version 1, you would import the polyfill utils from here:

@time-input-polyfill/react/dist/timePolyfillUtils.js.

That doesn't exist anymore, you need to import from here instead now:

@time-input-polyfill/utils/npm/time-input-polyfill-utils.min.js

v1.0.8 - Better fix for issue #15

The optional chaining is getting babelified away properly now.

v1.0.7 - Fix for #15 this.$input.current is null

• Fix for #15 this.$input.current is null
• Also I styled the input to use monospace font-style since modern browsers use monospace fonts for time inputs

Credit to @agrohs for finding the source of the this.$input.current is null issue.

v1.0.6 - Common JS and TypeScript support

• Modified the build process to have proper Common JS support
• Added a .d.ts file to the main export for TypeScript support

Fixes bug #16

v1.0.4 - Fix for #8 - setValue("") not working

Fixes issue #8 - Can't clear/reset input value in Safari

v1.0.3 - Added a CSP workaround (Fixes #6)

Fixes issue #6 "Request for timePolyfillHelpers.js conflicts with Content Security Policy on Safari"

v1.0.2 - Fix for issue #4 polyfill stop working on second load

See details in issue: #4

Thanks to @sheff3rd for his help fixing this issue :)

Also a fix for a bug that was making it impossible to set the time from the parent component.