@citygross/components 0.19.6 → 0.19.7

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.
@@ -37,6 +37,7 @@ export declare type TListItem = {
37
37
  item?: TItem;
38
38
  isSmall?: boolean;
39
39
  loading?: boolean;
40
+ label?: string;
40
41
  showPriceStripe?: boolean;
41
42
  smallSkeleton?: boolean;
42
43
  };
@@ -4,10 +4,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var React = require('react');
6
6
  var Skeleton = require('react-loading-skeleton');
7
+ var designTokens = require('@citygross/design-tokens');
8
+ var AvailabilityLabel = require('../AvailabilityLabel/AvailabilityLabel.js');
7
9
  var Fieldset = require('../Fieldset/Fieldset.js');
8
10
  var Checkbox = require('../FormElements/Checkbox/Checkbox.js');
11
+ var Label = require('../Label/Label.js');
9
12
  var PriceStripe = require('../PriceStripe/PriceStripe.js');
10
- var AvailabilityLabel = require('../AvailabilityLabel/AvailabilityLabel.js');
11
13
  var ProductHeader = require('../ProductHeader/ProductHeader.js');
12
14
  var ListItem_styles = require('./ListItem.styles.js');
13
15
  var PriceTag_types = require('../PriceTag/PriceTag.types.js');
@@ -23,8 +25,8 @@ exports.EListItemAlignment = void 0;
23
25
  EListItemAlignment["TOP"] = "flex-start";
24
26
  })(exports.EListItemAlignment || (exports.EListItemAlignment = {}));
25
27
  var ListItem = function (_a) {
26
- var _b;
27
- var _c = _a.alignment, alignment = _c === void 0 ? exports.EListItemAlignment.CENTER : _c, children = _a.children, checkboxes = _a.checkboxes, fallBackImage = _a.fallBackImage, checkboxLegendLabel = _a.checkboxLegendLabel, imageAutoHeight = _a.imageAutoHeight, item = _a.item, isSmall = _a.isSmall, _d = _a.loading, loading = _d === void 0 ? false : _d, _e = _a.showPriceStripe, showPriceStripe = _e === void 0 ? false : _e, smallSkeleton = _a.smallSkeleton;
28
+ var _b, _c, _d;
29
+ var _e = _a.alignment, alignment = _e === void 0 ? exports.EListItemAlignment.CENTER : _e, children = _a.children, checkboxes = _a.checkboxes, fallBackImage = _a.fallBackImage, checkboxLegendLabel = _a.checkboxLegendLabel, imageAutoHeight = _a.imageAutoHeight, item = _a.item, isSmall = _a.isSmall, label = _a.label, _f = _a.loading, loading = _f === void 0 ? false : _f, _g = _a.showPriceStripe, showPriceStripe = _g === void 0 ? false : _g, smallSkeleton = _a.smallSkeleton;
28
30
  return (React__default["default"].createElement(ListItem_styles.ListItemContainer, null,
29
31
  React__default["default"].createElement(ListItem_styles.ListLeft, { alignment: alignment },
30
32
  React__default["default"].createElement(ListItem_styles.ListImageContainer, { isSmall: isSmall },
@@ -54,9 +56,10 @@ var ListItem = function (_a) {
54
56
  checkbox.onChange(e.target.checked);
55
57
  }
56
58
  }, value: checkbox.value, alignItems: "flex-start" }));
57
- })))))),
59
+ })))),
60
+ label && (React__default["default"].createElement(Label.Label, { background: (_c = designTokens.theme.palette) === null || _c === void 0 ? void 0 : _c.blueLighter, color: (_d = designTokens.theme.palette) === null || _d === void 0 ? void 0 : _d.disabledDarkGray, label: label })))),
58
61
  (item === null || item === void 0 ? void 0 : item.secondaryDescription) && item.secondaryDescription)),
59
- children && (React__default["default"].createElement(ListItem_styles.ListRight, null, children))));
62
+ children && React__default["default"].createElement(ListItem_styles.ListRight, null, children)));
60
63
  };
