@citygross/components 0.8.63 → 0.8.65

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 (14) hide show
  1. package/build/@types/components/ListItem/ListItem.d.ts +1 -1
  2. package/build/@types/components/PriceTag/PriceTag.types.d.ts +1 -1
  3. package/build/@types/components/ProductHeader/ProductHeader.d.ts +12 -0
  4. package/build/cjs/components/src/components/ListItem/ListItem.js +5 -7
  5. package/build/cjs/components/src/components/ListItem/ListItem.js.map +1 -1
  6. package/build/cjs/components/src/components/PriceTag/PriceTag.types.js +1 -1
  7. package/build/cjs/components/src/components/ProductHeader/ProductHeader.js +40 -0
  8. package/build/cjs/components/src/components/ProductHeader/ProductHeader.js.map +1 -0
  9. package/build/es/components/src/components/ListItem/ListItem.js +5 -7
  10. package/build/es/components/src/components/ListItem/ListItem.js.map +1 -1
  11. package/build/es/components/src/components/PriceTag/PriceTag.types.js +1 -1
  12. package/build/es/components/src/components/ProductHeader/ProductHeader.js +32 -0
  13. package/build/es/components/src/components/ProductHeader/ProductHeader.js.map +1 -0
  14. package/package.json +2 -2
package/build/@types/components/ListItem/ListItem.d.ts CHANGED
@@ -22,4 +22,4 @@ export declare type TListItem = {
22
22
  alignment?: EListItemAlignment;
23
23
  textColor?: string;
24
24
  };
25
- export declare const ListItem: ({ item, loading, isSmall, fallBackImage, imageAutoHeight, boldHeader, smallSkeleton, children, alignment, textColor, usedInSearch }: TListItem) => JSX.Element;
25
+ export declare const ListItem: React.FunctionComponent<TListItem>;
package/build/@types/components/PriceTag/PriceTag.types.d.ts CHANGED
@@ -6,7 +6,7 @@ export declare enum EPriceSize {
6
6
  export declare enum EPriceVariant {
7
7
  CAMPAIGN = "Kampanj",
8
8
  KLIPP = "Klipp!",
9
- PRIO = "Prio-pris",
9
+ PRIO = "PRIO-pris",
10
10
  REGULAR = "Ordinarie"
11
11
  }
12
12
  export declare type TPriceTag = {
package/build/@types/components/ProductHeader/ProductHeader.d.ts ADDED
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ export declare enum EProductHeader {
3
+ LIST_ITEM = "listItem",
4
+ CARD = "card",
5
+ DETAIL_PAGE = "detailPage"
6
+ }
7
+ export declare type TProductHeader = {
8
+ location: EProductHeader;
9
+ title?: string;
10
+ subTitle?: string;
11
+ };
12
+ export declare const ProductHeader: React.FunctionComponent<TProductHeader>;
package/build/cjs/components/src/components/ListItem/ListItem.js CHANGED
@@ -3,10 +3,9 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var React = require('react');
6
- var typography = require('@citygross/typography');
7
6
  var Skeleton = require('react-loading-skeleton');
8
7
  var ListItem_styles = require('./ListItem.styles.js');
9
- var index = require('../../../../design-tokens/build/index.js');
8
+ var ProductHeader = require('../ProductHeader/ProductHeader.js');
10
9
 
11
10
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
12
11
 
@@ -19,8 +18,7 @@ exports.EListItemAlignment = void 0;
19
18
  EListItemAlignment["TOP"] = "flex-start";
20
19
  })(exports.EListItemAlignment || (exports.EListItemAlignment = {}));
21
20
  var ListItem = function (_a) {
22
- var _b, _c;
23
- 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;
21
+ var item = _a.item, loading = _a.loading, isSmall = _a.isSmall, fallBackImage = _a.fallBackImage, imageAutoHeight = _a.imageAutoHeight, smallSkeleton = _a.smallSkeleton, children = _a.children, _b = _a.alignment, alignment = _b === void 0 ? exports.EListItemAlignment.CENTER : _b, usedInSearch = _a.usedInSearch;
24
22
  return (React__default["default"].createElement(ListItem_styles.ListItemContainer, null,
25
23
  React__default["default"].createElement(ListItem_styles.ListLeft, { usedInSearch: usedInSearch, alignment: alignment },
26
24
  React__default["default"].createElement(ListItem_styles.ListImageContainer, { isSmall: isSmall },
@@ -35,9 +33,9 @@ var ListItem = function (_a) {
35
33
  }
36
34
  } })),
37
35
  React__default["default"].createElement(ListItem_styles.ItemInformationContainer, { usedInSearch: usedInSearch, alignment: alignment },
38
- 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 ? typography.TextTypes.TextSize.EXTRASMALL : typography.TextTypes.TextSize.REGULAR }, (item === null || item === void 0 ? void 0 : item.name) || React__default["default"].createElement(Skeleton__default["default"], { width: smallSkeleton ? 150 : 250 })),
39
- loading ? (React__default["default"].createElement(typography.BodyText, { size: typography.TextTypes.TextSize.SMALL },
40
- 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,
36
+ loading ? (React__default["default"].createElement(React__default["default"].Fragment, null,
37
+ React__default["default"].createElement(Skeleton__default["default"], { height: 15, width: smallSkeleton ? 150 : 250 }),
38
+ React__default["default"].createElement(Skeleton__default["default"], { height: 12, width: smallSkeleton ? 100 : 200 }))) : (React__default["default"].createElement(ProductHeader.ProductHeader, { location: ProductHeader.EProductHeader.LIST_ITEM, title: item === null || item === void 0 ? void 0 : item.name, subTitle: item === null || item === void 0 ? void 0 : item.description })),
41
39
  (item === null || item === void 0 ? void 0 : item.secondaryDescription) && item.secondaryDescription)),
