Add onCreate/onDestroy callbacks and update flatpickr

example/index.js

@@ -62,11 +62,13 @@ class App extends Component {
         </Flatpickr>
         <Flatpickr
           defaultValue='2019-05-05'
+          onCreate={(flatpickr) => { this.calendar = flatpickr }}
+          onDestroy={() => { delete this.calendar }}
           render={({ defaultValue }, ref)=>{
             return (
               <div>
-                <label>DateTimePicker</label>
                 <input defaultValue={ defaultValue } ref={ref} />
+                <button onClick={() => this.calendar.setDate(new Date())}>Today</button>
               </div>
             )
           }} />

lib/index.js

@@ -17,6 +17,13 @@ const hookPropType = PropTypes.oneOfType([
   PropTypes.arrayOf(PropTypes.func)
 ])
 
+const callbacks = [
+  'onCreate',
+  'onDestroy'
+]
+
+const callbackPropTypes = PropTypes.func
+
 class DateTimePicker extends Component {
   static propTypes = {
     defaultValue: PropTypes.string,
@@ -29,6 +36,8 @@ class DateTimePicker extends Component {
     onReady: hookPropType,
     onValueUpdate: hookPropType,
     onDayCreate: hookPropType,
+    onCreate: callbackPropTypes,
+    onDestroy: callbackPropTypes,
     value: PropTypes.oneOfType([
       PropTypes.string,
       PropTypes.array,
@@ -100,9 +109,14 @@ class DateTimePicker extends Component {
     if (this.props.hasOwnProperty('value')) {
       this.flatpickr.setDate(this.props.value, false)
     }
+
+    const { onCreate } = this.props
+    if (onCreate) onCreate(this.flatpickr)
   }
 
   componentWillUnmount() {
+    const { onDestroy } = this.props
+    if (onDestroy) onDestroy(this.flatpickr)
     this.flatpickr.destroy()
   }
 
@@ -111,10 +125,13 @@ class DateTimePicker extends Component {
     const { options, defaultValue, value, children, render, ...props } = this.props
     const ref = (node) => { this.node = node }
 
-    // Don't pass hooks to dom node
+    // Don't pass hooks and callbacks to dom node
     hooks.forEach(hook => {
       delete props[hook]
     })
+    callbacks.forEach(callback => {
+      delete props[callback]
+    })
 
     if (render) return render({ ...props, defaultValue, value }, ref)
 

package.json

@@ -25,7 +25,7 @@
   "author": "haoxin",
   "license": "MIT",
   "dependencies": {
-    "flatpickr": "^4.3.2",
+    "flatpickr": "^4.5.7",
     "prop-types": "^15.5.10"
   },
   "devDependencies": {

test/index.spec.js

@@ -57,4 +57,52 @@ describe("react-flatpickr", () => {
       component.unmount()
     })
   })
+
+  describe("#onCreate", () => {
+    it("is called when the flatpickr instance is created", () => {
+      let spy = jest.fn()
+      const component = mount(<DateTimePicker onCreate={spy} />)
+      expect(spy).toHaveBeenCalled()
+      component.unmount()
+    })
+
+    it("is possible to reference the flatpickr instance", () => {
+      let calendar
+      const component = mount(
+        <DateTimePicker
+          defaultValue="2000-01-01"
+          onCreate={(flatpickr) => { calendar = flatpickr }}
+          render={
+            ({ defaultValue }, ref) => {
+              return (
+                <div>
+                  <input defaultValue={defaultValue} ref={ref} />
+                  <button onClick={() => {
+                    calendar.setDate("1000-01-01")
+                  }}>
+                    foo
+                  </button>
+                </div>
+              )
+            }
+          }
+        />
+      )
+      const input = component.find("input").instance()
+      expect(input.value).toEqual("2000-01-01")
+      const button = component.find("button")
+      button.simulate("click")
+      expect(input.value).toEqual("1000-01-01")
+      component.unmount()
+    })
+  })
+
+  describe("#onDestroy", () => {
+    it("is called when the flatpickr instance is destroyed", () => {
+      let spy = jest.fn()
+      const component = mount(<DateTimePicker onDestroy={spy} />)
+      component.unmount()
+      expect(spy).toHaveBeenCalled()
+    })
+  })
 })

yarn.lock

@@ -3693,10 +3693,10 @@ flat-cache@^1.2.1:
     rimraf "~2.6.2"
     write "^0.2.1"
 
-flatpickr@^4.3.2:
-  version "4.5.2"
-  resolved "https://registry.yarnpkg.com/flatpickr/-/flatpickr-4.5.2.tgz#47c8ad472a096e5fb7e74b809b0703535383f20d"
-  integrity sha512-jDy4QYGpmiy7+Qk8QvKJ4spjDdxcx9cxMydmq1x427HkKWBw0qizLYeYM2F6tMcvvqGjU5VpJS55j4LnsaBblA==
+flatpickr@^4.5.7:
+  version "4.5.7"
+  resolved "https://registry.yarnpkg.com/flatpickr/-/flatpickr-4.5.7.tgz#6efc0d93c65547aa77294205c67830ebabe3565c"
+  integrity sha512-JqPfihUc9A/j9QAsh6otoARmMyUauPE17vRBEG+ThJwbl8zAq4ssGpxlPK3wWM/i8EFxkHg9UuVo0ds7XluKxw==
 
 flatten@^1.0.2:
   version "1.0.2"