61
64
 
62
65
  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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,9 +1,11 @@
1
1
  import React, { Fragment } from 'react';
2
2
  import Skeleton from 'react-loading-skeleton';
3
+ import { theme } from '@citygross/design-tokens';
4
+ import { AvailabilityLabel } from '../AvailabilityLabel/AvailabilityLabel.js';
3
5
  import { Fieldset } from '../Fieldset/Fieldset.js';
4
6
  import { Checkbox } from '../FormElements/Checkbox/Checkbox.js';
7
+ import { Label } from '../Label/Label.js';
5
8
  import { PriceStripe } from '../PriceStripe/PriceStripe.js';
6
- import { AvailabilityLabel } from '../AvailabilityLabel/AvailabilityLabel.js';
7
9
  import { ProductHeader, EProductHeader } from '../ProductHeader/ProductHeader.js';
8
10
  import { ListItemContainer, ListLeft, ListImageContainer, ListImage, ItemInformationContainer, VisuallyHiddenLegend, CheckboxContainer, ListRight } from './ListItem.styles.js';
9
11
  import { EPriceSize, EPriceVariant } from '../PriceTag/PriceTag.types.js';
@@ -14,8 +16,8 @@ var EListItemAlignment;
14
16
  EListItemAlignment["TOP"] = "flex-start";
15
17
  })(EListItemAlignment || (EListItemAlignment = {}));
16
18
  var ListItem = function (_a) {
17
- var _b;
18
- var _c = _a.alignment, alignment = _c === void 0 ? EListItemAlignment.CENTER : _c, children = _a.children, checkboxes = _a.checkboxes, fallBackImage = _a.fallBackImage, checkboxLegendLabel = _a.checkboxLegendLabel, imageAutoHeight = _a.imageAutoHeight, item = _a.item, isSmall = _a.isSmall, _d = _a.loading, loading = _d === void 0 ? false : _d, _e = _a.showPriceStripe, showPriceStripe = _e === void 0 ? false : _e, smallSkeleton = _a.smallSkeleton;
19
+ var _b, _c, _d;
20
+ var _e = _a.alignment, alignment = _e === void 0 ? EListItemAlignment.CENTER : _e, children = _a.children, checkboxes = _a.checkboxes, fallBackImage = _a.fallBackImage, checkboxLegendLabel = _a.checkboxLegendLabel, imageAutoHeight = _a.imageAutoHeight, item = _a.item, isSmall = _a.isSmall, label = _a.label, _f = _a.loading, loading = _f === void 0 ? false : _f, _g = _a.showPriceStripe, showPriceStripe = _g === void 0 ? false : _g, smallSkeleton = _a.smallSkeleton;
19
21
  return (React.createElement(ListItemContainer, null,
20
22
  React.createElement(ListLeft, { alignment: alignment },
21
23
  React.createElement(ListImageContainer, { isSmall: isSmall },
@@ -45,9 +47,10 @@ var ListItem = function (_a) {
45
47
  checkbox.onChange(e.target.checked);
46
48
  }
47
49
  }, value: checkbox.value, alignItems: "flex-start" }));
48
- })))))),
50
+ })))),
51
+ label && (React.createElement(Label, { background: (_c = theme.palette) === null || _c === void 0 ? void 0 : _c.blueLighter, color: (_d = theme.palette) === null || _d === void 0 ? void 0 : _d.disabledDarkGray, label: label })))),
49
52
  (item === null || item === void 0 ? void 0 : item.secondaryDescription) && item.secondaryDescription)),
50
- children && (React.createElement(ListRight, null, children))));
53
+ children && React.createElement(ListRight, null, children)));
51
54
  };
52
55
 
53
56
  export { EListItemAlignment, ListItem };
@@ -1 +1 @@
1
- {"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.19.6",
3
+ "version": "0.19.7",
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": "cd6ebba1870c2a4b11bc2b8be510b17f3b36fe93"
79
+ "gitHead": "271816201612dcad31d394bb60132d361fcb83dd"
80
80
  }