@citygross/components 0.8.53 → 0.8.55

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 (6) hide show
  1. package/build/@types/components/PriceTag/PriceTag.d.ts +2 -0
  2. package/build/cjs/components/src/components/PriceTag/PriceTag.js +4 -4
  3. package/build/cjs/components/src/components/PriceTag/PriceTag.styles.js +4 -4
  4. package/build/es/components/src/components/PriceTag/PriceTag.js +4 -4
  5. package/build/es/components/src/components/PriceTag/PriceTag.styles.js +4 -4
  6. package/package.json +2 -2
package/build/@types/components/PriceTag/PriceTag.d.ts CHANGED
@@ -10,10 +10,12 @@ export declare type TPriceTag = {
10
10
  price: number;
11
11
  priceVariant?: EPriceVariant;
12
12
  unit: string;
13
+ isInSmallContainer?: boolean;
13
14
  };
14
15
  export declare type TSplash = {
15
16
  backgroundColor?: string;
16
17
  badgeStr?: string;
17
18
  fontColor?: string;
19
+ isInSmallContainer?: boolean;
18
20
  };
19
21
  export declare const PriceTag: React.FunctionComponent<TPriceTag>;
package/build/cjs/components/src/components/PriceTag/PriceTag.js CHANGED
@@ -44,12 +44,12 @@ var getSplash = function (priceVariant) {
44
44
  }
45
45
  };
46
46
  var PriceTag = function (_a) {
47
- var _b = _a.multiPrice, multiPrice = _b === void 0 ? 0 : _b, _c = _a.pant, pant = _c === void 0 ? false : _c, price = _a.price, priceVariant = _a.priceVariant, unit = _a.unit;
47
+ var _b = _a.multiPrice, multiPrice = _b === void 0 ? 0 : _b, _c = _a.pant, pant = _c === void 0 ? false : _c, price = _a.price, priceVariant = _a.priceVariant, unit = _a.unit, _d = _a.isInSmallContainer, isInSmallContainer = _d === void 0 ? false : _d;
48
48
  var splash = getSplash(priceVariant);
49
49
  var priceBase = Math.floor(price);
50
50
  var priceDecimals = (price % 1).toFixed(2).split('.')[1];
51
51
  var isMultiPrice = multiPrice > 1;
52
- var showPriceIndicator = isMultiPrice || (priceDecimals === '00' && unit === 'st');
52
+ var showPriceIndicator = priceDecimals === '00' && unit === 'st';
53
53
  var multiPriceStr = multiPrice + ' för';
54
54
  var priceIndicator = ':-';
55
55
  var pantStr = '+pant';
@@ -66,8 +66,8 @@ var PriceTag = function (_a) {
66
66
  React__default["default"].createElement(PriceTag_styles.PriceIndicator, { pant: pant }, priceIndicator),
67
67
  pant && React__default["default"].createElement(PriceTag_styles.Pant, null, pantStr))) : (React__default["default"].createElement(PriceTag_styles.PriceDetails, null,
68
68
  React__default["default"].createElement(PriceTag_styles.PriceDecimals, null, priceDecimals),
69
- React__default["default"].createElement(PriceTag_styles.PriceUnit, null, pant ? pantStr : "/".concat(unit))))))),
70
- splash.badgeStr && (React__default["default"].createElement(PriceTag_styles.PriceVariantBadge, { backgroundColor: splash.backgroundColor }, splash.badgeStr)))));
69
+ React__default["default"].createElement(PriceTag_styles.PriceUnit, null, pant ? pantStr : isMultiPrice ? '' : "/".concat(unit))))))),
70
+ splash.badgeStr && (React__default["default"].createElement(PriceTag_styles.PriceVariantBadge, { backgroundColor: splash.backgroundColor, isInSmallContainer: isInSmallContainer }, splash.badgeStr)))));
71
71
  };
72
72
 
73
73
  exports.PriceTag = PriceTag;
