@citygross/components 0.7.163 → 0.7.165

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/build/@types/components/SideModal/SideModal.styles.d.ts +1 -0
  2. package/build/cjs/components/src/components/Button/Button.styles.js +1 -1
  3. package/build/cjs/components/src/components/SideModal/SideModal.js +1 -1
  4. package/build/cjs/components/src/components/SideModal/SideModal.styles.js +4 -1
  5. package/build/cjs/components/src/components/SideModal/SideModal.styles.js.map +1 -1
  6. package/build/es/components/src/components/Button/Button.styles.js +1 -1
  7. package/build/es/components/src/components/SideModal/SideModal.js +1 -1
  8. package/build/es/components/src/components/SideModal/SideModal.styles.js +4 -1
  9. package/build/es/components/src/components/SideModal/SideModal.styles.js.map +1 -1
  10. package/package.json +4 -4
package/build/@types/components/SideModal/SideModal.styles.d.ts CHANGED
@@ -7,6 +7,7 @@ declare type TSideModalContainer = {
7
7
  };
8
8
  declare type TSideMoodalOverlay = {
9
9
  overlayBackground: string;
10
+ maxHeight?: string;
10
11
  };
11
12
  export declare const SideModalOverlay: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, import("styled-components").DefaultTheme, TSideMoodalOverlay, never>;
12
13
  export declare const SideModalContainer: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, import("styled-components").DefaultTheme, TSideModalContainer, never>;
package/build/cjs/components/src/components/Button/Button.styles.js CHANGED
@@ -151,7 +151,7 @@ var BasePaginationButton = styled__default["default"](BaseButton)(templateObject
151
151
  ? 'box-shadow: inset 0px -1px 0px rgba(0, 0, 0, 0.15)'
152
152
  : "box-shadow: inset 0px 0px 0px 1px ".concat((_c = props.theme.palette) === null || _c === void 0 ? void 0 : _c.medium);
153
153
  });
