@citygross/components 0.8.38 → 0.8.39

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.
@@ -5,6 +5,10 @@ export declare type TItem = {
5
5
  description?: string;
6
6
  secondaryDescription?: React.ReactNode;
7
7
  };
8
+ export declare enum EListItemAlignment {
9
+ CENTER = "center",
10
+ TOP = "flex-start"
11
+ }
8
12
  export declare type TListItem = {
9
13
  item?: TItem;
10
14
  loading?: boolean;
@@ -15,5 +19,7 @@ export declare type TListItem = {
15
19
  smallSkeleton?: boolean;
16
20
  isSmall?: boolean;
17
21
  usedInSearch?: boolean;
22
+ alignment?: EListItemAlignment;
23
+ textColor?: string;
18
24
  };
19
- export declare function ListItem({ item, loading, isSmall, fallBackImage, imageAutoHeight, boldHeader, smallSkeleton, children, usedInSearch }: TListItem): JSX.Element;
25
+ export declare function ListItem({ item, loading, isSmall, fallBackImage, imageAutoHeight, boldHeader, smallSkeleton, children, alignment, textColor, usedInSearch }: TListItem): JSX.Element;
@@ -1,10 +1,12 @@
1
+ import { EListItemAlignment } from './ListItem';
1
2
  export declare type TListItem = {
2
3
  usedInSearch?: boolean;
4
+ alignment?: EListItemAlignment;
3
5
  };
4
6
  export declare const ItemInformationContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TListItem, never>;
5
7
  export declare const ListItemContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
6
8
  export declare const ListLeft: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TListItem, never>;
7
- export declare const ListRight: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
9
+ export declare const ListRight: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Pick<TListItem, "alignment">, never>;
8
10
  export declare type TListImageContainer = {
9
11
  isSmall?: boolean;
10
12
  };
@@ -50,7 +50,7 @@ require('../IconToolTip/IconToolTip.styles.js');
50
50
  var Spacer = require('../Spacer/Spacer.js');
51
51
  require('../InfoTextBlock/InfoTextBlock.styles.js');
52
52
  require('../LayoutBox/LayoutBox.styles.js');
53
- require('../ListItem/ListItem.styles.js');
53
+ require('../ListItem/ListItem.js');
54
54
  require('../ListItemWithRadio/ListItemWithRadio.styles.js');
55
55
  require('../Links/Link.js');
56
56
  require('react-dom');
@@ -14,21 +14,26 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
14
14
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
15
15
  var Skeleton__default = /*#__PURE__*/_interopDefaultLegacy(Skeleton);
16
16
 
17
+ exports.EListItemAlignment = void 0;
18
+ (function (EListItemAlignment) {
19
+ EListItemAlignment["CENTER"] = "center";
20
+ EListItemAlignment["TOP"] = "flex-start";
21
+ })(exports.EListItemAlignment || (exports.EListItemAlignment = {}));
17
22
  function ListItem(_a) {
18
- var _b;
19
- var item = _a.item, loading = _a.loading, isSmall = _a.isSmall, fallBackImage = _a.fallBackImage, imageAutoHeight = _a.imageAutoHeight, boldHeader = _a.boldHeader, smallSkeleton = _a.smallSkeleton, children = _a.children, usedInSearch = _a.usedInSearch;
23
+ var _b, _c;
24
+ var item = _a.item, loading = _a.loading, isSmall = _a.isSmall, fallBackImage = _a.fallBackImage, imageAutoHeight = _a.imageAutoHeight, boldHeader = _a.boldHeader, smallSkeleton = _a.smallSkeleton, children = _a.children, _d = _a.alignment, alignment = _d === void 0 ? exports.EListItemAlignment.CENTER : _d, textColor = _a.textColor, usedInSearch = _a.usedInSearch;
20
25
  return (React__default["default"].createElement(ListItem_styles.ListItemContainer, null,
21
- React__default["default"].createElement(ListItem_styles.ListLeft, { usedInSearch: usedInSearch },
26
+ React__default["default"].createElement(ListItem_styles.ListLeft, { usedInSearch: usedInSearch, alignment: alignment },
22
27
  React__default["default"].createElement(ListItem_styles.ListImageContainer, { isSmall: isSmall },
23
28
  React__default["default"].createElement(ListItem_styles.ListImage, { autoHeight: imageAutoHeight, src: (item === null || item === void 0 ? void 0 : item.image) || fallBackImage || fallback_grocery, alt: item === null || item === void 0 ? void 0 : item.name, isSmall: isSmall })),
24
- React__default["default"].createElement(ListItem_styles.ItemInformationContainer, { usedInSearch: usedInSearch },
25
- React__default["default"].createElement(typography.BodyText, { fontWeight: boldHeader ? 'semiBold' : 'regular', size: isSmall
29
+ React__default["default"].createElement(ListItem_styles.ItemInformationContainer, { usedInSearch: usedInSearch, alignment: alignment },
30
+ React__default["default"].createElement(typography.BodyText, { fontWeight: boldHeader ? 'semiBold' : 'regular', color: textColor || ((_b = index.theme.palette) === null || _b === void 0 ? void 0 : _b.darkest), size: isSmall
26
31
  ? typography.TextTypes.TextSize.EXTRASMALL
27
32
  : typography.TextTypes.TextSize.REGULAR }, (item === null || item === void 0 ? void 0 : item.name) || React__default["default"].createElement(Skeleton__default["default"], { width: smallSkeleton ? 150 : 250 })),
28
33
  loading ? (React__default["default"].createElement(typography.BodyText, { size: typography.TextTypes.TextSize.SMALL },
29
- React__default["default"].createElement(Skeleton__default["default"], { width: smallSkeleton ? 150 : 250 }))) : (item === null || item === void 0 ? void 0 : item.description) ? (React__default["default"].createElement(typography.BodyText, { size: isSmall ? typography.TextTypes.TextSize.TINY : typography.TextTypes.TextSize.SMALL, color: (_b = index.theme === null || index.theme === void 0 ? void 0 : index.theme.palette) === null || _b === void 0 ? void 0 : _b.dark }, item === null || item === void 0 ? void 0 : item.description)) : null,
34
+ React__default["default"].createElement(Skeleton__default["default"], { width: smallSkeleton ? 150 : 250 }))) : (item === null || item === void 0 ? void 0 : item.description) ? (React__default["default"].createElement(typography.BodyText, { size: isSmall ? typography.TextTypes.TextSize.TINY : typography.TextTypes.TextSize.SMALL, color: textColor || ((_c = index.theme.palette) === null || _c === void 0 ? void 0 : _c.dark) }, item === null || item === void 0 ? void 0 : item.description)) : null,
30
35
  (item === null || item === void 0 ? void 0 : item.secondaryDescription) && item.secondaryDescription)),
31
- children && React__default["default"].createElement(ListItem_styles.ListRight, null, children)));
36
+ children && (React__default["default"].createElement(ListItem_styles.ListRight, { alignment: alignment }, children))));
32
37
  }
33
38
 
34
39
  exports.ListItem = ListItem;
@@ -1 +1 @@
1
- {"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -4,15 +4,27 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var _tslib = require('../../../../_virtual/_tslib.js');
6
6
  var styled = require('styled-components');
7
+ var ListItem = require('./ListItem.js');
7
8
 
8
9
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
9
10
 
10
11
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
11
12
 
12
- var ItemInformationContainer = styled__default["default"].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: ", "px;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: ", "px;\n"])), function (props) { var _a; return (props.usedInSearch ? 0 : (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs); });
13
+ var ItemInformationContainer = styled__default["default"].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: ", "px;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: ", "px;\n"])), function (props) {
14
+ var _a;
15
+ return props.usedInSearch || props.alignment === ListItem.EListItemAlignment.TOP
16
+ ? 0
17
+ : (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs;
18
+ });
13
19
  var ListItemContainer = styled__default["default"].div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n p {\n padding: 1px 0px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n p {\n padding: 1px 0px;\n }\n"])));
14
- var ListLeft = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n display: flex;\n align-items: ", ";\n gap: ", "px;\n @media (min-width: ", "px) {\n gap: ", "px;\n }\n"], ["\n display: flex;\n align-items: ", ";\n gap: ", "px;\n @media (min-width: ", "px) {\n gap: ", "px;\n }\n"])), function (props) { return (props.usedInSearch ? 'inherit' : 'center'); }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, 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.constants) === null || _a === void 0 ? void 0 : _a.listItemFlexGap; });
15
- var ListRight = styled__default["default"].div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n justify-content: space-between;\n text-align: right;\n"], ["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n justify-content: space-between;\n text-align: right;\n"])));
20
+ var ListLeft = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n display: flex;\n align-items: ", ";\n gap: ", "px;\n @media (min-width: ", "px) {\n gap: ", "px;\n }\n"], ["\n display: flex;\n align-items: ", ";\n gap: ", "px;\n @media (min-width: ", "px) {\n gap: ", "px;\n }\n"])), function (props) {
21
+ return props.usedInSearch || props.alignment === ListItem.EListItemAlignment.TOP
22
+ ? 'inherit'
23
+ : 'center';
24
+ }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, 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.constants) === null || _a === void 0 ? void 0 : _a.listItemFlexGap; });
25
+ var ListRight = styled__default["default"].div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: ", ";\n justify-content: space-between;\n text-align: right;\n"], ["\n display: flex;\n flex-direction: row;\n align-items: ", ";\n justify-content: space-between;\n text-align: right;\n"])), function (props) {
26
+ return props.alignment === ListItem.EListItemAlignment.TOP ? 'flex-start' : 'center';
27
+ });
16
28
  var ListImageContainer = styled__default["default"].div(templateObject_5 || (templateObject_5 = _tslib.__makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: row;\n width: ", "px;\n height: ", "px;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: row;\n width: ", "px;\n height: ", "px;\n"])), function (props) {
17
29
  var _a, _b;
18
30
  return (props === null || props === void 0 ? void 0 : props.isSmall)
@@ -1 +1 @@
1
- {"version":3,"file":"ListItem.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ListItem.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -50,7 +50,7 @@ require('../IconToolTip/IconToolTip.styles.js');
50
50
  require('../Spacer/Spacer.styles.js');
51
51
  require('../InfoTextBlock/InfoTextBlock.styles.js');
52
52
  require('../LayoutBox/LayoutBox.styles.js');
53
- require('../ListItem/ListItem.styles.js');
53
+ require('../ListItem/ListItem.js');
54
54
  require('../ListItemWithRadio/ListItemWithRadio.styles.js');
55
55
  require('../Links/Link.js');
56
56
  require('react-dom');
@@ -139,6 +139,10 @@ exports.HighlightBox = HighlightBox.HighlightBox;
139
139
  exports.IconToolTip = IconToolTip.IconToolTip;
140
140
  exports.InfoWithButtonBlock = InfoTextBlock.InfoWithButtonBlock;
141
141
  exports.LayoutBox = LayoutBox.LayoutBox;
142
+ Object.defineProperty(exports, 'EListItemAlignment', {
143
+ enumerable: true,
144
+ get: function () { return ListItem.EListItemAlignment; }
145
+ });
142
146
  exports.ListItem = ListItem.ListItem;
143
147
  exports.ListItemWithRadio = ListItemWithRadio.ListItemWithRadio;
144
148
  Object.defineProperty(exports, 'ELinkVariant', {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -46,7 +46,7 @@ import '../IconToolTip/IconToolTip.styles.js';
46
46
  import { Spacer } from '../Spacer/Spacer.js';
47
47
  import '../InfoTextBlock/InfoTextBlock.styles.js';
48
48
  import '../LayoutBox/LayoutBox.styles.js';
49
- import '../ListItem/ListItem.styles.js';
49
+ import '../ListItem/ListItem.js';
50
50
  import '../ListItemWithRadio/ListItemWithRadio.styles.js';
51
51
  import '../Links/Link.js';
52
52
  import 'react-dom';
@@ -5,22 +5,27 @@ import FallbackIcon from './assets/fallback_grocery.svg.js';
5
5
  import { ListItemContainer, ListLeft, ListImageContainer, ListImage, ItemInformationContainer, ListRight } from './ListItem.styles.js';
6
6
  import { theme as theme_1 } from '../../../../design-tokens/build/index.js';
7
7
 
8
+ var EListItemAlignment;
9
+ (function (EListItemAlignment) {
10
+ EListItemAlignment["CENTER"] = "center";
11
+ EListItemAlignment["TOP"] = "flex-start";
12
+ })(EListItemAlignment || (EListItemAlignment = {}));
8
13
  function ListItem(_a) {
9
- var _b;
10
- var item = _a.item, loading = _a.loading, isSmall = _a.isSmall, fallBackImage = _a.fallBackImage, imageAutoHeight = _a.imageAutoHeight, boldHeader = _a.boldHeader, smallSkeleton = _a.smallSkeleton, children = _a.children, usedInSearch = _a.usedInSearch;
14
+ var _b, _c;
15
+ var item = _a.item, loading = _a.loading, isSmall = _a.isSmall, fallBackImage = _a.fallBackImage, imageAutoHeight = _a.imageAutoHeight, boldHeader = _a.boldHeader, smallSkeleton = _a.smallSkeleton, children = _a.children, _d = _a.alignment, alignment = _d === void 0 ? EListItemAlignment.CENTER : _d, textColor = _a.textColor, usedInSearch = _a.usedInSearch;
11
16
  return (React.createElement(ListItemContainer, null,
12
- React.createElement(ListLeft, { usedInSearch: usedInSearch },
17
+ React.createElement(ListLeft, { usedInSearch: usedInSearch, alignment: alignment },
13
18
  React.createElement(ListImageContainer, { isSmall: isSmall },
14
19
  React.createElement(ListImage, { autoHeight: imageAutoHeight, src: (item === null || item === void 0 ? void 0 : item.image) || fallBackImage || FallbackIcon, alt: item === null || item === void 0 ? void 0 : item.name, isSmall: isSmall })),
15
- React.createElement(ItemInformationContainer, { usedInSearch: usedInSearch },
16
- React.createElement(BodyText, { fontWeight: boldHeader ? 'semiBold' : 'regular', size: isSmall
20
+ React.createElement(ItemInformationContainer, { usedInSearch: usedInSearch, alignment: alignment },
21
+ React.createElement(BodyText, { fontWeight: boldHeader ? 'semiBold' : 'regular', color: textColor || ((_b = theme_1.palette) === null || _b === void 0 ? void 0 : _b.darkest), size: isSmall
17
22
  ? TextTypes.TextSize.EXTRASMALL
18
23
  : TextTypes.TextSize.REGULAR }, (item === null || item === void 0 ? void 0 : item.name) || React.createElement(Skeleton, { width: smallSkeleton ? 150 : 250 })),
19
24
  loading ? (React.createElement(BodyText, { size: TextTypes.TextSize.SMALL },
20
- React.createElement(Skeleton, { width: smallSkeleton ? 150 : 250 }))) : (item === null || item === void 0 ? void 0 : item.description) ? (React.createElement(BodyText, { size: isSmall ? TextTypes.TextSize.TINY : TextTypes.TextSize.SMALL, color: (_b = theme_1 === null || theme_1 === void 0 ? void 0 : theme_1.palette) === null || _b === void 0 ? void 0 : _b.dark }, item === null || item === void 0 ? void 0 : item.description)) : null,
25
+ React.createElement(Skeleton, { width: smallSkeleton ? 150 : 250 }))) : (item === null || item === void 0 ? void 0 : item.description) ? (React.createElement(BodyText, { size: isSmall ? TextTypes.TextSize.TINY : TextTypes.TextSize.SMALL, color: textColor || ((_c = theme_1.palette) === null || _c === void 0 ? void 0 : _c.dark) }, item === null || item === void 0 ? void 0 : item.description)) : null,
21
26
  (item === null || item === void 0 ? void 0 : item.secondaryDescription) && item.secondaryDescription)),
22
- children && React.createElement(ListRight, null, children)));
27
+ children && (React.createElement(ListRight, { alignment: alignment }, children))));
23
28
  }
24
29
 
25
- export { ListItem };
30
+ export { EListItemAlignment, ListItem };
26
31
  //# sourceMappingURL=ListItem.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,10 +1,22 @@
1
1
  import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
2
2
  import styled from 'styled-components';
3
+ import { EListItemAlignment } from './ListItem.js';
3
4
 
4
- var ItemInformationContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: ", "px;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: ", "px;\n"])), function (props) { var _a; return (props.usedInSearch ? 0 : (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs); });
5
+ var ItemInformationContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: ", "px;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: ", "px;\n"])), function (props) {
6
+ var _a;
7
+ return props.usedInSearch || props.alignment === EListItemAlignment.TOP
8
+ ? 0
9
+ : (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs;
10
+ });
5
11
  var ListItemContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n p {\n padding: 1px 0px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n p {\n padding: 1px 0px;\n }\n"])));
6
- var ListLeft = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n align-items: ", ";\n gap: ", "px;\n @media (min-width: ", "px) {\n gap: ", "px;\n }\n"], ["\n display: flex;\n align-items: ", ";\n gap: ", "px;\n @media (min-width: ", "px) {\n gap: ", "px;\n }\n"])), function (props) { return (props.usedInSearch ? 'inherit' : 'center'); }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, 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.constants) === null || _a === void 0 ? void 0 : _a.listItemFlexGap; });
7
- var ListRight = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n justify-content: space-between;\n text-align: right;\n"], ["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n justify-content: space-between;\n text-align: right;\n"])));
12
+ var ListLeft = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n align-items: ", ";\n gap: ", "px;\n @media (min-width: ", "px) {\n gap: ", "px;\n }\n"], ["\n display: flex;\n align-items: ", ";\n gap: ", "px;\n @media (min-width: ", "px) {\n gap: ", "px;\n }\n"])), function (props) {
13
+ return props.usedInSearch || props.alignment === EListItemAlignment.TOP
14
+ ? 'inherit'
15
+ : 'center';
16
+ }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, 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.constants) === null || _a === void 0 ? void 0 : _a.listItemFlexGap; });
17
+ var ListRight = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: ", ";\n justify-content: space-between;\n text-align: right;\n"], ["\n display: flex;\n flex-direction: row;\n align-items: ", ";\n justify-content: space-between;\n text-align: right;\n"])), function (props) {
18
+ return props.alignment === EListItemAlignment.TOP ? 'flex-start' : 'center';
19
+ });
8
20
  var ListImageContainer = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: row;\n width: ", "px;\n height: ", "px;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: row;\n width: ", "px;\n height: ", "px;\n"])), function (props) {
