rc-picker - npm Package Compare versions

Comparing version 0.0.1-alpha.37 to 0.0.1-alpha.38

es/hooks/usePickerInput.d.ts

 import * as React from 'react';
-export default function usePickerInput({ open, isClickOutside, triggerOpen, forwardKeyDown, onSubmit, onCancel, onFocus, onBlur, }: {
+export default function usePickerInput({ open, isClickOutside, triggerOpen, forwardKeyDown, blurToCancel, onSubmit, onCancel, onFocus, onBlur, }: {
     open: boolean;
@@ -7,2 +7,3 @@ isClickOutside: (clickElement: EventTarget | null) => boolean;
     forwardKeyDown: (e: React.KeyboardEvent<HTMLInputElement>) => boolean;
+    blurToCancel?: boolean;
     onSubmit: () => void;
@@ -9,0 +10,0 @@ onCancel: () => void;

es/hooks/usePickerInput.js

@@ -42,2 +42,3 @@ "use strict";
       forwardKeyDown = _ref.forwardKeyDown,
+      blurToCancel = _ref.blurToCancel,
       onSubmit = _ref.onSubmit,
@@ -142,4 +143,10 @@ onCancel = _ref.onCancel,
         preventBlurRef.current = true;
-        triggerOpen(false); // Always set back in case `onBlur` prevented by user
 
+        if (blurToCancel) {
+          onCancel();
+        } else {
+          triggerOpen(false);
+        } // Always set back in case `onBlur` prevented by user
+
+
         window.setTimeout(function () {
@@ -146,0 +153,0 @@ preventBlurRef.current = false;

es/hooks/useTextValueMapping.d.ts

@@ -1,2 +0,1 @@
-import * as React from 'react';
 export default function useTextValueMapping<ValueType>({ valueTexts, onTextChange, }: {
@@ -6,2 +5,2 @@ /** Must useMemo, to assume that `valueTexts` only match on the first change */
     onTextChange: (text: string) => void;
-}): [string, React.ChangeEventHandler<HTMLInputElement>, () => void];
+}): [string, (text: string) => void, () => void];

es/hooks/useTextValueMapping.js

@@ -36,4 +36,3 @@ "use strict";
 
-  function triggerTextChange(_ref2) {
-    var value = _ref2.target.value;
+  function triggerTextChange(value) {
     setInnerText(value);
@@ -40,0 +39,0 @@ onTextChange(value);

es/Picker.js

@@ -178,5 +178,27 @@ "use strict";
       mergedOpen = _useMergeState_1$defa4[0],
-      triggerInnerOpen = _useMergeState_1$defa4[1]; // ============================ Trigger ============================
+      triggerInnerOpen = _useMergeState_1$defa4[1]; // ============================= Text ==============================
 
 
+  var valueTexts = useValueTexts_1.default(selectedValue, {
+    formatList: formatList,
+    generateConfig: generateConfig,
+    locale: locale
+  });
+
+  var _useTextValueMapping_ = useTextValueMapping_1.default({
+    valueTexts: valueTexts,
+    onTextChange: function onTextChange(newText) {
+      var inputDate = generateConfig.locale.parse(locale.locale, newText, formatList);
+
+      if (inputDate && (!disabledDate || !disabledDate(inputDate))) {
+        setSelectedValue(inputDate);
+      }
+    }
+  }),
+      _useTextValueMapping_2 = _slicedToArray(_useTextValueMapping_, 3),
+      text = _useTextValueMapping_2[0],
+      triggerTextChange = _useTextValueMapping_2[1],
+      resetText = _useTextValueMapping_2[2]; // ============================ Trigger ============================
+
+
   var triggerChange = function triggerChange(newValue) {
@@ -214,27 +236,5 @@ setSelectedValue(newValue);
     }
-  }; // ============================= Text ==============================
+  }; // ============================= Input =============================
 
 
-  var valueTexts = useValueTexts_1.default(selectedValue, {
-    formatList: formatList,
-    generateConfig: generateConfig,
-    locale: locale
-  });
-
-  var _useTextValueMapping_ = useTextValueMapping_1.default({
-    valueTexts: valueTexts,
-    onTextChange: function onTextChange(newText) {
-      var inputDate = generateConfig.locale.parse(locale.locale, newText, formatList);
-
-      if (inputDate && (!disabledDate || !disabledDate(inputDate))) {
-        setSelectedValue(inputDate);
-      }
-    }
-  }),
-      _useTextValueMapping_2 = _slicedToArray(_useTextValueMapping_, 3),
-      text = _useTextValueMapping_2[0],
-      triggerTextChange = _useTextValueMapping_2[1],
-      resetText = _useTextValueMapping_2[2]; // ============================= Input =============================
-
-
   var _usePickerInput_1$def = usePickerInput_1.default({
@@ -271,4 +271,8 @@ open: mergedOpen,
       setSelectedValue(mergedValue);
+
+      if (!valueTexts.length || valueTexts[0] === '') {
+        triggerTextChange('');
+      }
     }
-  }, [mergedOpen]); // Sync innerValue with control mode
+  }, [mergedOpen, valueTexts]); // Sync innerValue with control mode
 
@@ -369,3 +373,5 @@ React.useEffect(function () {
     value: text,
-    onChange: triggerTextChange,
+    onChange: function onChange(e) {
+      triggerTextChange(e.target.value);
+    },
     autoFocus: autoFocus,
@@ -372,0 +378,0 @@ placeholder: placeholder,

es/RangePicker.js

@@ -461,6 +461,7 @@ "use strict";
     return {
+      blurToCancel: !!(picker === 'date' && showTime),
       forwardKeyDown: forwardKeyDown,
       onBlur: onBlur,
       isClickOutside: function isClickOutside(target) {
-        return !!(panelDivRef.current && !panelDivRef.current.contains(target) && inputDivRef.current && !inputDivRef.current.contains(target) && onOpenChange);
+        return !!(panelDivRef.current && !panelDivRef.current.contains(target) && inputDivRef.current && !inputDivRef.current.contains(target));
       },
@@ -515,4 +516,12 @@ onFocus: function onFocus(e) {
       setSelectedValue(mergedValue);
+
+      if (!startValueTexts.length || startValueTexts[0] === '') {
+        triggerStartTextChange('');
+      }
+
+      if (!endValueTexts.length || endValueTexts[0] === '') {
+        triggerEndTextChange('');
+      }
     }
-  }, [mergedOpen]); // Sync innerValue with control mode
+  }, [mergedOpen, startValueTexts, endValueTexts]); // Sync innerValue with control mode
 
