@citygross/components 0.7.138 → 0.7.140

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 (13) hide show
  1. package/build/@types/components/Button/Button.d.ts +2 -1
  2. package/build/@types/components/Button/Button.styles.d.ts +1 -1
  3. package/build/cjs/components/src/components/Button/Button.js +1 -0
  4. package/build/cjs/components/src/components/Button/Button.js.map +1 -1
  5. package/build/cjs/components/src/components/Button/Button.styles.js +2 -0
  6. package/build/cjs/components/src/components/Button/Button.styles.js.map +1 -1
  7. package/build/cjs/components/src/components/SearchListItem/SearchListItem.styles.js +1 -1
  8. package/build/es/components/src/components/Button/Button.js +1 -0
  9. package/build/es/components/src/components/Button/Button.js.map +1 -1
  10. package/build/es/components/src/components/Button/Button.styles.js +2 -0
  11. package/build/es/components/src/components/Button/Button.styles.js.map +1 -1
  12. package/build/es/components/src/components/SearchListItem/SearchListItem.styles.js +1 -1
  13. package/package.json +4 -4
package/build/@types/components/Button/Button.d.ts CHANGED
@@ -3,7 +3,8 @@ import * as styles from './Button.styles';
3
3
  export declare enum ButtonSize {
4
4
  'small' = 0,
5
5
  'medium' = 1,
6
- 'large' = 2
6
+ 'large' = 2,
7
+ 'header' = 3
7
8
  }
8
9
  export declare enum ButtonColor {
9
10
  'primary' = 0,
package/build/@types/components/Button/Button.styles.d.ts CHANGED
@@ -41,7 +41,7 @@ export declare const BaseButton: import("styled-components").StyledComponent<"bu
41
41
  export declare const BasePrimaryButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, TButton & {
42
42
  color: string;
43
43
  size: TButtonSize;
44
- xsSize?: "small" | "medium" | "large" | undefined;
44
+ xsSize?: "small" | "medium" | "large" | "header" | undefined;
45
45
  }, never>;
46
46
  export declare const ButtonChildContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TButtonChildContainer, never>;
47
47
  export declare const IconWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
package/build/cjs/components/src/components/Button/Button.js CHANGED
@@ -15,6 +15,7 @@ exports.ButtonSize = void 0;
15
15
  ButtonSize[ButtonSize["small"] = 0] = "small";
16
16
  ButtonSize[ButtonSize["medium"] = 1] = "medium";
17
17
  ButtonSize[ButtonSize["large"] = 2] = "large";
18
+ ButtonSize[ButtonSize["header"] = 3] = "header";
18
19
  })(exports.ButtonSize || (exports.ButtonSize = {}));
19
20
  exports.ButtonColor = void 0;
20
21
  (function (ButtonColor) {
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
@@ -32,6 +32,8 @@ var ButtonShadow = function (size) {
32
32
  };
33
33
  var ButtonPadding = function (theme, icon, flexReverse) {
34
34
  switch (theme) {
35
+ case 'header':
36
+ return icon ? '12px 14px' : '14px';
35
37
  case 'small':
36
38
  return icon ? '4px 8px' : '4px 12px';
37
39
  case 'medium':
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/SearchListItem/SearchListItem.styles.js CHANGED
@@ -10,7 +10,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
10
10
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
11
11
 
12
12
  var SearchListItemWrapper = styled__default["default"].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n display: grid;\n grid-template-columns: 2fr 1fr;\n grid-template-rows: 1fr auto;\n grid-template-areas:\n 'ListItemWrapper PriceTagWrapper PriceTagWrapper'\n 'ListItemWrapper ButtonWrapper ButtonWrapper';\n\n align-items: center;\n background-color: ", ";\n border-bottom: 1px solid ", ";\n padding: ", "px;\n\n @media (min-width: ", "px) {\n grid-template-columns: 2fr 1fr;\n grid-template-rows: 1fr;\n grid-auto-flow: row;\n grid-template-areas: 'ListItemWrapper PriceTagWrapper ButtonWrapper';\n }\n"], ["\n display: grid;\n grid-template-columns: 2fr 1fr;\n grid-template-rows: 1fr auto;\n grid-template-areas:\n 'ListItemWrapper PriceTagWrapper PriceTagWrapper'\n 'ListItemWrapper ButtonWrapper ButtonWrapper';\n\n align-items: center;\n background-color: ", ";\n border-bottom: 1px solid ", ";\n padding: ", "px;\n\n @media (min-width: ", "px) {\n grid-template-columns: 2fr 1fr;\n grid-template-rows: 1fr;\n grid-auto-flow: row;\n grid-template-areas: 'ListItemWrapper PriceTagWrapper ButtonWrapper';\n }\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.light; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.constants) === null || _b === void 0 ? void 0 : _b.headerBreakpoint; });
13
- var ListItemWrapper = styled__default["default"].div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n grid-area: ListItemWrapper;\n display: grid;\n grid-template-columns: ", "px;\n grid-auto-rows: 1fr;\n"], ["\n grid-area: ListItemWrapper;\n display: grid;\n grid-template-columns: ", "px;\n grid-auto-rows: 1fr;\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.searchListItemGridTemplateColumns; });
13
+ var ListItemWrapper = styled__default["default"].div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n grid-area: ListItemWrapper;\n"], ["\n grid-area: ListItemWrapper;\n"])));
14
14
  var PriceTagWrapper = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n grid-area: PriceTagWrapper;\n display: flex;\n justify-content: flex-end;\n\n @media (min-width: ", "px) {\n justify-content: flex-start;\n }\n"], ["\n grid-area: PriceTagWrapper;\n display: flex;\n justify-content: flex-end;\n\n @media (min-width: ", "px) {\n justify-content: flex-start;\n }\n"])), function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.constants) === null || _b === void 0 ? void 0 : _b.headerBreakpoint; });
