@citygross/components 0.7.91 → 0.7.92

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 (12) hide show
  1. package/build/@types/components/Button/Button.d.ts +2 -1
  2. package/build/cjs/components/src/components/Button/Button.js +1 -0
  3. package/build/cjs/components/src/components/Button/Button.js.map +1 -1
  4. package/build/cjs/components/src/components/Button/Button.styles.js +19 -16
  5. package/build/cjs/components/src/components/Button/Button.styles.js.map +1 -1
  6. package/build/cjs/components/src/components/SideModal/SideModal.styles.js +1 -1
  7. package/build/es/components/src/components/Button/Button.js +1 -0
  8. package/build/es/components/src/components/Button/Button.js.map +1 -1
  9. package/build/es/components/src/components/Button/Button.styles.js +19 -16
  10. package/build/es/components/src/components/Button/Button.styles.js.map +1 -1
  11. package/build/es/components/src/components/SideModal/SideModal.styles.js +1 -1
  12. package/package.json +2 -2
package/build/@types/components/Button/Button.d.ts CHANGED
@@ -11,7 +11,8 @@ export declare enum ButtonColor {
11
11
  'white' = 2,
12
12
  'darkest' = 3,
13
13
  'lightest' = 4,
14
- 'buttonGray' = 5
14
+ 'buttonGray' = 5,
15
+ 'brandPurple' = 6
15
16
  }
16
17
  export declare type TButtonColor = keyof typeof ButtonColor;
17
18
  export declare type TBaseButton = styles.TButton & {
package/build/cjs/components/src/components/Button/Button.js CHANGED
@@ -24,6 +24,7 @@ exports.ButtonColor = void 0;
24
24
  ButtonColor[ButtonColor["darkest"] = 3] = "darkest";
25
25
  ButtonColor[ButtonColor["lightest"] = 4] = "lightest";
26
26
  ButtonColor[ButtonColor["buttonGray"] = 5] = "buttonGray";
27
+ ButtonColor[ButtonColor["brandPurple"] = 6] = "brandPurple";
27
28
  })(exports.ButtonColor || (exports.ButtonColor = {}));
28
29
  function Button(_a) {
29
30
  var _b;
package/build/cjs/components/src/components/Button/Button.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/cjs/components/src/components/Button/Button.styles.js CHANGED
@@ -62,13 +62,14 @@ var SpinnerSize = function (size) {
62
62
  return '26px';
63
63
  }
64
64
  };
