@citygross/components 0.7.116 → 0.7.118

package/build/@types/components/MenuListItem/MenuListHeader.d.ts

@@ -3,5 +3,6 @@ export declare type TMenuListHeader = {
     onClick?: () => void;
     dropdownHeader: string;
     mainCategorySelected?: string;
+    hoverBackground?: string;
 };
 export declare const MenuListHeader: React.FunctionComponent<TMenuListHeader>;

package/build/cjs/components/src/components/AddressBlock/AddressBlock.js

@@ -77,6 +77,7 @@ require('styled-components');
 require('../SearchBar/SearchBar.styles.js');
 require('../Nav/Nav.styles.js');
 require('../NavMainLink/NavMainLink.styled.js');
+require('framer-motion');
 require('../SideModal/SideModal.styles.js');
 require('../IconText/IconText.styles.js');
 require('../Dropdown/Dropdown.styles.js');

package/build/cjs/components/src/components/AddressBlock/AddressBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/MenuListItem/MenuListHeader.js

@@ -11,8 +11,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var MenuListHeader = function (_a) {
-    var onClick = _a.onClick, dropdownHeader = _a.dropdownHeader, mainCategorySelected = _a.mainCategorySelected;
-    return (React__default["default"].createElement(MenuListItem_styles.MainCategoryWrapper, { onClick: onClick },
+    var onClick = _a.onClick, dropdownHeader = _a.dropdownHeader, mainCategorySelected = _a.mainCategorySelected, hoverBackground = _a.hoverBackground;
+    return (React__default["default"].createElement(MenuListItem_styles.MainCategoryWrapper, { onClick: onClick, hoverBackground: hoverBackground },
         React__default["default"].createElement(MenuListItem_styles.HeaderText, null, dropdownHeader),
         !mainCategorySelected && React__default["default"].createElement(Icon.Icons.ChevronRight, null)));
 };

package/build/cjs/components/src/components/SideModal/SideModal.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
+var framerMotion = require('framer-motion');
 var reactDom = require('react-dom');
 var SideModal_styles = require('./SideModal.styles.js');
 var designTokens = require('@citygross/design-tokens');
@@ -15,27 +16,16 @@ var SideModal = function (_a) {
     var _b, _c;
     var onBackdropClick = _a.onBackdropClick, _d = _a.background, background = _d === void 0 ? '#fff' : _d, _e = _a.overlayBackground, overlayBackground = _e === void 0 ? (_c = (_b = designTokens.theme.palette) === null || _b === void 0 ? void 0 : _b.darkOverlay) !== null && _c !== void 0 ? _c : '' : _e, _f = _a.width, width = _f === void 0 ? 375 : _f, isVisible = _a.isVisible, slideFrom = _a.slideFrom, _g = _a.querySelector, querySelector = _g === void 0 ? '#root' : _g, maxWidth = _a.maxWidth, children = _a.children;
     var ref = React.useRef(null);
-    var variants = {
-        hide: {
-            x: slideFrom === 'left' ? '-100%' : '100%',
-            transition: { duration: 0.3, delay: 0, ease: 'linear' }
-        },
-        show: {
-            x: 0,
-            transition: { duration: 0.3, delay: 0, ease: 'linear' }
-        }
-    };
     var domSafe = typeof document !== 'undefined';
     return domSafe
-        ? reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
-            isVisible && (React__default["default"].createElement(SideModal_styles.SideModalOverlay, { ref: ref, onMouseDown: function (e) {
-                    if (ref && e.target === (ref === null || ref === void 0 ? void 0 : ref.current)) {
-                        onBackdropClick();
-                    }
-                }, overlayBackground: overlayBackground, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: {
-                    type: 'just'
-                } })),
-            React__default["default"].createElement(SideModal_styles.SideModalContainer, { slideFrom: slideFrom, maxWidth: maxWidth, transition: { type: 'just' }, width: width, onClick: function (e) { return e.stopPropagation(); }, background: background, variants: variants, animate: isVisible ? 'show' : 'hide', initial: 'hide' }, children)), document.querySelector(querySelector) || document.body)
+        ? reactDom.createPortal(React__default["default"].createElement(framerMotion.AnimatePresence, null, isVisible && (React__default["default"].createElement(SideModal_styles.SideModalOverlay, { ref: ref, onMouseDown: function (e) {
+                if (ref && e.target === (ref === null || ref === void 0 ? void 0 : ref.current)) {
+                    onBackdropClick();
+                }
+            }, overlayBackground: overlayBackground, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: {
+                type: 'just'
+            } },
+            React__default["default"].createElement(SideModal_styles.SideModalContainer, { slideFrom: slideFrom, maxWidth: maxWidth, transition: { type: 'just' }, width: width, onClick: function (e) { return e.stopPropagation(); }, background: background, initial: { x: slideFrom === 'left' ? '-100%' : '100%' }, animate: { x: 0 }, exit: { x: slideFrom === 'left' ? '-100%' : '100%' } }, children)))), document.querySelector(querySelector) || document.body)
         : null;
 };
 

package/build/cjs/components/src/components/SideModal/SideModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideModal.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SideModal.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/WarningLabel/WarningLabel.js

@@ -77,6 +77,7 @@ require('styled-components');
 require('../SearchBar/SearchBar.styles.js');
 require('../Nav/Nav.styles.js');
 require('../NavMainLink/NavMainLink.styled.js');
+require('framer-motion');
 require('../SideModal/SideModal.styles.js');
 require('../IconText/IconText.styles.js');
 require('../Dropdown/Dropdown.styles.js');

package/build/cjs/components/src/components/WarningLabel/WarningLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"WarningLabel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"WarningLabel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/es/components/src/components/AddressBlock/AddressBlock.js