15
15
  var ButtonWrapper = styled__default["default"].div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n grid-area: ButtonWrapper;\n min-width: ", "px;\n margin-top: ", "px;\n justify-self: end;\n @media (min-width: ", "px) {\n margin-top: 0;\n }\n"], ["\n grid-area: ButtonWrapper;\n min-width: ", "px;\n margin-top: ", "px;\n justify-self: end;\n @media (min-width: ", "px) {\n margin-top: 0;\n }\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonWrapperMinWidth; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.constants) === null || _b === void 0 ? void 0 : _b.headerBreakpoint; });
16
16
  var ToolTip = styled__default["default"].div(templateObject_5 || (templateObject_5 = _tslib.__makeTemplateObject(["\n visibility: hidden;\n position: absolute;\n min-width: ", "px;\n background-color: ", ";\n color: #fff;\n text-align: center;\n padding: ", "px;\n border-radius: ", "px;\n z-index: 1;\n opacity: 0;\n transition: opacity 0.3s;\n font-size: ", "px;\n\n top: ", "%;\n transform: translateY(-50%);\n left: ", "px;\n\n ::after {\n content: '';\n position: absolute;\n top: 50%;\n right: 100%;\n margin-top: ", "px;\n border-width: ", "px;\n border-style: solid;\n border-color: transparent\n ", " transparent\n transparent;\n }\n"], ["\n visibility: hidden;\n position: absolute;\n min-width: ", "px;\n background-color: ", ";\n color: #fff;\n text-align: center;\n padding: ", "px;\n border-radius: ", "px;\n z-index: 1;\n opacity: 0;\n transition: opacity 0.3s;\n font-size: ", "px;\n\n top: ", "%;\n transform: translateY(-50%);\n left: ", "px;\n\n ::after {\n content: '';\n position: absolute;\n top: 50%;\n right: 100%;\n margin-top: ", "px;\n border-width: ", "px;\n border-style: solid;\n border-color: transparent\n ", " transparent\n transparent;\n }\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.tooltipMinWidth; }, function (props) {
package/build/es/components/src/components/Button/Button.js CHANGED
@@ -7,6 +7,7 @@ var ButtonSize;
7
7
  ButtonSize[ButtonSize["small"] = 0] = "small";
8
8
  ButtonSize[ButtonSize["medium"] = 1] = "medium";
9
9
  ButtonSize[ButtonSize["large"] = 2] = "large";
10
+ ButtonSize[ButtonSize["header"] = 3] = "header";
10
11
  })(ButtonSize || (ButtonSize = {}));
11
12
  var ButtonColor;
12
13
  (function (ButtonColor) {
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
@@ -24,6 +24,8 @@ var ButtonShadow = function (size) {
24
24
  };
25
25
  var ButtonPadding = function (theme, icon, flexReverse) {
26
26
  switch (theme) {
27
+ case 'header':
28
+ return icon ? '12px 14px' : '14px';
27
29
  case 'small':
28
30
  return icon ? '4px 8px' : '4px 12px';
29
31
  case 'medium':
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/SearchListItem/SearchListItem.styles.js CHANGED
@@ -2,7 +2,7 @@ import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
2
2
  import styled from 'styled-components';
3
3
 
4
4
  var SearchListItemWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: grid;\n grid-template-columns: 2fr 1fr;\n grid-template-rows: 1fr auto;\n grid-template-areas:\n 'ListItemWrapper PriceTagWrapper PriceTagWrapper'\n 'ListItemWrapper ButtonWrapper ButtonWrapper';\n\n align-items: center;\n background-color: ", ";\n border-bottom: 1px solid ", ";\n padding: ", "px;\n\n @media (min-width: ", "px) {\n grid-template-columns: 2fr 1fr;\n grid-template-rows: 1fr;\n grid-auto-flow: row;\n grid-template-areas: 'ListItemWrapper PriceTagWrapper ButtonWrapper';\n }\n"], ["\n display: grid;\n grid-template-columns: 2fr 1fr;\n grid-template-rows: 1fr auto;\n grid-template-areas:\n 'ListItemWrapper PriceTagWrapper PriceTagWrapper'\n 'ListItemWrapper ButtonWrapper ButtonWrapper';\n\n align-items: center;\n background-color: ", ";\n border-bottom: 1px solid ", ";\n padding: ", "px;\n\n @media (min-width: ", "px) {\n grid-template-columns: 2fr 1fr;\n grid-template-rows: 1fr;\n grid-auto-flow: row;\n grid-template-areas: 'ListItemWrapper PriceTagWrapper ButtonWrapper';\n }\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.light; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.constants) === null || _b === void 0 ? void 0 : _b.headerBreakpoint; });
5
- var ListItemWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n grid-area: ListItemWrapper;\n display: grid;\n grid-template-columns: ", "px;\n grid-auto-rows: 1fr;\n"], ["\n grid-area: ListItemWrapper;\n display: grid;\n grid-template-columns: ", "px;\n grid-auto-rows: 1fr;\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.searchListItemGridTemplateColumns; });
5
+ var ListItemWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n grid-area: ListItemWrapper;\n"], ["\n grid-area: ListItemWrapper;\n"])));
6
6
  var PriceTagWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n grid-area: PriceTagWrapper;\n display: flex;\n justify-content: flex-end;\n\n @media (min-width: ", "px) {\n justify-content: flex-start;\n }\n"], ["\n grid-area: PriceTagWrapper;\n display: flex;\n justify-content: flex-end;\n\n @media (min-width: ", "px) {\n justify-content: flex-start;\n }\n"])), function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.constants) === null || _b === void 0 ? void 0 : _b.headerBreakpoint; });
7
7
  var ButtonWrapper = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n grid-area: ButtonWrapper;\n min-width: ", "px;\n margin-top: ", "px;\n justify-self: end;\n @media (min-width: ", "px) {\n margin-top: 0;\n }\n"], ["\n grid-area: ButtonWrapper;\n min-width: ", "px;\n margin-top: ", "px;\n justify-self: end;\n @media (min-width: ", "px) {\n margin-top: 0;\n }\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonWrapperMinWidth; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.constants) === null || _b === void 0 ? void 0 : _b.headerBreakpoint; });