65
- var BaseButton = styled__default["default"].button(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n /* reset */\n outline: none;\n border: none;\n\n backface-visibility: hidden;\n cursor: pointer;\n border-radius: ", "px;\n /* overflow: hidden; */\n pointer-events: ", ";\n -webkit-font-smoothing: antialiased;\n user-select: ", ";\n\n position: relative;\n\n /* typography */\n\n font-family: ", ";\n font-weight: ", ";\n text-align: ", ";\n white-space: ", ";\n\n /* colors */\n\n background: ", ";\n color: ", ";\n\n /* Width & Height */\n\n width: ", ";\n\n &::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n &::before {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n /* Hover Effect */\n\n &:hover {\n ::after {\n opacity: 1;\n }\n }\n &:active {\n ::before {\n opacity: 1;\n }\n ::after {\n opacity: 0;\n }\n }\n /* Media Queries */\n\n @media (max-width: ", "px) {\n align-self: ", ";\n }\n"], ["\n /* reset */\n outline: none;\n border: none;\n\n backface-visibility: hidden;\n cursor: pointer;\n border-radius: ", "px;\n /* overflow: hidden; */\n pointer-events: ", ";\n -webkit-font-smoothing: antialiased;\n user-select: ", ";\n\n position: relative;\n\n /* typography */\n\n font-family: ", ";\n font-weight: ", ";\n text-align: ", ";\n white-space: ", ";\n\n /* colors */\n\n background: ", ";\n color: ", ";\n\n /* Width & Height */\n\n width: ", ";\n\n &::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n &::before {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n /* Hover Effect */\n\n &:hover {\n ::after {\n opacity: 1;\n }\n }\n &:active {\n ::before {\n opacity: 1;\n }\n ::after {\n opacity: 0;\n }\n }\n /* Media Queries */\n\n @media (max-width: ", "px) {\n align-self: ", ";\n }\n"])), function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { return (props.isDisabled ? 'none' : 'all'); }, function (props) { return props.isDisabled && 'none'; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.type.primary; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.weight.medium; }, function (props) { return (props.center ? 'center' : 'initial'); }, function (props) { return (props.noWrap ? 'nowrap' : 'normal'); }, function (props) { var _a, _b; return props.isDisabled ? (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium : props.color; }, function (props) {
66
- var _a, _b, _c, _d, _e, _f, _g, _h;
67
- return props.color === ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.secondary) ||
65
+ var BaseButton = styled__default["default"].button(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n /* reset */\n outline: none;\n border: none;\n\n backface-visibility: hidden;\n cursor: pointer;\n border-radius: ", "px;\n /* overflow: hidden; */\n pointer-events: ", ";\n -webkit-font-smoothing: antialiased;\n user-select: ", ";\n\n position: relative;\n\n /* typography */\n\n font-family: ", ";\n font-weight: ", ";\n text-align: ", ";\n white-space: ", ";\n\n /* colors */\n\n background: ", ";\n\n color: ", ";\n\n /* Width & Height */\n\n width: ", ";\n\n &::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n &::before {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n /* Hover Effect */\n\n &:hover {\n ::after {\n opacity: 1;\n }\n }\n &:active {\n ::before {\n opacity: 1;\n }\n ::after {\n opacity: 0;\n }\n }\n /* Media Queries */\n\n @media (max-width: ", "px) {\n align-self: ", ";\n }\n"], ["\n /* reset */\n outline: none;\n border: none;\n\n backface-visibility: hidden;\n cursor: pointer;\n border-radius: ", "px;\n /* overflow: hidden; */\n pointer-events: ", ";\n -webkit-font-smoothing: antialiased;\n user-select: ", ";\n\n position: relative;\n\n /* typography */\n\n font-family: ", ";\n font-weight: ", ";\n text-align: ", ";\n white-space: ", ";\n\n /* colors */\n\n background: ", ";\n\n color: ", ";\n\n /* Width & Height */\n\n width: ", ";\n\n &::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n &::before {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n /* Hover Effect */\n\n &:hover {\n ::after {\n opacity: 1;\n }\n }\n &:active {\n ::before {\n opacity: 1;\n }\n ::after {\n opacity: 0;\n }\n }\n /* Media Queries */\n\n @media (max-width: ", "px) {\n align-self: ", ";\n }\n"])), function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { return (props.isDisabled ? 'none' : 'all'); }, function (props) { return props.isDisabled && 'none'; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.type.primary; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.weight.medium; }, function (props) { return (props.center ? 'center' : 'initial'); }, function (props) { return (props.noWrap ? 'nowrap' : 'normal'); }, function (props) { var _a, _b; return props.isDisabled ? (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium : props.color; }, function (props) {
66
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
67
+ return (props.color === ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.secondary) ||
68
68
  props.color === ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.darkest) ||
69
- props.isDisabled
70
- ? (_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.white
71
- : (_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.darkest;
69
+ props.color === ((_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.brandPurple) ||
70
+ props.isDisabled)
71
+ ? (_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.white
72
+ : (_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.darkest;
72
73
  }, function (props) { return (props.fullWidth ? '100%' : 'auto'); }, function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonActive; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { return (props.center ? 'center' : 'initial'); });
73
74
  var BasePrimaryButton = styled__default["default"](BaseButton)(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n /* TypoGraphy */\n\n font-size: ", ";\n line-height: ", ";\n\n /* shadow */\n\n box-shadow: ", ";\n\n /* Padding */\n\n padding: ", ";\n\n @media (min-width: ", "px) {\n font-size: ", ";\n\n padding: ", ";\n\n box-shadow: ", ";\n }\n"], ["\n /* TypoGraphy */\n\n font-size: ", ";\n line-height: ", ";\n\n /* shadow */\n\n box-shadow: ", ";\n\n /* Padding */\n\n padding: ", ";\n\n @media (min-width: ", "px) {\n font-size: ", ";\n\n padding: ", ";\n\n box-shadow: ", ";\n }\n"])), function (props) { return ButtonFontSize(props.xsSize || props.size); }, function (props) {
74
75
  var _a, _b;
@@ -76,35 +77,37 @@ var BasePrimaryButton = styled__default["default"](BaseButton)(templateObject_2
76
77
  ? "".concat((_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.lineHeight.s2, "px")
77
78
  : "".concat((_b = props.theme.typography) === null || _b === void 0 ? void 0 : _b.lineHeight.m1, "px");
78
79
  }, function (props) {
79
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
80
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
80
81
  return props.selected
81
82
  ? " inset 0px 0px 0px 1px ".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.blueMedium, ",\n ").concat((_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.boxShadow.buttonHover)
82
83
  : props.xsSize ||
83
84
  (props.size &&
84
85
  (props.color === ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.primary) ||
85
86
  props.color === ((_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.secondary) ||
86
- props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.buttonGray)))
87
+ props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.buttonGray) ||
88
+ props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.brandPurple)))
87
89
  ? ButtonShadow(props.xsSize || props.size)
88
- : props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.white) ||
89
- props.color === ((_m = (_l = props === null || props === void 0 ? void 0 : props.theme) === null || _l === void 0 ? void 0 : _l.palette) === null || _m === void 0 ? void 0 : _m.lightest)
90
- ? "inset 0px 0px 0px 1px ".concat((_o = props.theme.palette) === null || _o === void 0 ? void 0 : _o.medium)
90
+ : props.color === ((_m = (_l = props === null || props === void 0 ? void 0 : props.theme) === null || _l === void 0 ? void 0 : _l.palette) === null || _m === void 0 ? void 0 : _m.white) ||
91
+ props.color === ((_p = (_o = props === null || props === void 0 ? void 0 : props.theme) === null || _o === void 0 ? void 0 : _o.palette) === null || _p === void 0 ? void 0 : _p.lightest)
92
+ ? "inset 0px 0px 0px 1px ".concat((_q = props.theme.palette) === null || _q === void 0 ? void 0 : _q.medium)
91
93
  : 'none';
92
94
  }, function (props) {
93
95
  return ButtonPadding(props.xsSize || props.size, props.icon, props.flexReverse);
94
96
  }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { return ButtonFontSize(props.size); }, function (props) {
95
97
  return ButtonPadding(props.size, props.icon, props.flexReverse);
96
98
  }, function (props) {
97
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
99
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
98
100
  return props.selected
99
101
  ? " inset 0px 0px 0px 1px ".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.blueMedium, ",\n ").concat((_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.boxShadow.buttonHover)
100
102
  : props.size &&
101
103
  (props.color === ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.primary) ||
102
104
  props.color === ((_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.secondary) ||
103
- props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.buttonGray))
105
+ props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.buttonGray) ||
106
+ props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.brandPurple))
104
107
  ? ButtonShadow(props.size)
