baseui 11.0.1 → 11.0.2

package/esm/datepicker/datepicker.js

@@ -2,6 +2,10 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -10,10 +14,6 @@ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.it
 
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -107,7 +107,39 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
 
     _defineProperty(_assertThisInitialized(_this), "dateHelpers", void 0);
 
-    _defineProperty(_assertThisInitialized(_this), "onChange", function (data) {
+    _defineProperty(_assertThisInitialized(_this), "handleChange", function (date) {
+      var onChange = _this.props.onChange;
+      var onRangeChange = _this.props.onRangeChange;
+
+      if (Array.isArray(date)) {
+        if (onChange && date.every(Boolean)) {
+          // flowlint-next-line unclear-type:off
+          onChange({
+            date: date
+          });
+        }
+
+        if (onRangeChange) {
+          onRangeChange({
+            date: _toConsumableArray(date)
+          });
+        }
+      } else {
+        if (onChange) {
+          onChange({
+            date: date
+          });
+        }
+
+        if (onRangeChange) {
+          onRangeChange({
+            date: date
+          });
+        }
+      }
+    });
+
+    _defineProperty(_assertThisInitialized(_this), "onCalendarSelect", function (data) {
       var isOpen = false;
       var isPseudoFocused = false;
       var calendarFocused = false;
@@ -184,9 +216,7 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
         inputValue: _this.formatDisplayValue(nextDate)
       }));
 
-      _this.props.onChange && _this.props.onChange({
-        date: nextDate
-      });
+      _this.handleChange(nextDate);
     });
 
     _defineProperty(_assertThisInitialized(_this), "formatDisplayValue", function (date) {
@@ -290,16 +320,10 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
       var formatString = _this.normalizeDashes(_this.props.formatString);
 
       if (typeof mask === 'string' && inputValue === mask.replace(/9/g, ' ') || inputValue.length === 0) {
-        if (_this.props.onChange) {
-          if (_this.props.range) {
-            _this.props.onChange({
-              date: []
-            });
-          } else {
-            _this.props.onChange({
-              date: null
-            });
-          }
+        if (_this.props.range) {
+          _this.handleChange([]);
+        } else {
+          _this.handleChange(null);
         }
       }
 
@@ -330,19 +354,13 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
           endDate = parseDateString(right);
         }
 
-        var onChange = _this.props.onChange;
-
-        if (onChange) {
-          var datesValid = _this.dateHelpers.isValid(startDate) && _this.dateHelpers.isValid(endDate); // added equal case so that times within the same day can be expressed
+        var datesValid = _this.dateHelpers.isValid(startDate) && _this.dateHelpers.isValid(endDate); // added equal case so that times within the same day can be expressed
 
 
-          var rangeValid = _this.dateHelpers.isAfter(endDate, startDate) || _this.dateHelpers.isEqual(startDate, endDate);
+        var rangeValid = _this.dateHelpers.isAfter(endDate, startDate) || _this.dateHelpers.isEqual(startDate, endDate);
 
-          if (datesValid && rangeValid) {
-            onChange({
-              date: [startDate, endDate]
-            });
-          }
+        if (datesValid && rangeValid) {
+          _this.handleChange([startDate, endDate]);
         }
       } else {
         var dateString = _this.normalizeDashes(inputValue);
@@ -360,11 +378,10 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
 
         var _this$props3 = _this.props,
             displayValueAtRangeIndex = _this$props3.displayValueAtRangeIndex,
-            _onChange = _this$props3.onChange,
             range = _this$props3.range,
             value = _this$props3.value;
 
-        if (date && _this.dateHelpers.isValid(date) && _onChange) {
+        if (date && _this.dateHelpers.isValid(date)) {
           if (range && Array.isArray(value) && typeof displayValueAtRangeIndex === 'number') {
             var _value = _slicedToArray(value, 2),
                 _left = _value[0],
@@ -374,22 +391,16 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
               _left = date;
 
               if (!_right) {
-                _onChange({
-                  date: [_left]
-                });
+                _this.handleChange([_left]);
               } else {
                 if (_this.dateHelpers.isAfter(_right, _left) || _this.dateHelpers.isEqual(_left, _right)) {
-                  _onChange({
-                    date: [_left, _right]
-                  });
+                  _this.handleChange([_left, _right]);
                 } else {
                   // Is resetting back to previous value appropriate? Invalid range is not
                   // communicated to the user, but if it was not reset the text value would
                   // show one value and date value another. This seems a bit better but clearly
                   // has a downside.
-                  _onChange({
-                    date: _toConsumableArray(value)
-                  });
+                  _this.handleChange(_toConsumableArray(value));
                 }
               }
             } else if (displayValueAtRangeIndex === 1) {
@@ -397,26 +408,18 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
 
               if (!_left) {
                 // If start value is not defined, set start/end to the same day.
-                _onChange({
-                  date: [_right, _right]
-                });
+                _this.handleChange([_right, _right]);
               } else {
                 if (_this.dateHelpers.isAfter(_right, _left) || _this.dateHelpers.isEqual(_left, _right)) {
-                  _onChange({
-                    date: [_left, _right]
-                  });
+                  _this.handleChange([_left, _right]);
                 } else {
                   // See comment above about resetting dates on invalid range
-                  _onChange({
-                    date: _toConsumableArray(value)
-                  });
+                  _this.handleChange(_toConsumableArray(value));
                 }
               }
             }
           } else {
-            _onChange({
-              date: date
-            });
+            _this.handleChange(date);
           }
         }
       }
@@ -533,11 +536,6 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
           endDate = _split2$2 === void 0 ? '' : _split2$2;
 
       var value = inputRole === INPUT_ROLE.startDate ? startDate : inputRole === INPUT_ROLE.endDate ? endDate : this.state.inputValue;
-
-      var onChange = function onChange(event) {
-        return _this3.handleInputChange(event, inputRole);
-      };
-
       return /*#__PURE__*/React.createElement(InputComponent, _extends({
         "aria-disabled": this.props.disabled,
         "aria-label": this.props['aria-label'] || (this.props.range ? locale.datepicker.ariaLabelRange : locale.datepicker.ariaLabel),
@@ -554,7 +552,9 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
         },
         onBlur: this.handleInputBlur,
         onKeyDown: this.handleKeyDown,
-        onChange: onChange,
+        onChange: function onChange(event) {
+          return _this3.handleInputChange(event, inputRole);
+        },
         placeholder: placeholder,
         mask: this.getMask(),
         required: this.props.required,
@@ -614,7 +614,7 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
             trapTabbing: true,
             value: _this4.props.value
           }, _this4.props, {
-            onChange: _this4.onChange,
+            onChange: _this4.onCalendarSelect,
             selectedInput: _this4.state.selectedInput,
             hasLockedBehavior: _this4.hasLockedBehavior()
           }))

package/esm/datepicker/stateful-calendar.js

@@ -1,5 +1,7 @@
 function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -47,7 +49,10 @@ var StatefulComponent = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       return /*#__PURE__*/React.createElement(StatefulContainer, this.props, function (extendedProps) {
-        return /*#__PURE__*/React.createElement(Calendar, extendedProps);
+        return /*#__PURE__*/React.createElement(Calendar, _extends({}, extendedProps, {
+          // flowlint-next-line unclear-type:off
+          onChange: extendedProps.onChange
+        }));
       });
     }
   }]);

