@gympass/yoga 7.73.0 → 7.74.0

package/cjs/Datepicker/web/Calendar.js

@@ -62,12 +62,12 @@ var getDayFieldColor = function getDayFieldColor(selected, disabled, colors, aux
   return colors.stamina;
 };
 
-var toUTCDate = function toUTCDate(date) {
-  return new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())).getTime();
+var toUTCTime = function toUTCTime(date) {
+  return Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate());
 };
 
 var isSameDate = function isSameDate(firstDate, secondDate) {
-  return firstDate.getDate() === secondDate.getDate() && firstDate.getMonth() === secondDate.getMonth() && firstDate.getFullYear() === secondDate.getFullYear();
+  return firstDate.getUTCDate() === secondDate.getUTCDate() && firstDate.getUTCMonth() === secondDate.getUTCMonth() && firstDate.getUTCFullYear() === secondDate.getUTCFullYear();
 };
 
 var getDayFieldRadius = function getDayFieldRadius(aux, radii) {
@@ -80,11 +80,11 @@ var getDayFieldRadius = function getDayFieldRadius(aux, radii) {
       month = aux.month;
   var currentDate = (_Date = new Date(Date.UTC(year, month, val))) == null ? void 0 : _Date.getTime();
 
-  if (currentDate === toUTCDate(startDate) && endDate) {
+  if (currentDate === toUTCTime(startDate) && endDate) {
     return radii.circle + "px " + radii.sharp + "px " + radii.sharp + "px " + radii.circle + "px";
   }
 
-  if (currentDate === toUTCDate(endDate) && startDate) {
+  if (currentDate === toUTCTime(endDate) && startDate) {
     return radii.sharp + "px " + radii.circle + "px " + radii.circle + "px " + radii.sharp + "px";
   }
 
@@ -152,31 +152,31 @@ function Calendar(_ref6) {
     return new Date(Date.UTC(year, month, 0)).getUTCDate();
   };
 
-  var toUTCDateDay = function toUTCDateDay(day) {
-    return new Date(Date.UTC(year, month, day)).getTime();
+  var toUTCTimeByDay = function toUTCTimeByDay(day) {
+    return Date.UTC(year, month, day);
   };
 
   var isEqual = function isEqual(day) {
-    var utcDate = new Date(Date.UTC(year, month, day));
+    var utcDate = new Date(toUTCTimeByDay(day));
     return startDate && isSameDate(startDate, utcDate) || endDate && isSameDate(endDate, utcDate);
   };
 
   var inRange = function inRange(day) {
-    return startDate && startDate.getTime() <= toUTCDateDay(day) && endDate && endDate.getTime() >= toUTCDateDay(day);
+    return startDate && toUTCTime(startDate) <= toUTCTimeByDay(day) && endDate && endDate.getTime() >= toUTCTimeByDay(day);
   };
 
   var isDisabled = function isDisabled(day) {
-    var local = new Date(Date.UTC(year, month, day));
+    var local = Date.UTC(year, month, day);
     var now = new Date();
     var nowUTC = Date.UTC(now.getFullYear(), now.getMonth(), now.getDate());
-    var pastDatesDisabled = disablePastDates && local.getTime() < nowUTC || disablePastFrom && local.getTime() < new Date(disablePastFrom.getFullYear(), disablePastFrom.getMonth(), disablePastFrom.getDate());
-    var futureDateDisabled = disableFutureDates && local.getTime() > nowUTC || disableFutureFrom && local.getTime() > new Date(disableFutureFrom.getFullYear(), disableFutureFrom.getMonth(), disableFutureFrom.getDate());
+    var pastDatesDisabled = disablePastDates && local < nowUTC || disablePastFrom && local < toUTCTime(disablePastFrom);
+    var futureDateDisabled = disableFutureDates && local > nowUTC || disableFutureFrom && local > toUTCTime(disableFutureFrom);
     return pastDatesDisabled || futureDateDisabled;
   };
 
   var _onClick = function onClick(day) {
     var selectedDate = new Date(Date.UTC(year, month, day));
-    if (isDisabled(day) || startDate && selectedDate.getTime() === toUTCDate(startDate)) return;
+    if (isDisabled(day)) return;
 
     if (type === 'single') {
       onSelectSingle(selectedDate);

package/cjs/Dialog/web/Dialog.js

@@ -17,7 +17,7 @@ var _hooks = require("../../hooks");
 
 var _ = require("../..");
 
-var _excluded = ["isOpen", "hideCloseButton", "children", "onClose", "zIndex"];
+var _excluded = ["isOpen", "hideCloseButton", "children", "dialogId", "onClose", "zIndex"];
 
 var _templateObject, _templateObject2;
 
@@ -46,16 +46,17 @@ var Overlay = _styledComponents["default"].div(_templateObject2 || (_templateObj
   return "\n  display: flex;\n  z-index: " + zIndex + ";\n  justify-content: center;\n  align-items: center;\n\n  position: fixed;\n  top: " + dialog.position["default"] + ";\n  right: " + dialog.position["default"] + ";\n  left: " + dialog.position["default"] + ";\n  bottom: " + dialog.position["default"] + ";\n\n  background-color: rgba(35, 27, 34, 0.48);\n  ";
 });
 
-function Dialog(_ref3) {
+var Dialog = /*#__PURE__*/_react["default"].forwardRef(function (_ref3, forwardedRef) {
   var isOpen = _ref3.isOpen,
       hideCloseButton = _ref3.hideCloseButton,
       children = _ref3.children,
+      dialogId = _ref3.dialogId,
       onClose = _ref3.onClose,
       zIndex = _ref3.zIndex,
       props = _objectWithoutPropertiesLoose(_ref3, _excluded);
 
-  var dialogRef = (0, _react.useRef)(null);
-  var dialogElement = (0, _hooks.usePortal)('dialog');
+  var dialogRef = (0, _hooks.useCombinedRefs)(forwardedRef);
+  var dialogElement = (0, _hooks.usePortal)(dialogId != null ? dialogId : 'dialog');
   var isCloseButtonVisible = onClose && !hideCloseButton;
   var closeDialog = (0, _react.useCallback)(function (e) {
     if (dialogRef.current === e.target && isOpen && onClose) {
@@ -93,9 +94,12 @@ function Dialog(_ref3) {
     inverted: true,
     onClick: onClose
   })), children)), dialogElement) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null);
-}
+});
 
 Dialog.propTypes = {
+  /** Custom id to allow creating isolated portal nodes */
+  dialogId: _propTypes.string,
+
   /** Control the dialog visibility. */
   isOpen: _propTypes.bool,
 
@@ -111,7 +115,8 @@ Dialog.defaultProps = {
   isOpen: false,
   hideCloseButton: false,
   onClose: undefined,
-  zIndex: 3
+  zIndex: 3,
+  dialogId: undefined
 };
 Dialog.displayName = 'Dialog';
 var _default = Dialog;

package/esm/Datepicker/web/Calendar.js

@@ -43,12 +43,12 @@ var getDayFieldColor = function getDayFieldColor(selected, disabled, colors, aux
   return colors.stamina;
 };
 
-var toUTCDate = function toUTCDate(date) {
-  return new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())).getTime();
+var toUTCTime = function toUTCTime(date) {
+  return Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate());
 };
 
 var isSameDate = function isSameDate(firstDate, secondDate) {
-  return firstDate.getDate() === secondDate.getDate() && firstDate.getMonth() === secondDate.getMonth() && firstDate.getFullYear() === secondDate.getFullYear();
+  return firstDate.getUTCDate() === secondDate.getUTCDate() && firstDate.getUTCMonth() === secondDate.getUTCMonth() && firstDate.getUTCFullYear() === secondDate.getUTCFullYear();
 };
 
 var getDayFieldRadius = function getDayFieldRadius(aux, radii) {
@@ -61,11 +61,11 @@ var getDayFieldRadius = function getDayFieldRadius(aux, radii) {
       month = aux.month;
   var currentDate = (_Date = new Date(Date.UTC(year, month, val))) == null ? void 0 : _Date.getTime();
 
-  if (currentDate === toUTCDate(startDate) && endDate) {
+  if (currentDate === toUTCTime(startDate) && endDate) {
     return radii.circle + "px " + radii.sharp + "px " + radii.sharp + "px " + radii.circle + "px";
   }
 
-  if (currentDate === toUTCDate(endDate) && startDate) {
+  if (currentDate === toUTCTime(endDate) && startDate) {
     return radii.sharp + "px " + radii.circle + "px " + radii.circle + "px " + radii.sharp + "px";
   }
 
@@ -132,31 +132,31 @@ function Calendar(_ref6) {
     return new Date(Date.UTC(year, month, 0)).getUTCDate();
   };
 
-  var toUTCDateDay = function toUTCDateDay(day) {
-    return new Date(Date.UTC(year, month, day)).getTime();
+  var toUTCTimeByDay = function toUTCTimeByDay(day) {
+    return Date.UTC(year, month, day);
   };
 
   var isEqual = function isEqual(day) {
-    var utcDate = new Date(Date.UTC(year, month, day));
+    var utcDate = new Date(toUTCTimeByDay(day));
     return startDate && isSameDate(startDate, utcDate) || endDate && isSameDate(endDate, utcDate);
   };
 
   var inRange = function inRange(day) {
-    return startDate && startDate.getTime() <= toUTCDateDay(day) && endDate && endDate.getTime() >= toUTCDateDay(day);
+    return startDate && toUTCTime(startDate) <= toUTCTimeByDay(day) && endDate && endDate.getTime() >= toUTCTimeByDay(day);
   };
 
   var isDisabled = function isDisabled(day) {
-    var local = new Date(Date.UTC(year, month, day));
+    var local = Date.UTC(year, month, day);
     var now = new Date();
     var nowUTC = Date.UTC(now.getFullYear(), now.getMonth(), now.getDate());
-    var pastDatesDisabled = disablePastDates && local.getTime() < nowUTC || disablePastFrom && local.getTime() < new Date(disablePastFrom.getFullYear(), disablePastFrom.getMonth(), disablePastFrom.getDate());
-    var futureDateDisabled = disableFutureDates && local.getTime() > nowUTC || disableFutureFrom && local.getTime() > new Date(disableFutureFrom.getFullYear(), disableFutureFrom.getMonth(), disableFutureFrom.getDate());
+    var pastDatesDisabled = disablePastDates && local < nowUTC || disablePastFrom && local < toUTCTime(disablePastFrom);
+    var futureDateDisabled = disableFutureDates && local > nowUTC || disableFutureFrom && local > toUTCTime(disableFutureFrom);
     return pastDatesDisabled || futureDateDisabled;
   };
 
   var _onClick = function onClick(day) {
     var selectedDate = new Date(Date.UTC(year, month, day));
-    if (isDisabled(day) || startDate && selectedDate.getTime() === toUTCDate(startDate)) return;
+    if (isDisabled(day)) return;
 
     if (type === 'single') {
       onSelectSingle(selectedDate);

package/esm/Dialog/web/Dialog.js

@@ -1,4 +1,4 @@
-var _excluded = ["isOpen", "hideCloseButton", "children", "onClose", "zIndex"];
+var _excluded = ["isOpen", "hideCloseButton", "children", "dialogId", "onClose", "zIndex"];
 
 var _templateObject, _templateObject2;
 
@@ -8,12 +8,12 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
 
-import React, { useEffect, useRef, useCallback } from 'react';
+import React, { useEffect, useCallback } from 'react';
 import { createPortal } from 'react-dom';
 import styled from 'styled-components';
-import { func, bool, node, number } from 'prop-types';
+import { func, bool, node, number, string } from 'prop-types';
 import { Close } from '@gympass/yoga-icons';
-import { usePortal } from '../../hooks';
+import { usePortal, useCombinedRefs } from '../../hooks';
 import { Button, Card, Box } from '../..';
 export var StyledDialog = styled(Card)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n"])), function (_ref) {
   var onClose = _ref.onClose,
@@ -25,17 +25,17 @@ var Overlay = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplate
       dialog = _ref2.theme.yoga.components.dialog;
   return "\n  display: flex;\n  z-index: " + zIndex + ";\n  justify-content: center;\n  align-items: center;\n\n  position: fixed;\n  top: " + dialog.position["default"] + ";\n  right: " + dialog.position["default"] + ";\n  left: " + dialog.position["default"] + ";\n  bottom: " + dialog.position["default"] + ";\n\n  background-color: rgba(35, 27, 34, 0.48);\n  ";
 });
-
-function Dialog(_ref3) {
+var Dialog = /*#__PURE__*/React.forwardRef(function (_ref3, forwardedRef) {
   var isOpen = _ref3.isOpen,
       hideCloseButton = _ref3.hideCloseButton,
       children = _ref3.children,
+      dialogId = _ref3.dialogId,
       onClose = _ref3.onClose,
       zIndex = _ref3.zIndex,
       props = _objectWithoutPropertiesLoose(_ref3, _excluded);
 
-  var dialogRef = useRef(null);
-  var dialogElement = usePortal('dialog');
+  var dialogRef = useCombinedRefs(forwardedRef);
+  var dialogElement = usePortal(dialogId != null ? dialogId : 'dialog');
   var isCloseButtonVisible = onClose && !hideCloseButton;
   var closeDialog = useCallback(function (e) {
     if (dialogRef.current === e.target && isOpen && onClose) {
@@ -73,9 +73,11 @@ function Dialog(_ref3) {
     inverted: true,
     onClick: onClose
   })), children)), dialogElement) : /*#__PURE__*/React.createElement(React.Fragment, null);
-}
-
+});
 Dialog.propTypes = {
+  /** Custom id to allow creating isolated portal nodes */
+  dialogId: string,
+
   /** Control the dialog visibility. */
   isOpen: bool,
 
@@ -91,7 +93,8 @@ Dialog.defaultProps = {
   isOpen: false,
   hideCloseButton: false,
   onClose: undefined,
-  zIndex: 3
+  zIndex: 3,
+  dialogId: undefined
 };
 Dialog.displayName = 'Dialog';
 export default Dialog;

package/esm/Dialog/web/Dialog.test.js

@@ -59,4 +59,14 @@ describe('<Dialog />', function () {
     }, /*#__PURE__*/React.createElement(Dialog.Header, null, "Title"))));
     expect(screen.queryByRole('button')).toBeNull();
   });
+  it('should render content isolated by dialog id', function () {
+    render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(Dialog, {
+      isOpen: true
+    }, /*#__PURE__*/React.createElement(Dialog.Header, null, "Title")), /*#__PURE__*/React.createElement(Dialog, {
+      isOpen: true,
+      dialogId: "custom-id"
+    }, /*#__PURE__*/React.createElement(Dialog.Header, null, "Second Title"))));
+    expect(screen.getByText('Title')).toBeInTheDocument();
+    expect(screen.getByText('Second Title')).toBeInTheDocument();
+  });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gympass/yoga",
-  "version": "7.73.0",
+  "version": "7.74.0",
   "description": "Gympass component library",
   "main": "./cjs",
   "sideEffects": false,
@@ -53,7 +53,7 @@
     "react": ">=16",
     "styled-components": "^4.4.0"
   },
-  "gitHead": "1e683b25901f777084721ebe795c1ebd5e560ff2",
+  "gitHead": "21322a4a3a083f86796151e7687dd2b257fe445e",
   "module": "./esm",
   "private": false,
   "react-native": "./cjs/index.native.js"