105
- : props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.white) ||
106
- props.color === ((_m = (_l = props === null || props === void 0 ? void 0 : props.theme) === null || _l === void 0 ? void 0 : _l.palette) === null || _m === void 0 ? void 0 : _m.lightest)
107
- ? "inset 0px 0px 0px 1px ".concat((_o = props.theme.palette) === null || _o === void 0 ? void 0 : _o.medium)
108
+ : props.color === ((_m = (_l = props === null || props === void 0 ? void 0 : props.theme) === null || _l === void 0 ? void 0 : _l.palette) === null || _m === void 0 ? void 0 : _m.white) ||
109
+ props.color === ((_p = (_o = props === null || props === void 0 ? void 0 : props.theme) === null || _o === void 0 ? void 0 : _o.palette) === null || _p === void 0 ? void 0 : _p.lightest)
110
+ ? "inset 0px 0px 0px 1px ".concat((_q = props.theme.palette) === null || _q === void 0 ? void 0 : _q.medium)
108
111
  : 'none';
109
112
  });
110
113
  var ButtonChildContainer = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: ", ";\n width: 100%;\n gap: ", "px;\n align-items: center;\n justify-content: center;\n flex-wrap: ", ";\n"], ["\n display: flex;\n flex-direction: ", ";\n width: 100%;\n gap: ", "px;\n align-items: center;\n justify-content: center;\n flex-wrap: ", ";\n"])), function (props) { return (props.flexReverse ? 'row-reverse' : 'row'); }, function (props) {
