@citygross/components 0.8.68 → 0.8.69
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.
- package/build/@types/components/{PriceBanner/PriceBanner.d.ts → PriceStripe/PriceStripe.d.ts} +3 -3
- package/build/@types/components/PriceStripe/PriceStripe.styles.d.ts +3 -0
- package/build/@types/components/PriceTag/PriceTag.styles.d.ts +1 -1
- package/build/@types/helpers/price.d.ts +3 -3
- package/build/@types/index.d.ts +1 -1
- package/build/cjs/components/src/components/AddressBlock/AddressBlock.js +1 -1
- package/build/cjs/components/src/components/{PriceBanner/PriceBanner.js → PriceStripe/PriceStripe.js} +7 -7
- package/build/cjs/components/src/components/PriceStripe/PriceStripe.js.map +1 -0
- package/build/cjs/components/src/components/{PriceBanner/PriceBanner.styles.js → PriceStripe/PriceStripe.styles.js} +3 -3
- package/build/cjs/components/src/components/PriceStripe/PriceStripe.styles.js.map +1 -0
- package/build/cjs/components/src/components/PriceTag/PriceTag.js +3 -3
- package/build/cjs/components/src/components/PriceTag/PriceTag.styles.js +2 -2
- package/build/cjs/components/src/components/WarningLabel/WarningLabel.js +1 -1
- package/build/cjs/components/src/helpers/price.js +4 -4
- package/build/cjs/components/src/index.js +2 -2
- package/build/es/components/src/components/AddressBlock/AddressBlock.js +1 -1
- package/build/es/components/src/components/{PriceBanner/PriceBanner.js → PriceStripe/PriceStripe.js} +8 -8
- package/build/es/components/src/components/PriceStripe/PriceStripe.js.map +1 -0
- package/build/es/components/src/components/{PriceBanner/PriceBanner.styles.js → PriceStripe/PriceStripe.styles.js} +3 -3
- package/build/es/components/src/components/PriceStripe/PriceStripe.styles.js.map +1 -0
- package/build/es/components/src/components/PriceTag/PriceTag.js +4 -4
- package/build/es/components/src/components/PriceTag/PriceTag.styles.js +2 -2
- package/build/es/components/src/components/WarningLabel/WarningLabel.js +1 -1
- package/build/es/components/src/helpers/price.js +4 -4
- package/build/es/components/src/index.js +1 -1
- package/package.json +2 -2
- package/build/@types/components/PriceBanner/PriceBanner.styles.d.ts +0 -3
- package/build/cjs/components/src/components/PriceBanner/PriceBanner.js.map +0 -1
- package/build/cjs/components/src/components/PriceBanner/PriceBanner.styles.js.map +0 -1
- package/build/es/components/src/components/PriceBanner/PriceBanner.js.map +0 -1
- package/build/es/components/src/components/PriceBanner/PriceBanner.styles.js.map +0 -1
package/build/@types/components/{PriceBanner/PriceBanner.d.ts → PriceStripe/PriceStripe.d.ts}
RENAMED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { EPriceSize, EPriceVariant } from '../PriceTag/PriceTag.types';
|
|
3
|
-
export declare type
|
|
3
|
+
export declare type TPriceStripeSizeAttributes = {
|
|
4
4
|
fontSize?: number;
|
|
5
5
|
};
|
|
6
|
-
export declare type
|
|
6
|
+
export declare type TPriceStripe = {
|
|
7
7
|
multiPrice?: number;
|
|
8
8
|
size?: EPriceSize;
|
|
9
9
|
variant?: EPriceVariant;
|
|
10
10
|
};
|
|
11
|
-
export declare const
|
|
11
|
+
export declare const PriceStripe: React.FunctionComponent<TPriceStripe>;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { TPriceStripeSizeAttributes } from './PriceStripe';
|
|
2
|
+
import { TPriceVariantAttributes } from '../PriceTag/PriceTag.types';
|
|
3
|
+
export declare const PriceStripe: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TPriceStripeSizeAttributes & Pick<TPriceVariantAttributes, "backgroundColor" | "fontColor">, never>;
|
|
@@ -9,7 +9,7 @@ declare type TIsSmall = {
|
|
|
9
9
|
};
|
|
10
10
|
declare type TPant = Pick<TPriceTag, 'pant'>;
|
|
11
11
|
export declare const PriceTagWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TFontColor, never>;
|
|
12
|
-
export declare const
|
|
12
|
+
export declare const PriceStripeContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
13
13
|
export declare const PriceTagContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TBackgroundColor, never>;
|
|
14
14
|
export declare const PriceTag: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
15
15
|
export declare const PriceBase: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, TFontSize, never>;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { EPriceSize, EPriceVariant, TPriceTagSizeAttributes, TPriceVariantAttributes } from '../components/PriceTag/PriceTag.types';
|
|
2
|
-
import {
|
|
3
|
-
export declare const
|
|
4
|
-
sizeAttributes:
|
|
2
|
+
import { TPriceStripeSizeAttributes } from '../components/PriceStripe/PriceStripe';
|
|
3
|
+
export declare const getPriceStripeAttributes: (priceSize?: EPriceSize, priceVariant?: EPriceVariant) => {
|
|
4
|
+
sizeAttributes: TPriceStripeSizeAttributes;
|
|
5
5
|
variantAttributes: TPriceVariantAttributes;
|
|
6
6
|
};
|
|
7
7
|
export declare const getPriceTagAttributes: (priceSize?: EPriceSize, priceVariant?: EPriceVariant) => {
|
package/build/@types/index.d.ts
CHANGED
|
@@ -82,7 +82,7 @@ export * from './components/CartCardLabel/CartCardLabel';
|
|
|
82
82
|
export * from './components/CartCard/CartCard';
|
|
83
83
|
export * from './components/PriceTag/PriceTag';
|
|
84
84
|
export * from './components/PriceTag/PriceTag.types';
|
|
85
|
-
export * from './components/
|
|
85
|
+
export * from './components/PriceStripe/PriceStripe';
|
|
86
86
|
export * from './components/Pill/Pill';
|
|
87
87
|
export * from './components/SelectButton/SelectButton';
|
|
88
88
|
export * from './components/ProductHeader/ProductHeader';
|
|
@@ -96,7 +96,7 @@ require('../CouponCode/CouponCode.js');
|
|
|
96
96
|
require('../CartCardLabel/CartCardLabel.styles.js');
|
|
97
97
|
require('../CartCard/CartCard.styles.js');
|
|
98
98
|
require('../PriceTag/PriceTag.types.js');
|
|
99
|
-
require('../
|
|
99
|
+
require('../PriceStripe/PriceStripe.styles.js');
|
|
100
100
|
require('../PriceTag/PriceTag.styles.js');
|
|
101
101
|
require('../Pill/Pill.styles.js');
|
|
102
102
|
require('../SelectButton/SelectButton.styles.js');
|
|
@@ -4,22 +4,22 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var price = require('../../helpers/price.js');
|
|
7
|
-
var
|
|
7
|
+
var PriceStripe_styles = require('./PriceStripe.styles.js');
|
|
8
8
|
var PriceTag_types = require('../PriceTag/PriceTag.types.js');
|
|
9
9
|
|
|
10
10
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
11
11
|
|
|
12
12
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
13
13
|
|
|
14
|
-
var
|
|
14
|
+
var PriceStripe = function (_a) {
|
|
15
15
|
var multiPrice = _a.multiPrice, _b = _a.size, size = _b === void 0 ? PriceTag_types.EPriceSize.MEDIUM : _b, variant = _a.variant;
|
|
16
|
-
var _c = price.
|
|
16
|
+
var _c = price.getPriceStripeAttributes(size, variant), sizeAttributes = _c.sizeAttributes, variantAttributes = _c.variantAttributes;
|
|
17
17
|
var isMultiPrice = multiPrice && multiPrice > 1;
|
|
18
|
-
var
|
|
18
|
+
var stripeText = isMultiPrice
|
|
19
19
|
? "".concat(variant === PriceTag_types.EPriceVariant.KLIPP ? variant + ' ' : '').concat(multiPrice, " f\u00F6r")
|
|
20
20
|
: variant;
|
|
21
|
-
return (React__default["default"].createElement(
|
|
21
|
+
return (React__default["default"].createElement(PriceStripe_styles.PriceStripe, { backgroundColor: variantAttributes.backgroundColor, fontColor: variantAttributes.fontColor, fontSize: sizeAttributes.fontSize }, stripeText));
|
|
22
22
|
};
|
|
23
23
|
|
|
24
|
-
exports.
|
|
25
|
-
//# sourceMappingURL=
|
|
24
|
+
exports.PriceStripe = PriceStripe;
|
|
25
|
+
//# sourceMappingURL=PriceStripe.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PriceStripe.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -9,7 +9,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
9
9
|
|
|
10
10
|
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
11
11
|
|
|
12
|
-
var
|
|
12
|
+
var PriceStripe = styled__default["default"].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n font-family: ", ";\n font-size: ", "px;\n font-weight: ", ";\n padding: 0 ", "px;\n width: fit-content;\n"], ["\n background-color: ", ";\n color: ", ";\n font-family: ", ";\n font-size: ", "px;\n font-weight: ", ";\n padding: 0 ", "px;\n width: fit-content;\n"])), function (_a) {
|
|
13
13
|
var backgroundColor = _a.backgroundColor;
|
|
14
14
|
return backgroundColor;
|
|
15
15
|
}, function (_a) {
|
|
@@ -33,5 +33,5 @@ var PriceBanner = styled__default["default"].div(templateObject_1 || (templateOb
|
|
|
33
33
|
});
|
|
34
34
|
var templateObject_1;
|
|
35
35
|
|
|
36
|
-
exports.
|
|
37
|
-
//# sourceMappingURL=
|
|
36
|
+
exports.PriceStripe = PriceStripe;
|
|
37
|
+
//# sourceMappingURL=PriceStripe.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PriceStripe.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var icons = require('@citygross/icons');
|
|
7
7
|
var price = require('../../helpers/price.js');
|
|
8
|
-
var
|
|
8
|
+
var PriceStripe = require('../PriceStripe/PriceStripe.js');
|
|
9
9
|
var PriceTag_styles = require('./PriceTag.styles.js');
|
|
10
10
|
var PriceTag_types = require('./PriceTag.types.js');
|
|
11
11
|
|
|
@@ -23,8 +23,8 @@ var PriceTag = function (_a) {
|
|
|
23
23
|
var showPriceIndicator = priceDecimals === '00';
|
|
24
24
|
var showUnit = pant || !(isMultiPrice && unit === 'st');
|
|
25
25
|
return (React__default["default"].createElement(PriceTag_styles.PriceTagWrapper, { fontColor: variantAttributes.fontColor },
|
|
26
|
-
variant !== PriceTag_types.EPriceVariant.REGULAR && (React__default["default"].createElement(PriceTag_styles.
|
|
27
|
-
React__default["default"].createElement(
|
|
26
|
+
variant !== PriceTag_types.EPriceVariant.REGULAR && (React__default["default"].createElement(PriceTag_styles.PriceStripeContainer, null,
|
|
27
|
+
React__default["default"].createElement(PriceStripe.PriceStripe, { multiPrice: multiPrice, size: size, variant: variant }))),
|
|
28
28
|
React__default["default"].createElement(PriceTag_styles.PriceTagContainer, { backgroundColor: variantAttributes.backgroundColor },
|
|
29
29
|
React__default["default"].createElement(PriceTag_styles.PriceTag, null,
|
|
30
30
|
React__default["default"].createElement(PriceTag_styles.PriceBase, { fontSize: sizeAttributes.baseFontSize }, priceBase),
|
|
@@ -21,7 +21,7 @@ var PriceTagWrapper = styled__default["default"].div(templateObject_1 || (templa
|
|
|
21
21
|
var theme = _a.theme;
|
|
22
22
|
return (_b = theme.typography) === null || _b === void 0 ? void 0 : _b.weight.bold;
|
|
23
23
|
});
|
|
24
|
-
var
|
|
24
|
+
var PriceStripeContainer = styled__default["default"].div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n margin-bottom: 1px;\n transform: rotate(-", "deg);\n"], ["\n margin-bottom: 1px;\n transform: rotate(-", "deg);\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceRotate; });
|
|
25
25
|
var PriceTagContainer = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n background-color: ", ";\n padding: ", "px\n ", "px;\n position: relative;\n"], ["\n background-color: ", ";\n padding: ", "px\n ", "px;\n position: relative;\n"])), function (_a) {
|
|
26
26
|
var backgroundColor = _a.backgroundColor;
|
|
27
27
|
return backgroundColor;
|
|
@@ -70,11 +70,11 @@ var PriceUnit = styled__default["default"].span(templateObject_9 || (templateObj
|
|
|
70
70
|
});
|
|
71
71
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
|
|
72
72
|
|
|
73
|
-
exports.PriceBannerContainer = PriceBannerContainer;
|
|
74
73
|
exports.PriceBase = PriceBase;
|
|
75
74
|
exports.PriceDecimals = PriceDecimals;
|
|
76
75
|
exports.PriceDetails = PriceDetails;
|
|
77
76
|
exports.PriceIndicatorContainer = PriceIndicatorContainer;
|
|
77
|
+
exports.PriceStripeContainer = PriceStripeContainer;
|
|
78
78
|
exports.PriceTag = PriceTag;
|
|
79
79
|
exports.PriceTagContainer = PriceTagContainer;
|
|
80
80
|
exports.PriceTagWrapper = PriceTagWrapper;
|
|
@@ -96,7 +96,7 @@ require('../CouponCode/CouponCode.js');
|
|
|
96
96
|
require('../CartCardLabel/CartCardLabel.styles.js');
|
|
97
97
|
require('../CartCard/CartCard.styles.js');
|
|
98
98
|
require('../PriceTag/PriceTag.types.js');
|
|
99
|
-
require('../
|
|
99
|
+
require('../PriceStripe/PriceStripe.styles.js');
|
|
100
100
|
require('../PriceTag/PriceTag.styles.js');
|
|
101
101
|
require('../Pill/Pill.styles.js');
|
|
102
102
|
require('../SelectButton/SelectButton.styles.js');
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var designTokens = require('@citygross/design-tokens');
|
|
6
6
|
var PriceTag_types = require('../components/PriceTag/PriceTag.types.js');
|
|
7
7
|
|
|
8
|
-
var
|
|
8
|
+
var getPriceStripeSizeAttributes = function (size) {
|
|
9
9
|
switch (size) {
|
|
10
10
|
case PriceTag_types.EPriceSize.LARGE:
|
|
11
11
|
return {
|
|
@@ -86,8 +86,8 @@ var getPriceVariantAttributes = function (priceVariant) {
|
|
|
86
86
|
};
|
|
87
87
|
}
|
|
88
88
|
};
|
|
89
|
-
var
|
|
90
|
-
sizeAttributes:
|
|
89
|
+
var getPriceStripeAttributes = function (priceSize, priceVariant) { return ({
|
|
90
|
+
sizeAttributes: getPriceStripeSizeAttributes(priceSize),
|
|
91
91
|
variantAttributes: getPriceVariantAttributes(priceVariant)
|
|
92
92
|
}); };
|
|
93
93
|
var getPriceTagAttributes = function (priceSize, priceVariant) { return ({
|
|
@@ -95,6 +95,6 @@ var getPriceTagAttributes = function (priceSize, priceVariant) { return ({
|
|
|
95
95
|
variantAttributes: getPriceVariantAttributes(priceVariant)
|
|
96
96
|
}); };
|
|
97
97
|
|
|
98
|
-
exports.
|
|
98
|
+
exports.getPriceStripeAttributes = getPriceStripeAttributes;
|
|
99
99
|
exports.getPriceTagAttributes = getPriceTagAttributes;
|
|
100
100
|
//# sourceMappingURL=price.js.map
|
|
@@ -88,7 +88,7 @@ var CartCardLabel = require('./components/CartCardLabel/CartCardLabel.js');
|
|
|
88
88
|
var CartCard = require('./components/CartCard/CartCard.js');
|
|
89
89
|
var PriceTag = require('./components/PriceTag/PriceTag.js');
|
|
90
90
|
var PriceTag_types = require('./components/PriceTag/PriceTag.types.js');
|
|
91
|
-
var
|
|
91
|
+
var PriceStripe = require('./components/PriceStripe/PriceStripe.js');
|
|
92
92
|
var Pill = require('./components/Pill/Pill.js');
|
|
93
93
|
var SelectButton = require('./components/SelectButton/SelectButton.js');
|
|
94
94
|
var ProductHeader = require('./components/ProductHeader/ProductHeader.js');
|
|
@@ -243,7 +243,7 @@ Object.defineProperty(exports, 'EPriceVariant', {
|
|
|
243
243
|
enumerable: true,
|
|
244
244
|
get: function () { return PriceTag_types.EPriceVariant; }
|
|
245
245
|
});
|
|
246
|
-
exports.
|
|
246
|
+
exports.PriceStripe = PriceStripe.PriceStripe;
|
|
247
247
|
exports.Pill = Pill.Pill;
|
|
248
248
|
exports.SelectButton = SelectButton.SelectButton;
|
|
249
249
|
Object.defineProperty(exports, 'EProductHeader', {
|
|
@@ -92,7 +92,7 @@ import '../CouponCode/CouponCode.js';
|
|
|
92
92
|
import '../CartCardLabel/CartCardLabel.styles.js';
|
|
93
93
|
import '../CartCard/CartCard.styles.js';
|
|
94
94
|
import '../PriceTag/PriceTag.types.js';
|
|
95
|
-
import '../
|
|
95
|
+
import '../PriceStripe/PriceStripe.styles.js';
|
|
96
96
|
import '../PriceTag/PriceTag.styles.js';
|
|
97
97
|
import '../Pill/Pill.styles.js';
|
|
98
98
|
import '../SelectButton/SelectButton.styles.js';
|
package/build/es/components/src/components/{PriceBanner/PriceBanner.js → PriceStripe/PriceStripe.js}
RENAMED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { getPriceStripeAttributes } from '../../helpers/price.js';
|
|
3
|
+
import { PriceStripe as PriceStripe$1 } from './PriceStripe.styles.js';
|
|
4
4
|
import { EPriceSize, EPriceVariant } from '../PriceTag/PriceTag.types.js';
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var PriceStripe = function (_a) {
|
|
7
7
|
var multiPrice = _a.multiPrice, _b = _a.size, size = _b === void 0 ? EPriceSize.MEDIUM : _b, variant = _a.variant;
|
|
8
|
-
var _c =
|
|
8
|
+
var _c = getPriceStripeAttributes(size, variant), sizeAttributes = _c.sizeAttributes, variantAttributes = _c.variantAttributes;
|
|
9
9
|
var isMultiPrice = multiPrice && multiPrice > 1;
|
|
10
|
-
var
|
|
10
|
+
var stripeText = isMultiPrice
|
|
11
11
|
? "".concat(variant === EPriceVariant.KLIPP ? variant + ' ' : '').concat(multiPrice, " f\u00F6r")
|
|
12
12
|
: variant;
|
|
13
|
-
return (React.createElement(
|
|
13
|
+
return (React.createElement(PriceStripe$1, { backgroundColor: variantAttributes.backgroundColor, fontColor: variantAttributes.fontColor, fontSize: sizeAttributes.fontSize }, stripeText));
|
|
14
14
|
};
|
|
15
15
|
|
|
16
|
-
export {
|
|
17
|
-
//# sourceMappingURL=
|
|
16
|
+
export { PriceStripe };
|
|
17
|
+
//# sourceMappingURL=PriceStripe.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PriceStripe.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
|
|
2
2
|
import styled from 'styled-components';
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var PriceStripe = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n font-family: ", ";\n font-size: ", "px;\n font-weight: ", ";\n padding: 0 ", "px;\n width: fit-content;\n"], ["\n background-color: ", ";\n color: ", ";\n font-family: ", ";\n font-size: ", "px;\n font-weight: ", ";\n padding: 0 ", "px;\n width: fit-content;\n"])), function (_a) {
|
|
5
5
|
var backgroundColor = _a.backgroundColor;
|
|
6
6
|
return backgroundColor;
|
|
7
7
|
}, function (_a) {
|
|
@@ -25,5 +25,5 @@ var PriceBanner = styled.div(templateObject_1 || (templateObject_1 = __makeTempl
|
|
|
25
25
|
});
|
|
26
26
|
var templateObject_1;
|
|
27
27
|
|
|
28
|
-
export {
|
|
29
|
-
//# sourceMappingURL=
|
|
28
|
+
export { PriceStripe };
|
|
29
|
+
//# sourceMappingURL=PriceStripe.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PriceStripe.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Icons } from '@citygross/icons';
|
|
3
3
|
import { getPriceTagAttributes } from '../../helpers/price.js';
|
|
4
|
-
import {
|
|
5
|
-
import { PriceTagWrapper,
|
|
4
|
+
import { PriceStripe } from '../PriceStripe/PriceStripe.js';
|
|
5
|
+
import { PriceTagWrapper, PriceStripeContainer, PriceTagContainer, PriceTag as PriceTag$1, PriceBase, PriceDetails, PriceIndicatorContainer, PriceDecimals, PriceUnit } from './PriceTag.styles.js';
|
|
6
6
|
import { EPriceVariant, EPriceSize } from './PriceTag.types.js';
|
|
7
7
|
|
|
8
8
|
var PriceTag = function (_a) {
|
|
@@ -15,8 +15,8 @@ var PriceTag = function (_a) {
|
|
|
15
15
|
var showPriceIndicator = priceDecimals === '00';
|
|
16
16
|
var showUnit = pant || !(isMultiPrice && unit === 'st');
|
|
17
17
|
return (React.createElement(PriceTagWrapper, { fontColor: variantAttributes.fontColor },
|
|
18
|
-
variant !== EPriceVariant.REGULAR && (React.createElement(
|
|
19
|
-
React.createElement(
|
|
18
|
+
variant !== EPriceVariant.REGULAR && (React.createElement(PriceStripeContainer, null,
|
|
19
|
+
React.createElement(PriceStripe, { multiPrice: multiPrice, size: size, variant: variant }))),
|
|
20
20
|
React.createElement(PriceTagContainer, { backgroundColor: variantAttributes.backgroundColor },
|
|
21
21
|
React.createElement(PriceTag$1, null,
|
|
22
22
|
React.createElement(PriceBase, { fontSize: sizeAttributes.baseFontSize }, priceBase),
|
|
@@ -13,7 +13,7 @@ var PriceTagWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeT
|
|
|
13
13
|
var theme = _a.theme;
|
|
14
14
|
return (_b = theme.typography) === null || _b === void 0 ? void 0 : _b.weight.bold;
|
|
15
15
|
});
|
|
16
|
-
var
|
|
16
|
+
var PriceStripeContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n margin-bottom: 1px;\n transform: rotate(-", "deg);\n"], ["\n margin-bottom: 1px;\n transform: rotate(-", "deg);\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.priceRotate; });
|
|
17
17
|
var PriceTagContainer = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background-color: ", ";\n padding: ", "px\n ", "px;\n position: relative;\n"], ["\n background-color: ", ";\n padding: ", "px\n ", "px;\n position: relative;\n"])), function (_a) {
|
|
18
18
|
var backgroundColor = _a.backgroundColor;
|
|
19
19
|
return backgroundColor;
|
|
@@ -62,5 +62,5 @@ var PriceUnit = styled.span(templateObject_9 || (templateObject_9 = __makeTempla
|
|
|
62
62
|
});
|
|
63
63
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
|
|
64
64
|
|
|
65
|
-
export {
|
|
65
|
+
export { PriceBase, PriceDecimals, PriceDetails, PriceIndicatorContainer, PriceStripeContainer, PriceTag, PriceTagContainer, PriceTagWrapper, PriceUnit };
|
|
66
66
|
//# sourceMappingURL=PriceTag.styles.js.map
|
|
@@ -92,7 +92,7 @@ import '../CouponCode/CouponCode.js';
|
|
|
92
92
|
import '../CartCardLabel/CartCardLabel.styles.js';
|
|
93
93
|
import '../CartCard/CartCard.styles.js';
|
|
94
94
|
import '../PriceTag/PriceTag.types.js';
|
|
95
|
-
import '../
|
|
95
|
+
import '../PriceStripe/PriceStripe.styles.js';
|
|
96
96
|
import '../PriceTag/PriceTag.styles.js';
|
|
97
97
|
import '../Pill/Pill.styles.js';
|
|
98
98
|
import '../SelectButton/SelectButton.styles.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { theme } from '@citygross/design-tokens';
|
|
2
2
|
import { EPriceSize, EPriceVariant } from '../components/PriceTag/PriceTag.types.js';
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var getPriceStripeSizeAttributes = function (size) {
|
|
5
5
|
switch (size) {
|
|
6
6
|
case EPriceSize.LARGE:
|
|
7
7
|
return {
|
|
@@ -82,8 +82,8 @@ var getPriceVariantAttributes = function (priceVariant) {
|
|
|
82
82
|
};
|
|
83
83
|
}
|
|
84
84
|
};
|
|
85
|
-
var
|
|
86
|
-
sizeAttributes:
|
|
85
|
+
var getPriceStripeAttributes = function (priceSize, priceVariant) { return ({
|
|
86
|
+
sizeAttributes: getPriceStripeSizeAttributes(priceSize),
|
|
87
87
|
variantAttributes: getPriceVariantAttributes(priceVariant)
|
|
88
88
|
}); };
|
|
89
89
|
var getPriceTagAttributes = function (priceSize, priceVariant) { return ({
|
|
@@ -91,5 +91,5 @@ var getPriceTagAttributes = function (priceSize, priceVariant) { return ({
|
|
|
91
91
|
variantAttributes: getPriceVariantAttributes(priceVariant)
|
|
92
92
|
}); };
|
|
93
93
|
|
|
94
|
-
export {
|
|
94
|
+
export { getPriceStripeAttributes, getPriceTagAttributes };
|
|
95
95
|
//# sourceMappingURL=price.js.map
|
|
@@ -84,7 +84,7 @@ export { CartCardLabel } from './components/CartCardLabel/CartCardLabel.js';
|
|
|
84
84
|
export { CartCard } from './components/CartCard/CartCard.js';
|
|
85
85
|
export { PriceTag } from './components/PriceTag/PriceTag.js';
|
|
86
86
|
export { EPriceSize, EPriceVariant } from './components/PriceTag/PriceTag.types.js';
|
|
87
|
-
export {
|
|
87
|
+
export { PriceStripe } from './components/PriceStripe/PriceStripe.js';
|
|
88
88
|
export { Pill } from './components/Pill/Pill.js';
|
|
89
89
|
export { SelectButton } from './components/SelectButton/SelectButton.js';
|
|
90
90
|
export { EProductHeader, ProductHeader } from './components/ProductHeader/ProductHeader.js';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@citygross/components",
|
|
3
|
-
"version": "0.8.
|
|
3
|
+
"version": "0.8.69",
|
|
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": "
|
|
79
|
+
"gitHead": "2eb0e40121561dc9d1c8eca24d57692ac3d206a1"
|
|
80
80
|
}
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
import { TPriceBannerSizeAttributes } from './PriceBanner';
|
|
2
|
-
import { TPriceVariantAttributes } from '../PriceTag/PriceTag.types';
|
|
3
|
-
export declare const PriceBanner: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TPriceBannerSizeAttributes & Pick<TPriceVariantAttributes, "backgroundColor" | "fontColor">, never>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PriceBanner.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PriceBanner.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PriceBanner.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PriceBanner.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|