154
- var ButtonBadge = styled__default["default"].div(templateObject_14 || (templateObject_14 = _tslib.__makeTemplateObject(["\n position: absolute;\n top: ", "px;\n right: ", "px;\n padding: ", ";\n background: ", ";\n color: white;\n width: fit-content;\n border-radius: 100px;\n font-size: ", "px;\n line-height: ", "px;\n ", ";\n"], ["\n position: absolute;\n top: ", "px;\n right: ", "px;\n padding: ", ";\n background: ", ";\n color: white;\n width: fit-content;\n border-radius: 100px;\n font-size: ", "px;\n line-height: ", "px;\n ", ";\n"])), function (props) { var _a; return (props === null || props === void 0 ? void 0 : props.smallBadge) ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeTopPosition; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeRightPosition; }, function (props) {
154
+ var ButtonBadge = styled__default["default"].div(templateObject_14 || (templateObject_14 = _tslib.__makeTemplateObject(["\n position: absolute;\n top: ", "px;\n right: ", "px;\n padding: ", ";\n background: ", ";\n color: white;\n width: fit-content;\n border-radius: 100px;\n font-size: ", "px;\n line-height: ", "px;\n ", ";\n"], ["\n position: absolute;\n top: ", "px;\n right: ", "px;\n padding: ", ";\n background: ", ";\n color: white;\n width: fit-content;\n border-radius: 100px;\n font-size: ", "px;\n line-height: ", "px;\n ", ";\n"])), function (props) { var _a, _b; return (_b = (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeTopPosition) !== null && _b !== void 0 ? _b : 0; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeRightPosition; }, function (props) {
155
155
  var _a, _b, _c, _d;
156
156
  return props.smallBadge
157
157
  ? "".concat((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgePaddingSmall, "px ").concat((_b = props.theme.constants) === null || _b === void 0 ? void 0 : _b.buttonBadgePadding, "px")
package/build/cjs/components/src/components/SideModal/SideModal.js CHANGED
@@ -22,7 +22,7 @@ var SideModal = function (_a) {
22
22
  if (ref && e.target === (ref === null || ref === void 0 ? void 0 : ref.current)) {
23
23
  onBackdropClick();
24
24
  }
25
- }, overlayBackground: overlayBackground, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: {
25
+ }, overlayBackground: overlayBackground, initial: { opacity: 0 }, maxHeight: maxHeight, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: {
26
26
  type: 'just'
27
27
  } },
28
28
  React__default["default"].createElement(SideModal_styles.SideModalContainer, { slideFrom: slideFrom, maxHeight: maxHeight, 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)
package/build/cjs/components/src/components/SideModal/SideModal.styles.js CHANGED
@@ -10,7 +10,10 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
10
10
 
11
11
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
12
12
 
13
- var SideModalOverlay = styled__default["default"](framerMotion.motion.div)(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n display: flex;\n z-index: ", ";\n background: ", ";\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n height: 100%;\n justify-content: center;\n align-items: center;\n\n @media (min-width: ", "px) {\n padding: ", "px;\n }\n"], ["\n display: flex;\n z-index: ", ";\n background: ", ";\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n height: 100%;\n justify-content: center;\n align-items: center;\n\n @media (min-width: ", "px) {\n padding: ", "px;\n }\n"])), function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.zIndex.modal; }, function (props) { return props.overlayBackground; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; });
13
+ var SideModalOverlay = styled__default["default"](framerMotion.motion.div)(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n display: flex;\n z-index: ", ";\n background: ", ";\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n height: 100%;\n ", ";\n justify-content: center;\n align-items: center;\n\n @media (min-width: ", "px) {\n padding: ", "px;\n max-height: unset;\n }\n"], ["\n display: flex;\n z-index: ", ";\n background: ", ";\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n height: 100%;\n ", ";\n justify-content: center;\n align-items: center;\n\n @media (min-width: ", "px) {\n padding: ", "px;\n max-height: unset;\n }\n"])), function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.zIndex.modal; }, function (props) { return props.overlayBackground; }, function (props) {
14
+ return props.maxHeight &&
15
+ "\n max-height: ".concat(props.maxHeight, ";\n ");
16
+ }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; });
14
17
  var SideModalContainer = styled__default["default"](framerMotion.motion.div)(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n height: 100vh;\n background: ", ";\n width: 100%;\n\n ", ";\n position: absolute;\n ", ";\n top: 0;\n z-index: ", ";\n ", ";\n overflow: auto;\n -ms-overflow-style: none;\n scrollbar-width: none;\n &::-webkit-scrollbar {\n display: none;\n }\n\n @media (min-width: ", "px) {\n max-height: unset;\n width: ", "px;\n }\n"], ["\n height: 100vh;\n background: ", ";\n width: 100%;\n\n ", ";\n position: absolute;\n ", ";\n top: 0;\n z-index: ", ";\n ", ";\n overflow: auto;\n -ms-overflow-style: none;\n scrollbar-width: none;\n &::-webkit-scrollbar {\n display: none;\n }\n\n @media (min-width: ", "px) {\n max-height: unset;\n width: ", "px;\n }\n"])), function (props) { return props.background; }, function (_a) {
15
18
  var maxWidth = _a.maxWidth;
16
19
  return maxWidth && "max-width:".concat(maxWidth);
package/build/cjs/components/src/components/SideModal/SideModal.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SideModal.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"SideModal.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/Button/Button.styles.js CHANGED
@@ -143,7 +143,7 @@ var BasePaginationButton = styled(BaseButton)(templateObject_13 || (templateObje
143
143
  ? 'box-shadow: inset 0px -1px 0px rgba(0, 0, 0, 0.15)'
144
144
  : "box-shadow: inset 0px 0px 0px 1px ".concat((_c = props.theme.palette) === null || _c === void 0 ? void 0 : _c.medium);
145
145
  });
146
- var ButtonBadge = styled.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n position: absolute;\n top: ", "px;\n right: ", "px;\n padding: ", ";\n background: ", ";\n color: white;\n width: fit-content;\n border-radius: 100px;\n font-size: ", "px;\n line-height: ", "px;\n ", ";\n"], ["\n position: absolute;\n top: ", "px;\n right: ", "px;\n padding: ", ";\n background: ", ";\n color: white;\n width: fit-content;\n border-radius: 100px;\n font-size: ", "px;\n line-height: ", "px;\n ", ";\n"])), function (props) { var _a; return (props === null || props === void 0 ? void 0 : props.smallBadge) ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeTopPosition; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeRightPosition; }, function (props) {
146
+ var ButtonBadge = styled.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n position: absolute;\n top: ", "px;\n right: ", "px;\n padding: ", ";\n background: ", ";\n color: white;\n width: fit-content;\n border-radius: 100px;\n font-size: ", "px;\n line-height: ", "px;\n ", ";\n"], ["\n position: absolute;\n top: ", "px;\n right: ", "px;\n padding: ", ";\n background: ", ";\n color: white;\n width: fit-content;\n border-radius: 100px;\n font-size: ", "px;\n line-height: ", "px;\n ", ";\n"])), function (props) { var _a, _b; return (_b = (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeTopPosition) !== null && _b !== void 0 ? _b : 0; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeRightPosition; }, function (props) {
147
147
  var _a, _b, _c, _d;
148
148
  return props.smallBadge
149
149
  ? "".concat((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgePaddingSmall, "px ").concat((_b = props.theme.constants) === null || _b === void 0 ? void 0 : _b.buttonBadgePadding, "px")
package/build/es/components/src/components/SideModal/SideModal.js CHANGED
@@ -14,7 +14,7 @@ var SideModal = function (_a) {
14
14
  if (ref && e.target === (ref === null || ref === void 0 ? void 0 : ref.current)) {
15
15
  onBackdropClick();
16
16
  }
17
- }, overlayBackground: overlayBackground, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: {
17
+ }, overlayBackground: overlayBackground, initial: { opacity: 0 }, maxHeight: maxHeight, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: {
18
18
  type: 'just'
19
19
  } },
20
20
  React.createElement(SideModalContainer, { slideFrom: slideFrom, maxHeight: maxHeight, 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)
package/build/es/components/src/components/SideModal/SideModal.styles.js CHANGED
@@ -2,7 +2,10 @@ import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
2
2
  import styled from 'styled-components';
3
3
  import { motion } from 'framer-motion';
4
4
 
5
- var SideModalOverlay = styled(motion.div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n z-index: ", ";\n background: ", ";\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n height: 100%;\n justify-content: center;\n align-items: center;\n\n @media (min-width: ", "px) {\n padding: ", "px;\n }\n"], ["\n display: flex;\n z-index: ", ";\n background: ", ";\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n height: 100%;\n justify-content: center;\n align-items: center;\n\n @media (min-width: ", "px) {\n padding: ", "px;\n }\n"])), function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.zIndex.modal; }, function (props) { return props.overlayBackground; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; });
5
+ var SideModalOverlay = styled(motion.div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n z-index: ", ";\n background: ", ";\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n height: 100%;\n ", ";\n justify-content: center;\n align-items: center;\n\n @media (min-width: ", "px) {\n padding: ", "px;\n max-height: unset;\n }\n"], ["\n display: flex;\n z-index: ", ";\n background: ", ";\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n height: 100%;\n ", ";\n justify-content: center;\n align-items: center;\n\n @media (min-width: ", "px) {\n padding: ", "px;\n max-height: unset;\n }\n"])), function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.zIndex.modal; }, function (props) { return props.overlayBackground; }, function (props) {
6
+ return props.maxHeight &&
7
+ "\n max-height: ".concat(props.maxHeight, ";\n ");
8
+ }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; });
6
9
  var SideModalContainer = styled(motion.div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: 100vh;\n background: ", ";\n width: 100%;\n\n ", ";\n position: absolute;\n ", ";\n top: 0;\n z-index: ", ";\n ", ";\n overflow: auto;\n -ms-overflow-style: none;\n scrollbar-width: none;\n &::-webkit-scrollbar {\n display: none;\n }\n\n @media (min-width: ", "px) {\n max-height: unset;\n width: ", "px;\n }\n"], ["\n height: 100vh;\n background: ", ";\n width: 100%;\n\n ", ";\n position: absolute;\n ", ";\n top: 0;\n z-index: ", ";\n ", ";\n overflow: auto;\n -ms-overflow-style: none;\n scrollbar-width: none;\n &::-webkit-scrollbar {\n display: none;\n }\n\n @media (min-width: ", "px) {\n max-height: unset;\n width: ", "px;\n }\n"])), function (props) { return props.background; }, function (_a) {
7
10
  var maxWidth = _a.maxWidth;
8
11
  return maxWidth && "max-width:".concat(maxWidth);
package/build/es/components/src/components/SideModal/SideModal.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SideModal.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"SideModal.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.7.163",
3
+ "version": "0.7.165",
4
4
  "license": "ISC",
5
5
  "sideEffects": false,
6
6
  "main": "./build/cjs/components/src/index.js",
@@ -62,14 +62,14 @@
62
62
  "styled-components": "^5.2.1"
63
63
  },
64
64
  "dependencies": {
65
- "@citygross/design-tokens": "^0.2.50",
65
+ "@citygross/design-tokens": "^0.2.51",
66
66
  "@citygross/icons": "^0.1.8",
67
67
  "@citygross/react-use-bg-wizard": "^0.0.8",
68
- "@citygross/typography": "^0.0.80",
68
+ "@citygross/typography": "^0.0.81",
69
69
  "@citygross/utils": "^0.0.22",
70
70
  "framer-motion": "^4.1.17",
71
71
  "moment": "^2.29.1",
72
72
  "react-loading-skeleton": "^2.2.0"
73
73
  },
74
- "gitHead": "de04356861a2d10407509670685b8660d9c97d0b"
74
+ "gitHead": "ef7a607461547f3ada530e211ca68356e03adf96"
75
75
  }