package/build/cjs/components/src/components/Button/Button.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Button.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Button.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/cjs/components/src/components/SideModal/SideModal.styles.js CHANGED
@@ -11,7 +11,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
11
11
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
12
12
 
13
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; });
14
- var SideModalContainer = styled__default["default"](framerMotion.motion.div)(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n overflow: auto;\n min-height: 100vh;\n background: ", ";\n width: 100%;\n ", ";\n position: absolute;\n\n @media (min-width: ", "px) {\n width: ", "px;\n }\n"], ["\n overflow: auto;\n min-height: 100vh;\n background: ", ";\n width: 100%;\n ", ";\n position: absolute;\n\n @media (min-width: ", "px) {\n width: ", "px;\n }\n"])), function (props) { return props.background; }, function (props) { return ((props === null || props === void 0 ? void 0 : props.slideFrom) === 'left' ? "left: 0px" : 'right: 0px'); }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { return props.width; });
14
+ var SideModalContainer = styled__default["default"](framerMotion.motion.div)(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n height: 100vh;\n background: ", ";\n width: 100%;\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 @media (min-width: ", "px) {\n width: ", "px;\n }\n"], ["\n height: 100vh;\n background: ", ";\n width: 100%;\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 @media (min-width: ", "px) {\n width: ", "px;\n }\n"])), function (props) { return props.background; }, function (props) { return ((props === null || props === void 0 ? void 0 : props.slideFrom) === 'left' ? "left: 0px" : 'right: 0px'); }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { return props.width; });
15
15
  var templateObject_1, templateObject_2;
16
16
 
17
17
  exports.SideModalContainer = SideModalContainer;
package/build/es/components/src/components/Button/Button.js CHANGED
@@ -16,6 +16,7 @@ var ButtonColor;
16
16
  ButtonColor[ButtonColor["darkest"] = 3] = "darkest";
17
17
  ButtonColor[ButtonColor["lightest"] = 4] = "lightest";
18
18
  ButtonColor[ButtonColor["buttonGray"] = 5] = "buttonGray";
19
+ ButtonColor[ButtonColor["brandPurple"] = 6] = "brandPurple";
19
20
  })(ButtonColor || (ButtonColor = {}));
20
21
  function Button(_a) {
21
22
  var _b;
package/build/es/components/src/components/Button/Button.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/Button/Button.styles.js CHANGED
@@ -54,13 +54,14 @@ var SpinnerSize = function (size) {
54
54
  return '26px';
55
55
  }
56
56
  };