@@ -73,6 +73,7 @@ import 'styled-components';
 import '../SearchBar/SearchBar.styles.js';
 import '../Nav/Nav.styles.js';
 import '../NavMainLink/NavMainLink.styled.js';
+import 'framer-motion';
 import '../SideModal/SideModal.styles.js';
 import '../IconText/IconText.styles.js';
 import '../Dropdown/Dropdown.styles.js';

package/build/es/components/src/components/AddressBlock/AddressBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/es/components/src/components/MenuListItem/MenuListHeader.js

@@ -3,8 +3,8 @@ import React from 'react';
 import { MainCategoryWrapper, HeaderText } from './MenuListItem.styles.js';
 
 var MenuListHeader = function (_a) {
-    var onClick = _a.onClick, dropdownHeader = _a.dropdownHeader, mainCategorySelected = _a.mainCategorySelected;
-    return (React.createElement(MainCategoryWrapper, { onClick: onClick },
+    var onClick = _a.onClick, dropdownHeader = _a.dropdownHeader, mainCategorySelected = _a.mainCategorySelected, hoverBackground = _a.hoverBackground;
+    return (React.createElement(MainCategoryWrapper, { onClick: onClick, hoverBackground: hoverBackground },
         React.createElement(HeaderText, null, dropdownHeader),
         !mainCategorySelected && React.createElement(Icons.ChevronRight, null)));
 };

package/build/es/components/src/components/SideModal/SideModal.js

@@ -1,4 +1,5 @@
 import React, { useRef } from 'react';
+import { AnimatePresence } from 'framer-motion';
 import { createPortal } from 'react-dom';
 import { SideModalOverlay, SideModalContainer } from './SideModal.styles.js';
 import { theme } from '@citygross/design-tokens';
@@ -7,27 +8,16 @@ var SideModal = function (_a) {
     var _b, _c;
     var onBackdropClick = _a.onBackdropClick, _d = _a.background, background = _d === void 0 ? '#fff' : _d, _e = _a.overlayBackground, overlayBackground = _e === void 0 ? (_c = (_b = theme.palette) === null || _b === void 0 ? void 0 : _b.darkOverlay) !== null && _c !== void 0 ? _c : '' : _e, _f = _a.width, width = _f === void 0 ? 375 : _f, isVisible = _a.isVisible, slideFrom = _a.slideFrom, _g = _a.querySelector, querySelector = _g === void 0 ? '#root' : _g, maxWidth = _a.maxWidth, children = _a.children;
     var ref = useRef(null);
-    var variants = {
-        hide: {
-            x: slideFrom === 'left' ? '-100%' : '100%',
-            transition: { duration: 0.3, delay: 0, ease: 'linear' }
-        },
-        show: {
-            x: 0,
-            transition: { duration: 0.3, delay: 0, ease: 'linear' }
-        }
-    };
     var domSafe = typeof document !== 'undefined';
     return domSafe
-        ? createPortal(React.createElement(React.Fragment, null,
-            isVisible && (React.createElement(SideModalOverlay, { ref: ref, onMouseDown: function (e) {
-                    if (ref && e.target === (ref === null || ref === void 0 ? void 0 : ref.current)) {
-                        onBackdropClick();
-                    }
-                }, overlayBackground: overlayBackground, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: {
-                    type: 'just'
-                } })),
-            React.createElement(SideModalContainer, { slideFrom: slideFrom, maxWidth: maxWidth, transition: { type: 'just' }, width: width, onClick: function (e) { return e.stopPropagation(); }, background: background, variants: variants, animate: isVisible ? 'show' : 'hide', initial: 'hide' }, children)), document.querySelector(querySelector) || document.body)
+        ? createPortal(React.createElement(AnimatePresence, null, isVisible && (React.createElement(SideModalOverlay, { ref: ref, onMouseDown: function (e) {
+                if (ref && e.target === (ref === null || ref === void 0 ? void 0 : ref.current)) {
+                    onBackdropClick();
+                }
+            }, overlayBackground: overlayBackground, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: {
+                type: 'just'
+            } },
+            React.createElement(SideModalContainer, { slideFrom: slideFrom, maxWidth: maxWidth, transition: { type: 'just' }, width: width, onClick: function (e) { return e.stopPropagation(); }, background: background, initial: { x: slideFrom === 'left' ? '-100%' : '100%' }, animate: { x: 0 }, exit: { x: slideFrom === 'left' ? '-100%' : '100%' } }, children)))), document.querySelector(querySelector) || document.body)
         : null;
 };
 

package/build/es/components/src/components/SideModal/SideModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideModal.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SideModal.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/es/components/src/components/WarningLabel/WarningLabel.js

@@ -73,6 +73,7 @@ import 'styled-components';
 import '../SearchBar/SearchBar.styles.js';
 import '../Nav/Nav.styles.js';
 import '../NavMainLink/NavMainLink.styled.js';
+import 'framer-motion';
 import '../SideModal/SideModal.styles.js';
 import '../IconText/IconText.styles.js';
 import '../Dropdown/Dropdown.styles.js';

package/build/es/components/src/components/WarningLabel/WarningLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"WarningLabel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"WarningLabel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@citygross/components",
-  "version": "0.7.116",
+  "version": "0.7.118",
   "license": "ISC",
   "sideEffects": false,
   "main": "./build/cjs/components/src/index.js",
@@ -71,5 +71,5 @@
     "moment": "^2.29.1",
     "react-loading-skeleton": "^2.2.0"
   },
-  "gitHead": "6604ca045e2d893adcceb574e24b5e769fa78717"
+  "gitHead": "08f92b1c0d109dfbf6f6a253547d6feefbe0a981"
 }