@@ -784,3 +793,5 @@ React.useEffect(function () {
     value: startText,
-    onChange: triggerStartTextChange,
+    onChange: function onChange(e) {
+      triggerStartTextChange(e.target.value);
+    },
     autoFocus: autoFocus,
@@ -799,3 +810,5 @@ placeholder: miscUtil_1.getValue(placeholder, 0) || '',
     value: endText,
-    onChange: triggerEndTextChange,
+    onChange: function onChange(e) {
+      triggerEndTextChange(e.target.value);
+    },
     placeholder: miscUtil_1.getValue(placeholder, 1) || '',
@@ -802,0 +815,0 @@ ref: endInputRef

lib/hooks/usePickerInput.d.ts

 import * as React from 'react';
-export default function usePickerInput({ open, isClickOutside, triggerOpen, forwardKeyDown, onSubmit, onCancel, onFocus, onBlur, }: {
+export default function usePickerInput({ open, isClickOutside, triggerOpen, forwardKeyDown, blurToCancel, onSubmit, onCancel, onFocus, onBlur, }: {
     open: boolean;
@@ -7,2 +7,3 @@ isClickOutside: (clickElement: EventTarget | null) => boolean;
     forwardKeyDown: (e: React.KeyboardEvent<HTMLInputElement>) => boolean;
+    blurToCancel?: boolean;
     onSubmit: () => void;
@@ -9,0 +10,0 @@ onCancel: () => void;

lib/hooks/usePickerInput.js

@@ -42,2 +42,3 @@ "use strict";
       forwardKeyDown = _ref.forwardKeyDown,
+      blurToCancel = _ref.blurToCancel,
       onSubmit = _ref.onSubmit,
@@ -142,4 +143,10 @@ onCancel = _ref.onCancel,
         preventBlurRef.current = true;
-        triggerOpen(false); // Always set back in case `onBlur` prevented by user
 
+        if (blurToCancel) {
+          onCancel();
+        } else {
+          triggerOpen(false);
+        } // Always set back in case `onBlur` prevented by user
+
+
         window.setTimeout(function () {
@@ -146,0 +153,0 @@ preventBlurRef.current = false;

lib/hooks/useTextValueMapping.d.ts

@@ -1,2 +0,1 @@
-import * as React from 'react';
 export default function useTextValueMapping<ValueType>({ valueTexts, onTextChange, }: {
@@ -6,2 +5,2 @@ /** Must useMemo, to assume that `valueTexts` only match on the first change */
     onTextChange: (text: string) => void;
-}): [string, React.ChangeEventHandler<HTMLInputElement>, () => void];
+}): [string, (text: string) => void, () => void];

lib/hooks/useTextValueMapping.js

@@ -36,4 +36,3 @@ "use strict";
 
-  function triggerTextChange(_ref2) {
-    var value = _ref2.target.value;
+  function triggerTextChange(value) {
     setInnerText(value);
@@ -40,0 +39,0 @@ onTextChange(value);

lib/Picker.js

@@ -178,5 +178,27 @@ "use strict";
       mergedOpen = _useMergeState_1$defa4[0],
-      triggerInnerOpen = _useMergeState_1$defa4[1]; // ============================ Trigger ============================
+      triggerInnerOpen = _useMergeState_1$defa4[1]; // ============================= Text ==============================
 
 
+  var valueTexts = useValueTexts_1.default(selectedValue, {
+    formatList: formatList,
+    generateConfig: generateConfig,
+    locale: locale
+  });
+
+  var _useTextValueMapping_ = useTextValueMapping_1.default({
+    valueTexts: valueTexts,
+    onTextChange: function onTextChange(newText) {
+      var inputDate = generateConfig.locale.parse(locale.locale, newText, formatList);
+
+      if (inputDate && (!disabledDate || !disabledDate(inputDate))) {
+        setSelectedValue(inputDate);
+      }
+    }
+  }),
+      _useTextValueMapping_2 = _slicedToArray(_useTextValueMapping_, 3),
+      text = _useTextValueMapping_2[0],
+      triggerTextChange = _useTextValueMapping_2[1],
+      resetText = _useTextValueMapping_2[2]; // ============================ Trigger ============================
+
+
   var triggerChange = function triggerChange(newValue) {
@@ -214,27 +236,5 @@ setSelectedValue(newValue);
     }
-  }; // ============================= Text ==============================
+  }; // ============================= Input =============================
 
 
-  var valueTexts = useValueTexts_1.default(selectedValue, {
-    formatList: formatList,
-    generateConfig: generateConfig,
-    locale: locale
-  });
-
-  var _useTextValueMapping_ = useTextValueMapping_1.default({
-    valueTexts: valueTexts,
-    onTextChange: function onTextChange(newText) {
-      var inputDate = generateConfig.locale.parse(locale.locale, newText, formatList);
-
-      if (inputDate && (!disabledDate || !disabledDate(inputDate))) {
-        setSelectedValue(inputDate);
-      }
-    }
-  }),
-      _useTextValueMapping_2 = _slicedToArray(_useTextValueMapping_, 3),
-      text = _useTextValueMapping_2[0],
-      triggerTextChange = _useTextValueMapping_2[1],
-      resetText = _useTextValueMapping_2[2]; // ============================= Input =============================
-
-
   var _usePickerInput_1$def = usePickerInput_1.default({
@@ -271,4 +271,8 @@ open: mergedOpen,
       setSelectedValue(mergedValue);
+
+      if (!valueTexts.length || valueTexts[0] === '') {
+        triggerTextChange('');
+      }
     }
-  }, [mergedOpen]); // Sync innerValue with control mode
+  }, [mergedOpen, valueTexts]); // Sync innerValue with control mode
 
@@ -369,3 +373,5 @@ React.useEffect(function () {
     value: text,
-    onChange: triggerTextChange,
+    onChange: function onChange(e) {
+      triggerTextChange(e.target.value);
+    },
     autoFocus: autoFocus,
@@ -372,0 +378,0 @@ placeholder: placeholder,

lib/RangePicker.js

@@ -461,6 +461,7 @@ "use strict";
     return {
+      blurToCancel: !!(picker === 'date' && showTime),
       forwardKeyDown: forwardKeyDown,
       onBlur: onBlur,
       isClickOutside: function isClickOutside(target) {
-        return !!(panelDivRef.current && !panelDivRef.current.contains(target) && inputDivRef.current && !inputDivRef.current.contains(target) && onOpenChange);
+        return !!(panelDivRef.current && !panelDivRef.current.contains(target) && inputDivRef.current && !inputDivRef.current.contains(target));
       },
@@ -515,4 +516,12 @@ onFocus: function onFocus(e) {
       setSelectedValue(mergedValue);
+
+      if (!startValueTexts.length || startValueTexts[0] === '') {
+        triggerStartTextChange('');
+      }
+
+      if (!endValueTexts.length || endValueTexts[0] === '') {
+        triggerEndTextChange('');
+      }
     }
-  }, [mergedOpen]); // Sync innerValue with control mode
+  }, [mergedOpen, startValueTexts, endValueTexts]); // Sync innerValue with control mode
 
@@ -784,3 +793,5 @@ React.useEffect(function () {
     value: startText,
-    onChange: triggerStartTextChange,
+    onChange: function onChange(e) {
+      triggerStartTextChange(e.target.value);
+    },
     autoFocus: autoFocus,
@@ -799,3 +810,5 @@ placeholder: miscUtil_1.getValue(placeholder, 0) || '',
     value: endText,
-    onChange: triggerEndTextChange,
+    onChange: function onChange(e) {
+      triggerEndTextChange(e.target.value);
+    },
     placeholder: miscUtil_1.getValue(placeholder, 1) || '',
@@ -802,0 +815,0 @@ ref: endInputRef

package.json

 {
   "name": "rc-picker",
-  "version": "0.0.1-alpha.37",
+  "version": "0.0.1-alpha.38",
   "description": "React date & time picker",
@@ -5,0 +5,0 @@ "keywords": [

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

544265

increased by0.23%

Lines of code

12981

increased by0.31%

No dependency changes