57
- var BaseButton = styled.button(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n /* reset */\n outline: none;\n border: none;\n\n backface-visibility: hidden;\n cursor: pointer;\n border-radius: ", "px;\n /* overflow: hidden; */\n pointer-events: ", ";\n -webkit-font-smoothing: antialiased;\n user-select: ", ";\n\n position: relative;\n\n /* typography */\n\n font-family: ", ";\n font-weight: ", ";\n text-align: ", ";\n white-space: ", ";\n\n /* colors */\n\n background: ", ";\n color: ", ";\n\n /* Width & Height */\n\n width: ", ";\n\n &::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n &::before {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n /* Hover Effect */\n\n &:hover {\n ::after {\n opacity: 1;\n }\n }\n &:active {\n ::before {\n opacity: 1;\n }\n ::after {\n opacity: 0;\n }\n }\n /* Media Queries */\n\n @media (max-width: ", "px) {\n align-self: ", ";\n }\n"], ["\n /* reset */\n outline: none;\n border: none;\n\n backface-visibility: hidden;\n cursor: pointer;\n border-radius: ", "px;\n /* overflow: hidden; */\n pointer-events: ", ";\n -webkit-font-smoothing: antialiased;\n user-select: ", ";\n\n position: relative;\n\n /* typography */\n\n font-family: ", ";\n font-weight: ", ";\n text-align: ", ";\n white-space: ", ";\n\n /* colors */\n\n background: ", ";\n color: ", ";\n\n /* Width & Height */\n\n width: ", ";\n\n &::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n &::before {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n /* Hover Effect */\n\n &:hover {\n ::after {\n opacity: 1;\n }\n }\n &:active {\n ::before {\n opacity: 1;\n }\n ::after {\n opacity: 0;\n }\n }\n /* Media Queries */\n\n @media (max-width: ", "px) {\n align-self: ", ";\n }\n"])), function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { return (props.isDisabled ? 'none' : 'all'); }, function (props) { return props.isDisabled && 'none'; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.type.primary; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.weight.medium; }, function (props) { return (props.center ? 'center' : 'initial'); }, function (props) { return (props.noWrap ? 'nowrap' : 'normal'); }, function (props) { var _a, _b; return props.isDisabled ? (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium : props.color; }, function (props) {
58
- var _a, _b, _c, _d, _e, _f, _g, _h;
59
- return props.color === ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.secondary) ||
57
+ var BaseButton = styled.button(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n /* reset */\n outline: none;\n border: none;\n\n backface-visibility: hidden;\n cursor: pointer;\n border-radius: ", "px;\n /* overflow: hidden; */\n pointer-events: ", ";\n -webkit-font-smoothing: antialiased;\n user-select: ", ";\n\n position: relative;\n\n /* typography */\n\n font-family: ", ";\n font-weight: ", ";\n text-align: ", ";\n white-space: ", ";\n\n /* colors */\n\n background: ", ";\n\n color: ", ";\n\n /* Width & Height */\n\n width: ", ";\n\n &::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n &::before {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n /* Hover Effect */\n\n &:hover {\n ::after {\n opacity: 1;\n }\n }\n &:active {\n ::before {\n opacity: 1;\n }\n ::after {\n opacity: 0;\n }\n }\n /* Media Queries */\n\n @media (max-width: ", "px) {\n align-self: ", ";\n }\n"], ["\n /* reset */\n outline: none;\n border: none;\n\n backface-visibility: hidden;\n cursor: pointer;\n border-radius: ", "px;\n /* overflow: hidden; */\n pointer-events: ", ";\n -webkit-font-smoothing: antialiased;\n user-select: ", ";\n\n position: relative;\n\n /* typography */\n\n font-family: ", ";\n font-weight: ", ";\n text-align: ", ";\n white-space: ", ";\n\n /* colors */\n\n background: ", ";\n\n color: ", ";\n\n /* Width & Height */\n\n width: ", ";\n\n &::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n &::before {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ", "px;\n top: 0;\n left: 0;\n box-shadow: ", ";\n opacity: 0;\n -webkit-transition: ", ";\n transition: ", ";\n }\n\n /* Hover Effect */\n\n &:hover {\n ::after {\n opacity: 1;\n }\n }\n &:active {\n ::before {\n opacity: 1;\n }\n ::after {\n opacity: 0;\n }\n }\n /* Media Queries */\n\n @media (max-width: ", "px) {\n align-self: ", ";\n }\n"])), function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { return (props.isDisabled ? 'none' : 'all'); }, function (props) { return props.isDisabled && 'none'; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.type.primary; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.weight.medium; }, function (props) { return (props.center ? 'center' : 'initial'); }, function (props) { return (props.noWrap ? 'nowrap' : 'normal'); }, function (props) { var _a, _b; return props.isDisabled ? (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium : props.color; }, function (props) {
58
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
59
+ return (props.color === ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.secondary) ||
60
60
  props.color === ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.darkest) ||
61
- props.isDisabled
62
- ? (_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.white
63
- : (_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.darkest;
61
+ props.color === ((_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.brandPurple) ||
62
+ props.isDisabled)
63
+ ? (_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.white
64
+ : (_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.darkest;
64
65
  }, function (props) { return (props.fullWidth ? '100%' : 'auto'); }, function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a, _b; return (_a = props.borderRadius) !== null && _a !== void 0 ? _a : (_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonActive; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a; return (_a = props.theme.animations) === null || _a === void 0 ? void 0 : _a.buttonTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { return (props.center ? 'center' : 'initial'); });
65
66
  var BasePrimaryButton = styled(BaseButton)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n /* TypoGraphy */\n\n font-size: ", ";\n line-height: ", ";\n\n /* shadow */\n\n box-shadow: ", ";\n\n /* Padding */\n\n padding: ", ";\n\n @media (min-width: ", "px) {\n font-size: ", ";\n\n padding: ", ";\n\n box-shadow: ", ";\n }\n"], ["\n /* TypoGraphy */\n\n font-size: ", ";\n line-height: ", ";\n\n /* shadow */\n\n box-shadow: ", ";\n\n /* Padding */\n\n padding: ", ";\n\n @media (min-width: ", "px) {\n font-size: ", ";\n\n padding: ", ";\n\n box-shadow: ", ";\n }\n"])), function (props) { return ButtonFontSize(props.xsSize || props.size); }, function (props) {
66
67
  var _a, _b;
@@ -68,35 +69,37 @@ var BasePrimaryButton = styled(BaseButton)(templateObject_2 || (templateObject_2
68
69
  ? "".concat((_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.lineHeight.s2, "px")
69
70
  : "".concat((_b = props.theme.typography) === null || _b === void 0 ? void 0 : _b.lineHeight.m1, "px");
70
71
  }, function (props) {
71
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
72
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
72
73
  return props.selected
73
74
  ? " inset 0px 0px 0px 1px ".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.blueMedium, ",\n ").concat((_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.boxShadow.buttonHover)
74
75
  : props.xsSize ||
75
76
  (props.size &&
76
77
  (props.color === ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.primary) ||
77
78
  props.color === ((_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.secondary) ||
78
- props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.buttonGray)))
79
+ props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.buttonGray) ||
80
+ props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.brandPurple)))
79
81
  ? ButtonShadow(props.xsSize || props.size)
80
- : props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.white) ||
81
- props.color === ((_m = (_l = props === null || props === void 0 ? void 0 : props.theme) === null || _l === void 0 ? void 0 : _l.palette) === null || _m === void 0 ? void 0 : _m.lightest)
82
- ? "inset 0px 0px 0px 1px ".concat((_o = props.theme.palette) === null || _o === void 0 ? void 0 : _o.medium)
82
+ : props.color === ((_m = (_l = props === null || props === void 0 ? void 0 : props.theme) === null || _l === void 0 ? void 0 : _l.palette) === null || _m === void 0 ? void 0 : _m.white) ||
83
+ props.color === ((_p = (_o = props === null || props === void 0 ? void 0 : props.theme) === null || _o === void 0 ? void 0 : _o.palette) === null || _p === void 0 ? void 0 : _p.lightest)
84
+ ? "inset 0px 0px 0px 1px ".concat((_q = props.theme.palette) === null || _q === void 0 ? void 0 : _q.medium)
83
85
  : 'none';
84
86
  }, function (props) {
85
87
  return ButtonPadding(props.xsSize || props.size, props.icon, props.flexReverse);
86
88
  }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { return ButtonFontSize(props.size); }, function (props) {
87
89
  return ButtonPadding(props.size, props.icon, props.flexReverse);
88
90
  }, function (props) {
89
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
91
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
90
92
  return props.selected
91
93
  ? " inset 0px 0px 0px 1px ".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.blueMedium, ",\n ").concat((_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.boxShadow.buttonHover)
92
94
  : props.size &&
93
95
  (props.color === ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.primary) ||
94
96
  props.color === ((_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.secondary) ||
95
- props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.buttonGray))
97
+ props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.buttonGray) ||
98
+ props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.brandPurple))
96
99
  ? ButtonShadow(props.size)