package/esm/datepicker/stateful-container.js

@@ -58,8 +58,29 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
         value: date
       });
 
-      if (typeof _this.props.onChange === 'function') {
-        _this.props.onChange(data);
+      var onChange = _this.props.onChange;
+
+      if (onChange) {
+        if (Array.isArray(date)) {
+          if (date.every(Boolean)) {
+            // flowlint-next-line unclear-type:off
+            onChange({
+              date: date
+            });
+          }
+        } else {
+          onChange({
+            date: date
+          });
+        }
+      }
+
+      var onRangeChange = _this.props.onRangeChange;
+
+      if (onRangeChange) {
+        onRangeChange({
+          date: date
+        });
       }
     });
 

package/esm/datepicker/stateful-datepicker.js

@@ -1,5 +1,7 @@
 function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -47,7 +49,10 @@ var StatefulComponent = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       return /*#__PURE__*/React.createElement(StatefulContainer, this.props, function (extendedProps) {
-        return /*#__PURE__*/React.createElement(Datepicker, extendedProps);
+        return /*#__PURE__*/React.createElement(Datepicker, _extends({}, extendedProps, {
+          // flowlint-next-line unclear-type:off
+          onChange: extendedProps.onChange
+        }));
       });
     }
   }]);

package/esm/snackbar/snackbar-context.js

@@ -136,7 +136,7 @@ export default function SnackbarProvider(_ref) {
     setTimeout(function () {
       setAnimating(false);
       display(duration);
-    }, 1000);
+    }, 0);
   }
 
   function exit() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "baseui",
-  "version": "11.0.1",
+  "version": "11.0.2",
   "description": "A React Component library implementing the Base design language",
   "keywords": [
     "react",

package/snackbar/snackbar-context.js

@@ -155,7 +155,7 @@ function SnackbarProvider(_ref) {
     setTimeout(function () {
       setAnimating(false);
       display(duration);
-    }, 1000);
+    }, 0);
   }
 
   function exit() {

package/snackbar/snackbar-context.js.flow

@@ -93,7 +93,7 @@ export default function SnackbarProvider({
     setTimeout(() => {
       setAnimating(false);
       display(duration);
-    }, 1000);
+    }, 0);
   }
 
   function exit() {

package/tag/types.js.flow

@@ -70,7 +70,7 @@ export type SharedPropsArgT = {
   $isHovered?: boolean,
   $kind?: string,
   $variant?: string,
-  $isFocusVisible: boolean,
+  $isFocusVisible?: boolean,
   $size?: string,
 };