@dhis2-ui/calendar 10.7.5 → 10.7.7

package/build/cjs/calendar/calendar-container.js

@@ -13,7 +13,7 @@ var _navigationContainer = require("./navigation-container.js");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const backgroundColor = 'none';
+const backgroundColor = _uiConstants.colors.white;
 const CalendarContainer = exports.CalendarContainer = /*#__PURE__*/_react.default.memo(function CalendarContainer(_ref) {
   let {
     date,

package/build/cjs/calendar-input/calendar-input.js

@@ -48,6 +48,7 @@ const CalendarInput = function () {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   const ref = (0, _react.useRef)();
   const calendarRef = (0, _react.useRef)();
+  const popperRef = (0, _react.useRef)();
   const [open, setOpen] = (0, _react.useState)(false);
   const [partialDate, setPartialDate] = (0, _react.useState)(date);
   (0, _react.useEffect)(() => setPartialDate(date), [date]);
@@ -96,7 +97,7 @@ const CalendarInput = function () {
   };
   const handleBlur = (_, e) => {
     var _calendarRef$current;
-    if (e.relatedTarget && (_calendarRef$current = calendarRef.current) !== null && _calendarRef$current !== void 0 && _calendarRef$current.contains(e.relatedTarget)) {
+    if (e.relatedTarget && ((_calendarRef$current = calendarRef.current) !== null && _calendarRef$current !== void 0 && _calendarRef$current.contains(e.relatedTarget) || popperRef.current === e.relatedTarget)) {
       return;
     }
     onChooseDate(partialDate, validationOptions);
@@ -156,7 +157,11 @@ const CalendarInput = function () {
   }, /*#__PURE__*/_react.default.createElement(_popper.Popper, {
     reference: ref,
     placement: "bottom-start",
-    modifiers: [offsetModifier]
+    modifiers: [offsetModifier],
+    onFirstUpdate: component => {
+      var _component$elements;
+      popperRef.current = component === null || component === void 0 ? void 0 : (_component$elements = component.elements) === null || _component$elements === void 0 ? void 0 : _component$elements.popper;
+    }
   }, /*#__PURE__*/_react.default.createElement(_calendarContainer.CalendarContainer, _extends({}, calendarProps, {
     calendarRef: calendarRef
   })))), /*#__PURE__*/_react.default.createElement(_style.default, {

package/build/es/calendar/calendar-container.js

@@ -1,10 +1,10 @@
 import _JSXStyle from "styled-jsx/style";
-import { elevations } from '@dhis2/ui-constants';
+import { colors, elevations } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
 import React, { useMemo } from 'react';
 import { CalendarTable, CalendarTableProps } from './calendar-table.js';
 import { NavigationContainer, NavigationContainerProps } from './navigation-container.js';
-const backgroundColor = 'none';
+const backgroundColor = colors.white;
 export const CalendarContainer = /*#__PURE__*/React.memo(function CalendarContainer(_ref) {
   let {
     date,

package/build/es/calendar-input/calendar-input.js

@@ -39,6 +39,7 @@ export const CalendarInput = function () {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   const ref = useRef();
   const calendarRef = useRef();
+  const popperRef = useRef();
   const [open, setOpen] = useState(false);
   const [partialDate, setPartialDate] = useState(date);
   useEffect(() => setPartialDate(date), [date]);
@@ -87,7 +88,7 @@ export const CalendarInput = function () {
   };
   const handleBlur = (_, e) => {
     var _calendarRef$current;
-    if (e.relatedTarget && (_calendarRef$current = calendarRef.current) !== null && _calendarRef$current !== void 0 && _calendarRef$current.contains(e.relatedTarget)) {
+    if (e.relatedTarget && ((_calendarRef$current = calendarRef.current) !== null && _calendarRef$current !== void 0 && _calendarRef$current.contains(e.relatedTarget) || popperRef.current === e.relatedTarget)) {
       return;
     }
     onChooseDate(partialDate, validationOptions);
@@ -147,7 +148,11 @@ export const CalendarInput = function () {
   }, /*#__PURE__*/React.createElement(Popper, {
     reference: ref,
     placement: "bottom-start",
-    modifiers: [offsetModifier]
+    modifiers: [offsetModifier],
+    onFirstUpdate: component => {
+      var _component$elements;
+      popperRef.current = component === null || component === void 0 ? void 0 : (_component$elements = component.elements) === null || _component$elements === void 0 ? void 0 : _component$elements.popper;
+    }
   }, /*#__PURE__*/React.createElement(CalendarContainer, _extends({}, calendarProps, {
     calendarRef: calendarRef
   })))), /*#__PURE__*/React.createElement(_JSXStyle, {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@dhis2-ui/calendar",
-    "version": "10.7.5",
+    "version": "10.7.7",
     "description": "UI Calendar",
     "repository": {
         "type": "git",
@@ -33,15 +33,15 @@
         "styled-jsx": "^4"
     },
     "dependencies": {
-        "@dhis2-ui/button": "10.7.5",
-        "@dhis2-ui/card": "10.7.5",
-        "@dhis2-ui/input": "10.7.5",
-        "@dhis2-ui/layer": "10.7.5",
-        "@dhis2-ui/popper": "10.7.5",
+        "@dhis2-ui/button": "10.7.7",
+        "@dhis2-ui/card": "10.7.7",
+        "@dhis2-ui/input": "10.7.7",
+        "@dhis2-ui/layer": "10.7.7",
+        "@dhis2-ui/popper": "10.7.7",
         "@dhis2/multi-calendar-dates": "2.1.2",
         "@dhis2/prop-types": "^3.1.2",
-        "@dhis2/ui-constants": "10.7.5",
-        "@dhis2/ui-icons": "10.7.5",
+        "@dhis2/ui-constants": "10.7.7",
+        "@dhis2/ui-icons": "10.7.7",
         "classnames": "^2.3.1",
         "prop-types": "^15.7.2"
     },