@trafilea/afrodita-components 5.0.0-beta.52 → 5.0.0-beta.53

package/build/index.d.ts

@@ -151,6 +151,8 @@ declare const Edit: ({ height, width, fill }: IconProps) => JSX.Element;
 
 declare const SignOut: ({ height, width, fill }: IconProps) => JSX.Element;
 
+declare const Add: ({ height, width, fill }: IconProps) => JSX.Element;
+
 declare const Actions_Check: typeof Check;
 declare const Actions_ClearLight: typeof ClearLight;
 declare const Actions_LightExclamation: typeof LightExclamation;
@@ -162,6 +164,7 @@ declare const Actions_Trash: typeof Trash;
 declare const Actions_Warning: typeof Warning;
 declare const Actions_Edit: typeof Edit;
 declare const Actions_SignOut: typeof SignOut;
+declare const Actions_Add: typeof Add;
 declare namespace Actions {
   export {
     Actions_Check as Check,
@@ -175,6 +178,7 @@ declare namespace Actions {
     Actions_Warning as Warning,
     Actions_Edit as Edit,
     Actions_SignOut as SignOut,
+    Actions_Add as Add,
   };
 }
 
@@ -642,9 +646,10 @@ interface PriceLabelProps {
     color?: string;
     size?: ComponentSize.Small | ComponentSize.Medium | ComponentSize.Large;
     discount?: DiscountTagProps;
+    finalPriceStyled?: boolean;
     testId?: string;
 }
-declare const PriceLabel: ({ finalPrice, originalPrice, discount, color, testId, size, }: PriceLabelProps) => JSX.Element;
+declare const PriceLabel: ({ finalPrice, originalPrice, discount, color, testId, finalPriceStyled, size, }: PriceLabelProps) => JSX.Element;
 
 interface ColorPickerProps {
     options: ColorPickerOption[];

package/build/index.esm.js

@@ -127,6 +127,11 @@ var SignOut = function (_a) {
     return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 21, viewBoxY: 16, title: "Sign out" }, { children: jsx$1("path", { d: "M16.5939 15.5L13.3949 15.5C13.1435 15.5 12.9379 15.2891 12.9379 15.0313L12.9379 14.0938C12.9379 13.8359 13.1435 13.625 13.3949 13.625L16.5939 13.625C17.6032 13.625 18.422 12.7852 18.422 11.75L18.422 4.25C18.422 3.21484 17.6032 2.375 16.5939 2.375L13.3949 2.375C13.1435 2.375 12.9379 2.16406 12.9379 1.90625L12.9379 0.96875C12.9379 0.710937 13.1435 0.499999 13.3949 0.499999L16.5939 0.499998C18.6124 0.499998 20.25 2.17969 20.25 4.25L20.25 11.75C20.25 13.8203 18.6124 15.5 16.5939 15.5ZM7.7927 14.7383L8.53915 13.9727C8.72195 13.7852 8.71814 13.4844 8.53153 13.3047L4.22422 9.01563L13.6995 9.01563C13.9509 9.01563 14.1565 8.80469 14.1565 8.54688L14.1565 7.45312C14.1565 7.19531 13.9509 6.98437 13.6995 6.98437L4.22422 6.98438L8.53153 2.69922C8.71433 2.51562 8.71814 2.21484 8.53915 2.03125L7.7927 1.26563C7.6137 1.08203 7.32427 1.08203 7.14527 1.26563L0.88425 7.67188C0.705255 7.85547 0.705255 8.15234 0.88425 8.33594L7.14527 14.7422C7.32427 14.9219 7.6137 14.9219 7.7927 14.7383Z", fill: fill }, void 0) }), void 0));
 };
 
