@citygross/components 0.7.98 → 0.7.100

package/build/@types/components/SlideInOutContainer/SlideInOutContainer.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare type TSlideInOutContainer = {
+    children?: React.ReactNode;
+    isVisible?: boolean;
+    slideFrom?: 'left' | 'right';
+    isInitial?: boolean;
+};
+export declare const SlideInOutContainer: ({ slideFrom, isVisible, isInitial, children }: TSlideInOutContainer) => JSX.Element;

package/build/@types/components/SlideInOutContainer/SlideInOutContainer.stories.d.ts

@@ -0,0 +1,7 @@
+import { Story } from '@storybook/react';
+declare const _default: {
+    component: any;
+    title: string;
+};
+export default _default;
+export declare const Default: Story;

package/build/@types/components/SlideInOutContainer/SlideInOutContainer.styles.d.ts

@@ -0,0 +1,7 @@
+declare type TSideModalContainer = {
+    background?: string;
+    slideFrom?: 'left' | 'right';
+    maxWidth?: string;
+};
+export declare const SideModalContainer: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, import("styled-components").DefaultTheme, TSideModalContainer, never>;
+export {};

package/build/@types/index.d.ts

@@ -69,3 +69,4 @@ export * from './components/Dropdown/Dropdown';
 export * from './components/SearchListItem/SearchListItem';
 export * from './components/MenuListItem/MenuListHeader';
 export * from './components/MenuListItem/MenuListItem';
+export * from './components/SlideInOutContainer/SlideInOutContainer';

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

@@ -83,6 +83,7 @@ require('../IconText/IconText.styles.js');
 require('../Dropdown/Dropdown.styles.js');
 require('../SearchListItem/SearchListItem.styles.js');
 require('../MenuListItem/MenuListItem.styles.js');
+require('../SlideInOutContainer/SlideInOutContainer.styles.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

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/SlideInOutContainer/SlideInOutContainer.js

@@ -0,0 +1,21 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var framerMotion = require('framer-motion');
+var React = require('react');
+var SlideInOutContainer_styles = require('./SlideInOutContainer.styles.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var SlideInOutContainer = function (_a) {
+    var _b = _a.slideFrom, slideFrom = _b === void 0 ? 'right' : _b, isVisible = _a.isVisible, isInitial = _a.isInitial, children = _a.children;
+    return (React__default["default"].createElement(framerMotion.AnimatePresence, null, isVisible && (React__default["default"].createElement(SlideInOutContainer_styles.SideModalContainer, { slideFrom: slideFrom, transition: { type: 'just' }, onClick: function (e) { return e.stopPropagation(); }, initial: {
+            x: isInitial ? 0 : slideFrom === 'left' ? '-100%' : '100%'
+        }, animate: { x: 0 }, exit: { x: slideFrom === 'left' ? '-100%' : '100%' } }, children))));
+};
+
+exports.SlideInOutContainer = SlideInOutContainer;
+//# sourceMappingURL=SlideInOutContainer.js.map

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

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

package/build/cjs/components/src/components/SlideInOutContainer/SlideInOutContainer.styles.js

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('../../../../_virtual/_tslib.js');
+var framerMotion = require('framer-motion');
+var styled = require('styled-components');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+var SideModalContainer = styled__default["default"](framerMotion.motion.div)(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  width: 100%;\n  ", ";\n  position: absolute;\n  ", ";\n  top: 0;\n\n  overflow: auto;\n  -ms-overflow-style: none;\n  scrollbar-width: none;\n  &::-webkit-scrollbar {\n    display: none;\n  }\n"], ["\n  width: 100%;\n  ", ";\n  position: absolute;\n  ", ";\n  top: 0;\n\n  overflow: auto;\n  -ms-overflow-style: none;\n  scrollbar-width: none;\n  &::-webkit-scrollbar {\n    display: none;\n  }\n"])), function (_a) {
+    var maxWidth = _a.maxWidth;
+    return maxWidth && "max-width:".concat(maxWidth);
+}, function (props) { return ((props === null || props === void 0 ? void 0 : props.slideFrom) === 'left' ? "left: 0px" : 'right: 0px'); });
+var templateObject_1;
+
+exports.SideModalContainer = SideModalContainer;
+//# sourceMappingURL=SlideInOutContainer.styles.js.map

package/build/cjs/components/src/components/SlideInOutContainer/SlideInOutContainer.styles.js.map

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

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

@@ -83,6 +83,7 @@ require('../IconText/IconText.styles.js');
 require('../Dropdown/Dropdown.styles.js');
 require('../SearchListItem/SearchListItem.styles.js');
 require('../MenuListItem/MenuListItem.styles.js');
