feat(derictive): add clickoutside derictive

packages/common/DatePicker/src/utils.js

@@ -30,6 +30,13 @@ function dateItem (time, displayTime, selectedTime, currentTime) {
   }
 }
 
+/**
+ * Given time to display calendar, given the selected time, given current time,
+ * return the date array of display time's month.
+ * @param {Moment} displayTime
+ * @param {Moment} selectedTime
+ * @param {Moment} currentTime
+ */
 function dateArray (displayTime, selectedTime, currentTime) {
   const displayMonth = displayTime.month()
   /**

packages/directives/clickoutside.js

@@ -0,0 +1,24 @@
+import clickoutsideDelegate from '../utils/clickoutsideDelegate'
+
+const ctx = '@@clickoutsideContext'
+
+export const clickoutside = {
+  inserted (el, bindings) {
+    if (typeof bindings.value === 'function') {
+      el[ctx] = {
+        handler: bindings.value
+      }
+      clickoutsideDelegate.registerHandler(el, el[ctx].handler)
+    }
+  },
+  update (el, bindings) {
+    if (typeof bindings.value === 'function') {
+      clickoutsideDelegate.unregisterHandler(el, el[ctx].handler)
+      el[ctx].handler = bindings.value
+      clickoutsideDelegate.registerHandler(el, el[ctx].handler)
+    }
+  },
+  unbind (el) {
+    clickoutsideDelegate.unregisterHandler(el, el[ctx].handler)
+  }
+}