42
40
  children && (React__default["default"].createElement(ListItem_styles.ListRight, { alignment: alignment }, children))));
43
41
  };
package/build/cjs/components/src/components/ListItem/ListItem.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/cjs/components/src/components/PriceTag/PriceTag.types.js CHANGED
@@ -12,7 +12,7 @@ exports.EPriceVariant = void 0;
12
12
  (function (EPriceVariant) {
13
13
  EPriceVariant["CAMPAIGN"] = "Kampanj";
14
14
  EPriceVariant["KLIPP"] = "Klipp!";
15
- EPriceVariant["PRIO"] = "Prio-pris";
15
+ EPriceVariant["PRIO"] = "PRIO-pris";
16
16
  EPriceVariant["REGULAR"] = "Ordinarie";
17
17
  })(exports.EPriceVariant || (exports.EPriceVariant = {}));
18
18
  //# sourceMappingURL=PriceTag.types.js.map
package/build/cjs/components/src/components/ProductHeader/ProductHeader.js ADDED
@@ -0,0 +1,40 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var React = require('react');
6
+ var typography = require('@citygross/typography');
7
+
8
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
9
+
10
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
11
+
12
+ exports.EProductHeader = void 0;
13
+ (function (EProductHeader) {
14
+ EProductHeader["LIST_ITEM"] = "listItem";
15
+ EProductHeader["CARD"] = "card";
16
+ EProductHeader["DETAIL_PAGE"] = "detailPage";
17
+ })(exports.EProductHeader || (exports.EProductHeader = {}));
18
+ var ProductHeader = function (_a) {
19
+ var location = _a.location, title = _a.title, subTitle = _a.subTitle;
20
+ var subTitleUpperCase = subTitle === null || subTitle === void 0 ? void 0 : subTitle.toUpperCase();
21
+ switch (location) {
22
+ case exports.EProductHeader.DETAIL_PAGE:
23
+ return (React__default["default"].createElement(React__default["default"].Fragment, null,
24
+ React__default["default"].createElement(typography.H1, null, title),
25
+ React__default["default"].createElement(typography.BodyText, null, subTitleUpperCase)));
26
+ case exports.EProductHeader.CARD:
27
+ return (React__default["default"].createElement(React__default["default"].Fragment, null,
28
+ React__default["default"].createElement(typography.H3, null, title),
29
+ React__default["default"].createElement(typography.BodyText, { size: typography.TextTypes.TextSize.EXTRASMALL }, subTitleUpperCase)));
30
+ case exports.EProductHeader.LIST_ITEM:
31
+ return (React__default["default"].createElement(React__default["default"].Fragment, null,
32
+ React__default["default"].createElement(typography.BodyText, { fontWeight: "medium", size: typography.TextTypes.TextSize.REGULAR }, title),
33
+ React__default["default"].createElement(typography.BodyText, { size: typography.TextTypes.TextSize.EXTRASMALL }, subTitleUpperCase)));
34
+ default:
35
+ return null;
36
+ }
37
+ };
38
+
39
+ exports.ProductHeader = ProductHeader;
40
+ //# sourceMappingURL=ProductHeader.js.map
package/build/cjs/components/src/components/ProductHeader/ProductHeader.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ProductHeader.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/ListItem/ListItem.js CHANGED
@@ -1,8 +1,7 @@
1
1
  import React from 'react';
2
- import { BodyText, TextTypes } from '@citygross/typography';
3
2
  import Skeleton from 'react-loading-skeleton';
4
3
  import { ListItemContainer, ListLeft, ListImageContainer, ListImage, ItemInformationContainer, ListRight } from './ListItem.styles.js';
5
- import { theme as theme_1 } from '../../../../design-tokens/build/index.js';
4
+ import { ProductHeader, EProductHeader } from '../ProductHeader/ProductHeader.js';
6
5
 
7
6
  var EListItemAlignment;
8
7
  (function (EListItemAlignment) {
@@ -10,8 +9,7 @@ var EListItemAlignment;
10
9
  EListItemAlignment["TOP"] = "flex-start";
11
10
  })(EListItemAlignment || (EListItemAlignment = {}));