package/build/cjs/components/src/components/PriceTag/PriceTag.styles.js CHANGED
@@ -12,18 +12,18 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
12
12
  var PriceTagComponent = styled__default["default"].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n padding-top: ", "px;\n"], ["\n padding-top: ", "px;\n"])), function (props) { var _a; return (props.badgeStr ? (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm2 : 0); });
13
13
  var PriceTagWrapper = styled__default["default"].div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n color: ", ";\n display: grid;\n font-family: ", ";\n height: fit-content;\n width: fit-content;\n position: relative;\n"], ["\n color: ", ";\n display: grid;\n font-family: ", ";\n height: fit-content;\n width: fit-content;\n position: relative;\n"])), function (props) { return props.fontColor; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.type.display; });
14
14
  var PriceSplashContainer = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n grid-area: 1 / 1 / 1 / 1;\n position: absolute;\n bottom: 0;\n top: 0;\n right: 0;\n left: 0;\n\n svg {\n width: 100%;\n height: 100%;\n }\n"], ["\n grid-area: 1 / 1 / 1 / 1;\n position: absolute;\n bottom: 0;\n top: 0;\n right: 0;\n left: 0;\n\n svg {\n width: 100%;\n height: 100%;\n }\n"])));
15
- var PriceTagContainer = styled__default["default"].div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n grid-area: 1 / 1 / 1 / 1;\n padding: 0 ", "px\n ", "px\n ", "px;\n position: relative;\n z-index: 1;\n"], ["\n grid-area: 1 / 1 / 1 / 1;\n padding: 0 ", "px\n ", "px\n ", "px;\n position: relative;\n z-index: 1;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
15
+ var PriceTagContainer = styled__default["default"].div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n grid-area: 1 / 1 / 1 / 1;\n padding: 0 ", "px\n ", "px\n ", "px;\n position: relative;\n z-index: 1;\n"], ["\n grid-area: 1 / 1 / 1 / 1;\n padding: 0 ", "px\n ", "px\n ", "px;\n position: relative;\n z-index: 1;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
16
16
  var PriceTagContent = styled__default["default"].div(templateObject_5 || (templateObject_5 = _tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n padding: ", "px;\n"], ["\n display: flex;\n flex-direction: column;\n padding: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
17
- var MultiPriceContainer = styled__default["default"].div(templateObject_6 || (templateObject_6 = _tslib.__makeTemplateObject(["\n font-size: ", "px;\n margin-bottom: -", "px;\n margin-left: ", "px;\n padding-top: ", "px;\n transform: rotate(-", "deg);\n width: fit-content;\n"], ["\n font-size: ", "px;\n margin-bottom: -", "px;\n margin-left: ", "px;\n padding-top: ", "px;\n transform: rotate(-", "deg);\n width: fit-content;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a, _b; return (props.pant ? (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs2 : (_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xxs2); }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceRotate; });
17
+ var MultiPriceContainer = styled__default["default"].div(templateObject_6 || (templateObject_6 = _tslib.__makeTemplateObject(["\n font-size: ", "px;\n margin-bottom: -", "px;\n margin-left: ", "px;\n padding-top: ", "px;\n transform: rotate(-", "deg);\n width: fit-content;\n"], ["\n font-size: ", "px;\n margin-bottom: -", "px;\n margin-left: ", "px;\n padding-top: ", "px;\n transform: rotate(-", "deg);\n width: fit-content;\n"])), 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.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceRotate; });
18
18
  var PriceTag = styled__default["default"].div(templateObject_7 || (templateObject_7 = _tslib.__makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: ", "px;\n"], ["\n display: flex;\n align-items: center;\n gap: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxxs; });
19
19
  var PriceBase = styled__default["default"].span(templateObject_8 || (templateObject_8 = _tslib.__makeTemplateObject(["\n font-size: ", "px;\n line-height: 1;\n"], ["\n font-size: ", "px;\n line-height: 1;\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.l1; });
20
20
  var PriceDetails = styled__default["default"].div(templateObject_9 || (templateObject_9 = _tslib.__makeTemplateObject(["\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n"], ["\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n"])));
21
21
  var PriceDecimals = styled__default["default"].span(templateObject_10 || (templateObject_10 = _tslib.__makeTemplateObject(["\n font-size: ", "px;\n margin-top: ", "px;\n"], ["\n font-size: ", "px;\n margin-top: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s4; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxxs; });
22
- var PriceUnit = styled__default["default"].span(templateObject_11 || (templateObject_11 = _tslib.__makeTemplateObject(["\n font-size: ", "px;\n"], ["\n font-size: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; });
22
+ var PriceUnit = styled__default["default"].span(templateObject_11 || (templateObject_11 = _tslib.__makeTemplateObject(["\n font-size: ", "px;\n margin-top: ", "px;\n"], ["\n font-size: ", "px;\n margin-top: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxxs; });
23
23
  var PriceIndicatorContainer = styled__default["default"].div(templateObject_12 || (templateObject_12 = _tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
24
24
  var PriceIndicator = styled__default["default"].span(templateObject_13 || (templateObject_13 = _tslib.__makeTemplateObject(["\n font-size: ", "px;\n margin-top: -", "px;\n transform: rotate(", "deg);\n"], ["\n font-size: ", "px;\n margin-top: -", "px;\n transform: rotate(", "deg);\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.l1; }, function (props) { return (props.pant ? 0 : function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }); }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceIndicatorRotate; });
25
25
  var Pant = styled__default["default"].span(templateObject_14 || (templateObject_14 = _tslib.__makeTemplateObject(["\n font-size: ", "px;\n margin-top: -", "px;\n"], ["\n font-size: ", "px;\n margin-top: -", "px;\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
26
- var PriceVariantBadge = styled__default["default"].div(templateObject_15 || (templateObject_15 = _tslib.__makeTemplateObject(["\n background-color: ", ";\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n height: ", "px;\n width: ", "px;\n position: absolute;\n right: -", "px;\n top: -", "px;\n"], ["\n background-color: ", ";\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n height: ", "px;\n width: ", "px;\n position: absolute;\n right: -", "px;\n top: -", "px;\n"])), function (props) { return props.backgroundColor; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceVariantBadgeSize; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceVariantBadgeSize; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; });
26
+ var PriceVariantBadge = styled__default["default"].div(templateObject_15 || (templateObject_15 = _tslib.__makeTemplateObject(["\n background-color: ", ";\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n height: ", "px;\n width: ", "px;\n position: absolute;\n right: -", "px;\n top: -", "px;\n"], ["\n background-color: ", ";\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n height: ", "px;\n width: ", "px;\n position: absolute;\n right: -", "px;\n top: -", "px;\n"])), function (props) { return props.backgroundColor; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceVariantBadgeSize; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceVariantBadgeSize; }, function (props) { var _a, _b; return (props.isInSmallContainer ? (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs2 : (_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.md); }, function (props) { var _a, _b; return (props.isInSmallContainer ? (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xl : (_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.lg); });
27
27
  var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15;
28
28
 
29
29
  exports.MultiPriceContainer = MultiPriceContainer;
package/build/es/components/src/components/PriceTag/PriceTag.js CHANGED
@@ -36,12 +36,12 @@ var getSplash = function (priceVariant) {
36
36
  }
37
37
  };
38
38
  var PriceTag = function (_a) {
39
- var _b = _a.multiPrice, multiPrice = _b === void 0 ? 0 : _b, _c = _a.pant, pant = _c === void 0 ? false : _c, price = _a.price, priceVariant = _a.priceVariant, unit = _a.unit;
39
+ var _b = _a.multiPrice, multiPrice = _b === void 0 ? 0 : _b, _c = _a.pant, pant = _c === void 0 ? false : _c, price = _a.price, priceVariant = _a.priceVariant, unit = _a.unit, _d = _a.isInSmallContainer, isInSmallContainer = _d === void 0 ? false : _d;
40
40
  var splash = getSplash(priceVariant);
41
41
  var priceBase = Math.floor(price);
42
42
  var priceDecimals = (price % 1).toFixed(2).split('.')[1];
43
43
  var isMultiPrice = multiPrice > 1;
44
- var showPriceIndicator = isMultiPrice || (priceDecimals === '00' && unit === 'st');
44
+ var showPriceIndicator = priceDecimals === '00' && unit === 'st';
45
45
  var multiPriceStr = multiPrice + ' för';
46
46
  var priceIndicator = ':-';
47
47
  var pantStr = '+pant';
@@ -58,8 +58,8 @@ var PriceTag = function (_a) {
58
58
  React.createElement(PriceIndicator, { pant: pant }, priceIndicator),
59
59
  pant && React.createElement(Pant, null, pantStr))) : (React.createElement(PriceDetails, null,
60
60
  React.createElement(PriceDecimals, null, priceDecimals),
61
- React.createElement(PriceUnit, null, pant ? pantStr : "/".concat(unit))))))),
62
- splash.badgeStr && (React.createElement(PriceVariantBadge, { backgroundColor: splash.backgroundColor }, splash.badgeStr)))));
61
+ React.createElement(PriceUnit, null, pant ? pantStr : isMultiPrice ? '' : "/".concat(unit))))))),
62
+ splash.badgeStr && (React.createElement(PriceVariantBadge, { backgroundColor: splash.backgroundColor, isInSmallContainer: isInSmallContainer }, splash.badgeStr)))));
63
63
  };
64
64
 
65
65
  export { EPriceVariant, PriceTag };
package/build/es/components/src/components/PriceTag/PriceTag.styles.js CHANGED
@@ -4,18 +4,18 @@ import styled from 'styled-components';
4
4
  var PriceTagComponent = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n padding-top: ", "px;\n"], ["\n padding-top: ", "px;\n"])), function (props) { var _a; return (props.badgeStr ? (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm2 : 0); });
5
5
  var PriceTagWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n color: ", ";\n display: grid;\n font-family: ", ";\n height: fit-content;\n width: fit-content;\n position: relative;\n"], ["\n color: ", ";\n display: grid;\n font-family: ", ";\n height: fit-content;\n width: fit-content;\n position: relative;\n"])), function (props) { return props.fontColor; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.type.display; });
6
6
  var PriceSplashContainer = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n grid-area: 1 / 1 / 1 / 1;\n position: absolute;\n bottom: 0;\n top: 0;\n right: 0;\n left: 0;\n\n svg {\n width: 100%;\n height: 100%;\n }\n"], ["\n grid-area: 1 / 1 / 1 / 1;\n position: absolute;\n bottom: 0;\n top: 0;\n right: 0;\n left: 0;\n\n svg {\n width: 100%;\n height: 100%;\n }\n"])));
7
- var PriceTagContainer = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n grid-area: 1 / 1 / 1 / 1;\n padding: 0 ", "px\n ", "px\n ", "px;\n position: relative;\n z-index: 1;\n"], ["\n grid-area: 1 / 1 / 1 / 1;\n padding: 0 ", "px\n ", "px\n ", "px;\n position: relative;\n z-index: 1;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
7
+ var PriceTagContainer = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n grid-area: 1 / 1 / 1 / 1;\n padding: 0 ", "px\n ", "px\n ", "px;\n position: relative;\n z-index: 1;\n"], ["\n grid-area: 1 / 1 / 1 / 1;\n padding: 0 ", "px\n ", "px\n ", "px;\n position: relative;\n z-index: 1;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
8
8
  var PriceTagContent = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n padding: ", "px;\n"], ["\n display: flex;\n flex-direction: column;\n padding: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
9
- var MultiPriceContainer = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n font-size: ", "px;\n margin-bottom: -", "px;\n margin-left: ", "px;\n padding-top: ", "px;\n transform: rotate(-", "deg);\n width: fit-content;\n"], ["\n font-size: ", "px;\n margin-bottom: -", "px;\n margin-left: ", "px;\n padding-top: ", "px;\n transform: rotate(-", "deg);\n width: fit-content;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a, _b; return (props.pant ? (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs2 : (_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xxs2); }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceRotate; });
9
+ var MultiPriceContainer = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n font-size: ", "px;\n margin-bottom: -", "px;\n margin-left: ", "px;\n padding-top: ", "px;\n transform: rotate(-", "deg);\n width: fit-content;\n"], ["\n font-size: ", "px;\n margin-bottom: -", "px;\n margin-left: ", "px;\n padding-top: ", "px;\n transform: rotate(-", "deg);\n width: fit-content;\n"])), 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.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceRotate; });
10
10
  var PriceTag = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: ", "px;\n"], ["\n display: flex;\n align-items: center;\n gap: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxxs; });
11
11
  var PriceBase = styled.span(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n font-size: ", "px;\n line-height: 1;\n"], ["\n font-size: ", "px;\n line-height: 1;\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.l1; });
12
12
  var PriceDetails = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n"], ["\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n"])));
13
13
  var PriceDecimals = styled.span(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n font-size: ", "px;\n margin-top: ", "px;\n"], ["\n font-size: ", "px;\n margin-top: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s4; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxxs; });
14
- var PriceUnit = styled.span(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n font-size: ", "px;\n"], ["\n font-size: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; });
14
+ var PriceUnit = styled.span(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n font-size: ", "px;\n margin-top: ", "px;\n"], ["\n font-size: ", "px;\n margin-top: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxxs; });
15
15
  var PriceIndicatorContainer = styled.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
16
16
  var PriceIndicator = styled.span(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n font-size: ", "px;\n margin-top: -", "px;\n transform: rotate(", "deg);\n"], ["\n font-size: ", "px;\n margin-top: -", "px;\n transform: rotate(", "deg);\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.l1; }, function (props) { return (props.pant ? 0 : function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs2; }); }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceIndicatorRotate; });
17
17
  var Pant = styled.span(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n font-size: ", "px;\n margin-top: -", "px;\n"], ["\n font-size: ", "px;\n margin-top: -", "px;\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
18
- var PriceVariantBadge = styled.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n height: ", "px;\n width: ", "px;\n position: absolute;\n right: -", "px;\n top: -", "px;\n"], ["\n background-color: ", ";\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n height: ", "px;\n width: ", "px;\n position: absolute;\n right: -", "px;\n top: -", "px;\n"])), function (props) { return props.backgroundColor; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceVariantBadgeSize; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceVariantBadgeSize; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; });
18
+ var PriceVariantBadge = styled.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n height: ", "px;\n width: ", "px;\n position: absolute;\n right: -", "px;\n top: -", "px;\n"], ["\n background-color: ", ";\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n height: ", "px;\n width: ", "px;\n position: absolute;\n right: -", "px;\n top: -", "px;\n"])), function (props) { return props.backgroundColor; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceVariantBadgeSize; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceVariantBadgeSize; }, function (props) { var _a, _b; return (props.isInSmallContainer ? (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs2 : (_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.md); }, function (props) { var _a, _b; return (props.isInSmallContainer ? (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xl : (_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.lg); });
19
19
  var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15;
20
20
 
21
21
  export { MultiPriceContainer, Pant, PriceBase, PriceDecimals, PriceDetails, PriceIndicator, PriceIndicatorContainer, PriceSplashContainer, PriceTag, PriceTagComponent, PriceTagContainer, PriceTagContent, PriceTagWrapper, PriceUnit, PriceVariantBadge };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.8.53",
3
+ "version": "0.8.55",
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": "37a80c1cd8b8b73ba9e71c77300f7b3126f35377"
79
+ "gitHead": "4f00d92d67d1aeb12501f0b8ed72017b06f0ce32"
80
80
  }