+require('../SlideInOutContainer/SlideInOutContainer.styles.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

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/cjs/components/src/index.js

@@ -74,6 +74,7 @@ var Dropdown = require('./components/Dropdown/Dropdown.js');
 var SearchListItem = require('./components/SearchListItem/SearchListItem.js');
 var MenuListHeader = require('./components/MenuListItem/MenuListHeader.js');
 var MenuListItem = require('./components/MenuListItem/MenuListItem.js');
+var SlideInOutContainer = require('./components/SlideInOutContainer/SlideInOutContainer.js');
 
 
 
@@ -180,4 +181,5 @@ exports.Dropdown = Dropdown.Dropdown;
 exports.SearchListItem = SearchListItem.SearchListItem;
 exports.MenuListHeader = MenuListHeader.MenuListHeader;
 exports.MenuListItem = MenuListItem.MenuListItem;
+exports.SlideInOutContainer = SlideInOutContainer.SlideInOutContainer;
 //# sourceMappingURL=index.js.map

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

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

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

@@ -79,6 +79,7 @@ import '../IconText/IconText.styles.js';
 import '../Dropdown/Dropdown.styles.js';
 import '../SearchListItem/SearchListItem.styles.js';
 import '../MenuListItem/MenuListItem.styles.js';
+import '../SlideInOutContainer/SlideInOutContainer.styles.js';
 
 function AddressBlock(_a) {
     var _b = _a.deliverOption, deliverOption = _b === void 0 ? 'Address' : _b, icon = _a.icon, storeName = _a.storeName, customerName = _a.customerName, street = _a.street, zipCode = _a.zipCode, city = _a.city, doorCode = _a.doorCode, floor = _a.floor, deliveryInstructions = _a.deliveryInstructions, xsSpacing = _a.xsSpacing, lgSpacing = _a.lgSpacing;

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/SlideInOutContainer/SlideInOutContainer.js

@@ -0,0 +1,13 @@
+import { AnimatePresence } from 'framer-motion';
+import React from 'react';
+import { SideModalContainer } from './SlideInOutContainer.styles.js';
+
+var SlideInOutContainer = function (_a) {
+    var _b = _a.slideFrom, slideFrom = _b === void 0 ? 'right' : _b, isVisible = _a.isVisible, isInitial = _a.isInitial, children = _a.children;
+    return (React.createElement(AnimatePresence, null, isVisible && (React.createElement(SideModalContainer, { slideFrom: slideFrom, transition: { type: 'just' }, onClick: function (e) { return e.stopPropagation(); }, initial: {
+            x: isInitial ? 0 : slideFrom === 'left' ? '-100%' : '100%'
+        }, animate: { x: 0 }, exit: { x: slideFrom === 'left' ? '-100%' : '100%' } }, children))));
+};
+
+export { SlideInOutContainer };
+//# sourceMappingURL=SlideInOutContainer.js.map

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

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

package/build/es/components/src/components/SlideInOutContainer/SlideInOutContainer.styles.js

@@ -0,0 +1,12 @@
+import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
+import { motion } from 'framer-motion';
+import styled from 'styled-components';
+
+var SideModalContainer = styled(motion.div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  ", ";\n  position: absolute;\n  ", ";\n  top: 0;\n\n  overflow: auto;\n  -ms-overflow-style: none;\n  scrollbar-width: none;\n  &::-webkit-scrollbar {\n    display: none;\n  }\n"], ["\n  width: 100%;\n  ", ";\n  position: absolute;\n  ", ";\n  top: 0;\n\n  overflow: auto;\n  -ms-overflow-style: none;\n  scrollbar-width: none;\n  &::-webkit-scrollbar {\n    display: none;\n  }\n"])), function (_a) {
+    var maxWidth = _a.maxWidth;
+    return maxWidth && "max-width:".concat(maxWidth);
+}, function (props) { return ((props === null || props === void 0 ? void 0 : props.slideFrom) === 'left' ? "left: 0px" : 'right: 0px'); });
+var templateObject_1;
+
+export { SideModalContainer };
+//# sourceMappingURL=SlideInOutContainer.styles.js.map

package/build/es/components/src/components/SlideInOutContainer/SlideInOutContainer.styles.js.map

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

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

@@ -79,6 +79,7 @@ import '../IconText/IconText.styles.js';
 import '../Dropdown/Dropdown.styles.js';
 import '../SearchListItem/SearchListItem.styles.js';
 import '../MenuListItem/MenuListItem.styles.js';
+import '../SlideInOutContainer/SlideInOutContainer.styles.js';
 
 function WarningLabel(_a) {
     var children = _a.children, background = _a.background, toolTip = _a.toolTip;

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/build/es/components/src/index.js

@@ -70,4 +70,5 @@ export { Dropdown } from './components/Dropdown/Dropdown.js';
 export { SearchListItem } from './components/SearchListItem/SearchListItem.js';
 export { MenuListHeader } from './components/MenuListItem/MenuListHeader.js';
 export { MenuListItem } from './components/MenuListItem/MenuListItem.js';
+export { SlideInOutContainer } from './components/SlideInOutContainer/SlideInOutContainer.js';
 //# sourceMappingURL=index.js.map

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

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@citygross/components",
-  "version": "0.7.98",
+  "version": "0.7.100",
   "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": "a2574bd403bc62e4ce2a87c6acf5bb623bb6ea8a"
+  "gitHead": "dffdbcfa722a9e8080ff9e2a8d89a6c86bbff88e"
 }