8
8
  var ToolTip = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n visibility: hidden;\n position: absolute;\n min-width: ", "px;\n background-color: ", ";\n color: #fff;\n text-align: center;\n padding: ", "px;\n border-radius: ", "px;\n z-index: 1;\n opacity: 0;\n transition: opacity 0.3s;\n font-size: ", "px;\n\n top: ", "%;\n transform: translateY(-50%);\n left: ", "px;\n\n ::after {\n content: '';\n position: absolute;\n top: 50%;\n right: 100%;\n margin-top: ", "px;\n border-width: ", "px;\n border-style: solid;\n border-color: transparent\n ", " transparent\n transparent;\n }\n"], ["\n visibility: hidden;\n position: absolute;\n min-width: ", "px;\n background-color: ", ";\n color: #fff;\n text-align: center;\n padding: ", "px;\n border-radius: ", "px;\n z-index: 1;\n opacity: 0;\n transition: opacity 0.3s;\n font-size: ", "px;\n\n top: ", "%;\n transform: translateY(-50%);\n left: ", "px;\n\n ::after {\n content: '';\n position: absolute;\n top: 50%;\n right: 100%;\n margin-top: ", "px;\n border-width: ", "px;\n border-style: solid;\n border-color: transparent\n ", " transparent\n transparent;\n }\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.tooltipMinWidth; }, function (props) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.7.138",
3
+ "version": "0.7.140",
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.37",
65
+ "@citygross/design-tokens": "^0.2.39",
66
66
  "@citygross/icons": "^0.1.8",
67
67
  "@citygross/react-use-bg-wizard": "^0.0.8",
68
- "@citygross/typography": "^0.0.67",
68
+ "@citygross/typography": "^0.0.69",
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": "b085539f3468392e9b389733b9fa0c25aba4bc83"
74
+ "gitHead": "da7d8e4449bff730b58e2d7713be1dda30f2f678"
75
75
  }