+var Add = function (_a) {
+    var height = _a.height, width = _a.width, fill = _a.fill;
+    return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 20, viewBoxY: 20, title: "add" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.75 0C9.05964 0 8.5 0.559644 8.5 1.25V8.5H1.25C0.559644 8.5 0 9.05964 0 9.75C0 10.4404 0.559644 11 1.25 11H8.5V18.75C8.5 19.4404 9.05964 20 9.75 20C10.4404 20 11 19.4404 11 18.75V11H18.75C19.4404 11 20 10.4404 20 9.75C20 9.05964 19.4404 8.5 18.75 8.5H11V1.25C11 0.559644 10.4404 0 9.75 0Z", fill: fill }, void 0) }), void 0));
+};
+
 var Actions = /*#__PURE__*/Object.freeze({
     __proto__: null,
     Check: Check$1,
@@ -138,7 +143,8 @@ var Actions = /*#__PURE__*/Object.freeze({
     Trash: Trash,
     Warning: Warning,
     Edit: Edit,
-    SignOut: SignOut
+    SignOut: SignOut,
+    Add: Add
 });
 
 var FitPredictor$1 = function (_a) {
@@ -4202,7 +4208,7 @@ var TAGS = {
     hero1: newStyled.h1(templateObject_1$16 || (templateObject_1$16 = __makeTemplateObject([""], [""]))),
     hero2: newStyled.h2(templateObject_2$I || (templateObject_2$I = __makeTemplateObject([""], [""]))),
     hero3: newStyled.h3(templateObject_3$v || (templateObject_3$v = __makeTemplateObject([""], [""]))),
-    display1: newStyled.h1(templateObject_4$m || (templateObject_4$m = __makeTemplateObject([""], [""]))),
+    display1: newStyled.h1(templateObject_4$n || (templateObject_4$n = __makeTemplateObject([""], [""]))),
     display2: newStyled.h2(templateObject_5$d || (templateObject_5$d = __makeTemplateObject([""], [""]))),
     heading1: newStyled.h1(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject([""], [""]))),
     heading2: newStyled.h2(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject([""], [""]))),
@@ -4322,7 +4328,7 @@ var DEFAULTS = {
         size: 'regular',
     },
 };
-var templateObject_1$16, templateObject_2$I, templateObject_3$v, templateObject_4$m, templateObject_5$d, templateObject_6$8, templateObject_7$5, templateObject_8$2, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17;
+var templateObject_1$16, templateObject_2$I, templateObject_3$v, templateObject_4$n, templateObject_5$d, templateObject_6$8, templateObject_7$5, templateObject_8$2, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17;
 
 var ButtonsContainer = newStyled.div(templateObject_1$15 || (templateObject_1$15 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  margin: ", ";\n"], ["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  margin: ", ";\n"])), function (_a) {
     var inline = _a.inline;
@@ -4470,31 +4476,41 @@ var getStylesBySize$5 = function (size) {
         case ComponentSize.Large:
             return {
                 fontSize: '1.5rem',
+                finalPricefontSize: '36px',
+                finalPricefontSizeSmall: '18px',
                 margin: '0 0 0 0.75rem',
                 lineHeight: '2rem',
             };
         case ComponentSize.Medium:
             return {
                 fontSize: '1.125rem',
+                finalPricefontSize: '32px',
+                finalPricefontSizeSmall: '16px',
                 margin: '0 0 0 0.5rem',
                 lineHeight: '1.25rem',
             };
         case ComponentSize.Small:
             return {
                 fontSize: '1rem',
+                finalPricefontSize: '24px',
+                finalPricefontSizeSmall: '12px',
                 margin: '0 0 0 0.5rem',
                 lineHeight: '1.25rem',
             };
     }
 };
 var Container$E = newStyled.div(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
-var Price = newStyled.h1(templateObject_2$F || (templateObject_2$F = __makeTemplateObject(["\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  color: ", ";\n  text-decoration: ", ";\n  margin: ", ";\n"], ["\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  color: ", ";\n  text-decoration: ", ";\n  margin: ", ";\n"])), function (_a) {
+var Price = newStyled.h1(templateObject_2$F || (templateObject_2$F = __makeTemplateObject(["\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  color: ", ";\n  text-decoration: ", ";\n  margin: ", ";\n  margin-top: ", ";\n"], ["\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  color: ", ";\n  text-decoration: ", ";\n  margin: ", ";\n  margin-top: ", ";\n"])), function (_a) {
     var weight = _a.weight;
     return (weight ? weight : '400');
 }, function (_a) {
-    var _b;
-    var size = _a.size;
-    return (_b = getStylesBySize$5(size)) === null || _b === void 0 ? void 0 : _b.fontSize;
+    var _b, _c, _d;
+    var size = _a.size, finalPriceStyled = _a.finalPriceStyled, finalPriceStyledSmall = _a.finalPriceStyledSmall;
+    return finalPriceStyled || finalPriceStyledSmall
+        ? finalPriceStyledSmall
+            ? (_b = getStylesBySize$5(size)) === null || _b === void 0 ? void 0 : _b.finalPricefontSizeSmall
+            : (_c = getStylesBySize$5(size)) === null || _c === void 0 ? void 0 : _c.finalPricefontSize
+        : (_d = getStylesBySize$5(size)) === null || _d === void 0 ? void 0 : _d.fontSize;
 }, function (_a) {
     var _b;
     var size = _a.size;
@@ -4509,12 +4525,16 @@ var Price = newStyled.h1(templateObject_2$F || (templateObject_2$F = __makeTempl
     var _b;
     var margin = _a.margin, size = _a.size;
     return (margin ? (_b = getStylesBySize$5(size)) === null || _b === void 0 ? void 0 : _b.margin : '0');
+}, function (_a) {
+    var finalPriceStyledSmall = _a.finalPriceStyledSmall, size = _a.size;
+    return finalPriceStyledSmall ? (size === 'large' ? '-10px' : '-7px') : '0';
 });
 var TagContainer = newStyled.h1(templateObject_3$t || (templateObject_3$t = __makeTemplateObject(["\n  margin: ", ";\n  display: flex;\n  align-items: center;\n"], ["\n  margin: ", ";\n  display: flex;\n  align-items: center;\n"])), function (_a) {
     var _b;
     var size = _a.size;
     return (_b = getStylesBySize$5(size)) === null || _b === void 0 ? void 0 : _b.margin;
 });
+var FinalPriceContainer = newStyled.div(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
 function getTestId() {
     var args = [];
     for (var _i = 0; _i < arguments.length; _i++) {
@@ -4523,11 +4543,21 @@ function getTestId() {
     return args.filter(Boolean).join('-');
 }
 var PriceLabel = function (_a) {
-    var finalPrice = _a.finalPrice, originalPrice = _a.originalPrice, discount = _a.discount, color = _a.color, testId = _a.testId, _b = _a.size, size = _b === void 0 ? ComponentSize.Medium : _b;
+    var finalPrice = _a.finalPrice, originalPrice = _a.originalPrice, discount = _a.discount, color = _a.color, testId = _a.testId, _b = _a.finalPriceStyled, finalPriceStyled = _b === void 0 ? false : _b, _c = _a.size, size = _c === void 0 ? ComponentSize.Medium : _c;
     var theme = useTheme();
-    return (jsxs$1(Container$E, { children: [jsx$1(Price, __assign$1({ size: size, color: color || theme.colors.pallete.secondary.color, weight: 700, "data-testid": getTestId(testId, 'price') }, { children: finalPrice }), void 0), originalPrice && (jsx$1(Price, __assign$1({ size: size, color: theme.colors.shades['300'].color, margin: true, underlined: true, "data-testid": getTestId(testId, 'discount') }, { children: originalPrice }), void 0)), discount && (jsx$1(TagContainer, __assign$1({ size: size }, { children: jsx$1(DiscountTag, __assign$1({}, discount, { size: size }), void 0) }), void 0))] }, void 0));
+    var finalPriceArray = ['', ''];
+    if (typeof finalPrice === 'string' && finalPrice.includes('.') && finalPrice.includes('$'))
+        finalPriceArray = finalPrice.split('$')[1].split('.');
+    var availableFinalPriceStyled = finalPriceStyled && finalPriceArray[0];
+    var priceCommonProps = {
+        size: size,
+        color: color || theme.colors.pallete.secondary.color,
+        weight: 700,
+    };
+    var OriginalPrice = function () { return (jsx$1(Price, __assign$1({ size: size, color: theme.colors.shades['300'].color, margin: true, underlined: true, "data-testid": getTestId(testId, 'discount') }, { children: originalPrice }), void 0)); };
+    return (jsxs$1(Container$E, { children: [availableFinalPriceStyled && originalPrice && jsx$1(OriginalPrice, {}, void 0), availableFinalPriceStyled ? (jsxs$1(FinalPriceContainer, __assign$1({ "data-testid": getTestId(testId, 'price') }, { children: [jsx$1(Price, __assign$1({ margin: true, finalPriceStyledSmall: true }, priceCommonProps, { children: "$" }), void 0), jsx$1(Price, __assign$1({ finalPriceStyled: true }, priceCommonProps, { children: finalPriceArray[0] }), void 0), jsx$1(Price, __assign$1({ finalPriceStyledSmall: true }, priceCommonProps, { children: finalPriceArray[1] }), void 0)] }), void 0)) : (jsxs$1(FinalPriceContainer, { children: [jsx$1(Price, __assign$1({ margin: true, "data-testid": getTestId(testId, 'price') }, priceCommonProps, { children: finalPrice }), void 0), originalPrice && jsx$1(OriginalPrice, {}, void 0)] }, void 0)), discount && (jsx$1(TagContainer, __assign$1({ size: size }, { children: jsx$1(DiscountTag, __assign$1({}, discount, { size: size }), void 0) }), void 0))] }, void 0));
 };
-var templateObject_1$11, templateObject_2$F, templateObject_3$t;
+var templateObject_1$11, templateObject_2$F, templateObject_3$t, templateObject_4$m;
 
 var OneColorSelector = function (_a) {
     var color = _a.color, selected = _a.selected, testId = _a.testId;