97
- : props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.white) ||
98
- props.color === ((_m = (_l = props === null || props === void 0 ? void 0 : props.theme) === null || _l === void 0 ? void 0 : _l.palette) === null || _m === void 0 ? void 0 : _m.lightest)
99
- ? "inset 0px 0px 0px 1px ".concat((_o = props.theme.palette) === null || _o === void 0 ? void 0 : _o.medium)
100
+ : props.color === ((_m = (_l = props === null || props === void 0 ? void 0 : props.theme) === null || _l === void 0 ? void 0 : _l.palette) === null || _m === void 0 ? void 0 : _m.white) ||
101
+ props.color === ((_p = (_o = props === null || props === void 0 ? void 0 : props.theme) === null || _o === void 0 ? void 0 : _o.palette) === null || _p === void 0 ? void 0 : _p.lightest)
102
+ ? "inset 0px 0px 0px 1px ".concat((_q = props.theme.palette) === null || _q === void 0 ? void 0 : _q.medium)
100
103
  : 'none';
101
104
  });
102
105
  var ButtonChildContainer = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n flex-direction: ", ";\n width: 100%;\n gap: ", "px;\n align-items: center;\n justify-content: center;\n flex-wrap: ", ";\n"], ["\n display: flex;\n flex-direction: ", ";\n width: 100%;\n gap: ", "px;\n align-items: center;\n justify-content: center;\n flex-wrap: ", ";\n"])), function (props) { return (props.flexReverse ? 'row-reverse' : 'row'); }, function (props) {