12
11
  var ListItem = function (_a) {
13
- var _b, _c;
14
- 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;
12
+ var item = _a.item, loading = _a.loading, isSmall = _a.isSmall, fallBackImage = _a.fallBackImage, imageAutoHeight = _a.imageAutoHeight, smallSkeleton = _a.smallSkeleton, children = _a.children, _b = _a.alignment, alignment = _b === void 0 ? EListItemAlignment.CENTER : _b, usedInSearch = _a.usedInSearch;
15
13
  return (React.createElement(ListItemContainer, null,
16
14
  React.createElement(ListLeft, { usedInSearch: usedInSearch, alignment: alignment },
17
15
  React.createElement(ListImageContainer, { isSmall: isSmall },
@@ -26,9 +24,9 @@ var ListItem = function (_a) {
26
24
  }
27
25
  } })),
28
26
  React.createElement(ItemInformationContainer, { usedInSearch: usedInSearch, alignment: alignment },
29
- React.createElement(BodyText, { fontWeight: boldHeader ? 'semiBold' : 'regular', color: textColor || ((_b = theme_1.palette) === null || _b === void 0 ? void 0 : _b.darkest), size: isSmall ? TextTypes.TextSize.EXTRASMALL : TextTypes.TextSize.REGULAR }, (item === null || item === void 0 ? void 0 : item.name) || React.createElement(Skeleton, { width: smallSkeleton ? 150 : 250 })),
30
- loading ? (React.createElement(BodyText, { size: TextTypes.TextSize.SMALL },
31
- 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,
27
+ loading ? (React.createElement(React.Fragment, null,
28
+ React.createElement(Skeleton, { height: 15, width: smallSkeleton ? 150 : 250 }),
29
+ React.createElement(Skeleton, { height: 12, width: smallSkeleton ? 100 : 200 }))) : (React.createElement(ProductHeader, { location: EProductHeader.LIST_ITEM, title: item === null || item === void 0 ? void 0 : item.name, subTitle: item === null || item === void 0 ? void 0 : item.description })),
32
30
  (item === null || item === void 0 ? void 0 : item.secondaryDescription) && item.secondaryDescription)),
33
31
  children && (React.createElement(ListRight, { alignment: alignment }, children))));
34
32
  };
package/build/es/components/src/components/ListItem/ListItem.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/PriceTag/PriceTag.types.js CHANGED
@@ -8,7 +8,7 @@ var EPriceVariant;
8
8
  (function (EPriceVariant) {
9
9
  EPriceVariant["CAMPAIGN"] = "Kampanj";
10
10
  EPriceVariant["KLIPP"] = "Klipp!";
11
- EPriceVariant["PRIO"] = "Prio-pris";
11
+ EPriceVariant["PRIO"] = "PRIO-pris";
12
12
  EPriceVariant["REGULAR"] = "Ordinarie";
13
13
  })(EPriceVariant || (EPriceVariant = {}));
14
14
 
package/build/es/components/src/components/ProductHeader/ProductHeader.js ADDED
@@ -0,0 +1,32 @@
1
+ import React from 'react';
2
+ import { BodyText, TextTypes, H3, H1 } from '@citygross/typography';
3
+
4
+ var EProductHeader;
5
+ (function (EProductHeader) {
6
+ EProductHeader["LIST_ITEM"] = "listItem";
7
+ EProductHeader["CARD"] = "card";
8
+ EProductHeader["DETAIL_PAGE"] = "detailPage";
9
+ })(EProductHeader || (EProductHeader = {}));
10
+ var ProductHeader = function (_a) {
11
+ var location = _a.location, title = _a.title, subTitle = _a.subTitle;
12
+ var subTitleUpperCase = subTitle === null || subTitle === void 0 ? void 0 : subTitle.toUpperCase();
13
+ switch (location) {
14
+ case EProductHeader.DETAIL_PAGE:
15
+ return (React.createElement(React.Fragment, null,
16
+ React.createElement(H1, null, title),
17
+ React.createElement(BodyText, null, subTitleUpperCase)));
18
+ case EProductHeader.CARD:
19
+ return (React.createElement(React.Fragment, null,
20
+ React.createElement(H3, null, title),
21
+ React.createElement(BodyText, { size: TextTypes.TextSize.EXTRASMALL }, subTitleUpperCase)));
22
+ case EProductHeader.LIST_ITEM:
23
+ return (React.createElement(React.Fragment, null,
24
+ React.createElement(BodyText, { fontWeight: "medium", size: TextTypes.TextSize.REGULAR }, title),
25
+ React.createElement(BodyText, { size: TextTypes.TextSize.EXTRASMALL }, subTitleUpperCase)));
26
+ default:
27
+ return null;
28
+ }
29
+ };
30
+
31
+ export { EProductHeader, ProductHeader };
32
+ //# sourceMappingURL=ProductHeader.js.map
package/build/es/components/src/components/ProductHeader/ProductHeader.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ProductHeader.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.8.63",
3
+ "version": "0.8.65",
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": "73e37ade3fddadacff62154123f8c226fc2098ad"
79
+ "gitHead": "94bd4fc74fef5e3ce2ffdfc8099eee3e9e57f5a5"
80
80
  }