9
21
  var _a, _b;
10
22
  return (props === null || props === void 0 ? void 0 : props.isSmall)
@@ -1 +1 @@
1
- {"version":3,"file":"ListItem.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ListItem.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -46,7 +46,7 @@ import '../IconToolTip/IconToolTip.styles.js';
46
46
  import '../Spacer/Spacer.styles.js';
47
47
  import '../InfoTextBlock/InfoTextBlock.styles.js';
48
48
  import '../LayoutBox/LayoutBox.styles.js';
49
- import '../ListItem/ListItem.styles.js';
49
+ import '../ListItem/ListItem.js';
50
50
  import '../ListItemWithRadio/ListItemWithRadio.styles.js';
51
51
  import '../Links/Link.js';
52
52
  import 'react-dom';
@@ -35,7 +35,7 @@ export { HighlightBox } from './components/HighlightBox/HighlightBox.js';
35
35
  export { IconToolTip } from './components/IconToolTip/IconToolTip.js';
36
36
  export { InfoWithButtonBlock } from './components/InfoTextBlock/InfoTextBlock.js';
37
37
  export { LayoutBox } from './components/LayoutBox/LayoutBox.js';
38
- export { ListItem } from './components/ListItem/ListItem.js';
38
+ export { EListItemAlignment, ListItem } from './components/ListItem/ListItem.js';
39
39
  export { ListItemWithRadio } from './components/ListItemWithRadio/ListItemWithRadio.js';
40
40
  export { ELinkVariant, Link, LinkColors, LinkSize } from './components/Links/Link.js';
41
41
  export { Modal } from './components/Modal/Modal.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.8.38",
3
+ "version": "0.8.39",
4
4
  "license": "ISC",
5
5
  "sideEffects": false,
6
6
  "main": "./build/cjs/components/src/index.js",
@@ -76,5 +76,5 @@
76
76
  "react-slick": "^0.30.1",
77
77
  "slick-carousel": "^1.8.1"
78
78
  },
79
- "gitHead": "ce6c88899f7f909598665a2d5abd86b7346bc9f4"
79
+ "gitHead": "22526999104e426d8685060fd811895054863db8"
80
80
  }