package/build/es/components/src/components/Button/Button.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Button.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Button.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/SideModal/SideModal.styles.js CHANGED
@@ -3,7 +3,7 @@ import styled from 'styled-components';
3
3
  import { motion } from 'framer-motion';
4
4
 
5
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; });
6
- var SideModalContainer = styled(motion.div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n overflow: auto;\n min-height: 100vh;\n background: ", ";\n width: 100%;\n ", ";\n position: absolute;\n\n @media (min-width: ", "px) {\n width: ", "px;\n }\n"], ["\n overflow: auto;\n min-height: 100vh;\n background: ", ";\n width: 100%;\n ", ";\n position: absolute;\n\n @media (min-width: ", "px) {\n width: ", "px;\n }\n"])), function (props) { return props.background; }, function (props) { return ((props === null || props === void 0 ? void 0 : props.slideFrom) === 'left' ? "left: 0px" : 'right: 0px'); }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { return props.width; });
6
+ var SideModalContainer = styled(motion.div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: 100vh;\n background: ", ";\n width: 100%;\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 @media (min-width: ", "px) {\n width: ", "px;\n }\n"], ["\n height: 100vh;\n background: ", ";\n width: 100%;\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 @media (min-width: ", "px) {\n width: ", "px;\n }\n"])), function (props) { return props.background; }, function (props) { return ((props === null || props === void 0 ? void 0 : props.slideFrom) === 'left' ? "left: 0px" : 'right: 0px'); }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { return props.width; });
7
7
  var templateObject_1, templateObject_2;
8
8
 
9
9
  export { SideModalContainer, SideModalOverlay };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.7.91",
3
+ "version": "0.7.92",
4
4
  "license": "ISC",
5
5
  "sideEffects": false,
6
6
  "main": "./build/cjs/components/src/index.js",
@@ -71,5 +71,5 @@
71
71
  "moment": "^2.29.1",
72
72
  "react-loading-skeleton": "^2.2.0"
73
73
  },
74
- "gitHead": "df7b5f55d1fa1c53becff55dd6f7e7150eca2894"
74
+ "gitHead": "8f5d1869c782b8b67be9c6217e3da7f0415e698c"
75
75
  }