@trafilea/afrodita-components 5.0.0-beta.264 → 5.0.0-beta.266
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/index.d.ts +13 -0
- package/build/index.esm.js +6 -6
- package/build/index.js +6 -6
- package/build/theme/revel.theme.d.ts +13 -0
- package/build/theme/revel.theme.js +8 -0
- package/build/theme/shapermint.theme.d.ts +13 -0
- package/build/theme/shapermint.theme.js +10 -2
- package/build/theme/thespadr.theme.d.ts +13 -0
- package/build/theme/thespadr.theme.js +9 -1
- package/build/theme/truekind.theme.d.ts +13 -0
- package/build/theme/truekind.theme.js +33 -10
- package/package.json +1 -1
package/build/index.d.ts
CHANGED
|
@@ -1915,6 +1915,14 @@ declare type ThemeComponent = {
|
|
|
1915
1915
|
divider: {
|
|
1916
1916
|
color: string;
|
|
1917
1917
|
};
|
|
1918
|
+
checkout: {
|
|
1919
|
+
paymentInformation: {
|
|
1920
|
+
borderRadius?: string;
|
|
1921
|
+
};
|
|
1922
|
+
creditCardSection: {
|
|
1923
|
+
borderRadius?: string;
|
|
1924
|
+
};
|
|
1925
|
+
};
|
|
1918
1926
|
upsell: {
|
|
1919
1927
|
banner: {
|
|
1920
1928
|
outlined: {
|
|
@@ -1932,6 +1940,11 @@ declare type ThemeComponent = {
|
|
|
1932
1940
|
};
|
|
1933
1941
|
};
|
|
1934
1942
|
thankyou: {
|
|
1943
|
+
orderBanner?: {
|
|
1944
|
+
text: {
|
|
1945
|
+
left: string;
|
|
1946
|
+
};
|
|
1947
|
+
};
|
|
1935
1948
|
emailSection: {
|
|
1936
1949
|
backgroundColor?: string;
|
|
1937
1950
|
};
|
package/build/index.esm.js
CHANGED
|
@@ -4179,7 +4179,7 @@ var InputValidationType;
|
|
|
4179
4179
|
})(InputValidationType || (InputValidationType = {}));
|
|
4180
4180
|
|
|
4181
4181
|
var Section = newStyled.div(templateObject_1$1D || (templateObject_1$1D = __makeTemplateObject(["\n font-weight: 600;\n display: flex;\n flex-direction: row;\n align-items: center;\n align-text: left;\n width: 100%;\n box-sizing: border-box;\n align-self: flex-start;\n padding: ", ";\n"], ["\n font-weight: 600;\n display: flex;\n flex-direction: row;\n align-items: center;\n align-text: left;\n width: 100%;\n box-sizing: border-box;\n align-self: flex-start;\n padding: ", ";\n"])), function (props) {
|
|
4182
|
-
return props.type === CardSectionType.Header ? '1.
|
|
4182
|
+
return props.type === CardSectionType.Header ? '1.25rem 1.25rem 0' : '0 1.25rem 1.25rem';
|
|
4183
4183
|
});
|
|
4184
4184
|
var CardHeader = function (_a) {
|
|
4185
4185
|
var children = _a.children;
|
|
@@ -13011,14 +13011,14 @@ var Totals = {
|
|
|
13011
13011
|
Subtotal: Subtotal,
|
|
13012
13012
|
};
|
|
13013
13013
|
|
|
13014
|
-
var Container$E = newStyled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n border-radius: 0.313rem;\n display: flex;\n margin-bottom:
|
|
13014
|
+
var Container$E = newStyled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n border-radius: 0.313rem;\n display: flex;\n margin-bottom: 1.25rem;\n"], ["\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n border-radius: 0.313rem;\n display: flex;\n margin-bottom: 1.25rem;\n"])), function (props) { return props.color; });
|
|
13015
13015
|
var IconContainer$3 = newStyled.div(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n width: 1rem;\n height: 0.875rem;\n margin-right: 0.5rem;\n margin-top: 0.125rem;\n"], ["\n width: 1rem;\n height: 0.875rem;\n margin-right: 0.5rem;\n margin-top: 0.125rem;\n"])));
|
|
13016
13016
|
var Text$5 = newStyled.p(templateObject_3$y || (templateObject_3$y = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 400;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 400;\n margin: 0;\n color: ", ";\n"])), function (props) { return props.color; });
|
|
13017
13017
|
var Details = newStyled.span(templateObject_4$p || (templateObject_4$p = __makeTemplateObject(["\n color: ", ";\n font-weight: 700;\n"], ["\n color: ", ";\n font-weight: 700;\n"])), function (props) { return props.color; });
|
|
13018
13018
|
var Note = function (_a) {
|
|
13019
13019
|
var accentColor = _a.accentColor, color = _a.color, backgroundColor = _a.backgroundColor, importantNoteText = _a.importantNoteText, text = _a.text;
|
|
13020
13020
|
var theme = useTheme();
|
|
13021
|
-
return (jsxs$1(Container$E, __assign$1({ color: backgroundColor ? backgroundColor : theme.component.deliveryDetails.note.backgroundColor, "data-testid": "Container" }, { children: [jsx$1(IconContainer$3, { children: jsx$1(Icon.Actions.
|
|
13021
|
+
return (jsxs$1(Container$E, __assign$1({ color: backgroundColor ? backgroundColor : theme.component.deliveryDetails.note.backgroundColor, "data-testid": "Container" }, { children: [jsx$1(IconContainer$3, { children: jsx$1(Icon.Actions.Warning, { fill: accentColor ? accentColor : theme.component.deliveryDetails.note.accentColor }, void 0) }, void 0), jsx$1("div", { children: jsxs$1(Text$5, __assign$1({ color: color ? color : theme.component.deliveryDetails.note.color }, { children: [importantNoteText && (jsxs$1(Details, __assign$1({ color: accentColor ? accentColor : theme.component.deliveryDetails.note.accentColor }, { children: [importantNoteText, ":"] }), void 0)), ' ', text] }), void 0) }, void 0)] }), void 0));
|
|
13022
13022
|
};
|
|
13023
13023
|
var templateObject_1$U, templateObject_2$D, templateObject_3$y, templateObject_4$p;
|
|
13024
13024
|
|
|
@@ -13059,11 +13059,11 @@ var SectionDetails = newStyled.p(templateObject_7$9 || (templateObject_7$9 = __m
|
|
|
13059
13059
|
})
|
|
13060
13060
|
: '';
|
|
13061
13061
|
});
|
|
13062
|
-
var KeepMeUpdated = newStyled.h1(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n border: 0.063rem solid ", ";\n color: #0078ff;\n border-radius: 0.313rem;\n padding: 0.
|
|
13062
|
+
var KeepMeUpdated = newStyled.h1(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n border: 0.063rem solid ", ";\n color: #0078ff;\n border-radius: 0.313rem;\n padding: 0.45rem;\n font-size: 0.875rem;\n line-height: 1.125rem;\n font-weight: 600;\n margin: 0;\n margin-top: 0.625rem;\n display: flex;\n align-items: center;\n background-color: #fff;\n user-select: none;\n\n svg {\n margin-right: 0.375rem;\n }\n\n &:hover {\n cursor: pointer;\n }\n"], ["\n border: 0.063rem solid ", ";\n color: #0078ff;\n border-radius: 0.313rem;\n padding: 0.45rem;\n font-size: 0.875rem;\n line-height: 1.125rem;\n font-weight: 600;\n margin: 0;\n margin-top: 0.625rem;\n display: flex;\n align-items: center;\n background-color: #fff;\n user-select: none;\n\n svg {\n margin-right: 0.375rem;\n }\n\n &:hover {\n cursor: pointer;\n }\n"])), function (props) { return props.borderColor; });
|
|
13063
13063
|
var DeliveryDetails = function (_a) {
|
|
13064
13064
|
var deliveryDetailsText = _a.deliveryDetailsText, arrivingBy = _a.arrivingBy, shippingTo = _a.shippingTo, instantOrderUpdate = _a.instantOrderUpdate, note = _a.note;
|
|
13065
13065
|
var theme = useTheme();
|
|
13066
|
-
return (jsxs$1("div", __assign$1({ "data-testid": "DeliveryDetails" }, { children: [jsx$1(Title$5, __assign$1({ color: theme.colors.shades[700].color }, { children: deliveryDetailsText }), void 0), jsx$1(Line, { backgroundColor: theme.colors.shades['
|
|
13066
|
+
return (jsxs$1("div", __assign$1({ "data-testid": "DeliveryDetails" }, { children: [jsx$1(Title$5, __assign$1({ color: theme.colors.shades[700].color }, { children: deliveryDetailsText }), void 0), jsx$1(Line, { backgroundColor: theme.colors.shades['200'].color }, void 0), note && jsx$1(Note, __assign$1({}, note), void 0), jsxs$1(Row$1, __assign$1({ "data-testid": "DD-row", theme: theme }, { children: [jsxs$1(Col$1, __assign$1({ theme: theme }, { children: [jsxs$1(SectionTitle, __assign$1({ theme: theme }, { children: [jsx$1(IconContainer$2, __assign$1({ theme: theme }, { children: jsx$1(Icon.PDP.Clock, { width: 1.375 }, void 0) }), void 0), arrivingBy.title] }), void 0), jsx$1(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: arrivingBy.details }), void 0)] }), void 0), jsxs$1(Col$1, __assign$1({ theme: theme }, { children: [jsxs$1(SectionTitle, __assign$1({ theme: theme }, { children: [jsx$1(IconContainer$2, __assign$1({ theme: theme }, { children: jsx$1(Icon.Navigation.MapMarker, { width: 1.375 }, void 0) }), void 0), shippingTo.title] }), void 0), jsx$1(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: shippingTo.details }), void 0)] }), void 0), jsxs$1(Col$1, __assign$1({ theme: theme }, { children: [jsxs$1(SectionTitle, __assign$1({ theme: theme }, { children: [jsx$1(IconContainer$2, __assign$1({ theme: theme }, { children: jsx$1(Icon.Messaging.Messenger, { width: 1.375 }, void 0) }), void 0), instantOrderUpdate.title] }), void 0), jsx$1(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: instantOrderUpdate.details }), void 0), instantOrderUpdate.keepMeUpdated && (jsxs$1(KeepMeUpdated, __assign$1({ onClick: instantOrderUpdate.keepMeUpdated.onClick, borderColor: theme.colors.shades['150'].color }, { children: [jsx$1(Icon.Messaging.Messenger, { width: 1, height: 1, fill: "#0078FF" }, void 0), instantOrderUpdate.keepMeUpdated.title] }), void 0))] }), void 0)] }), void 0)] }), void 0));
|
|
13067
13067
|
};
|
|
13068
13068
|
var templateObject_1$T, templateObject_2$C, templateObject_3$x, templateObject_4$o, templateObject_5$f, templateObject_6$d, templateObject_7$9, templateObject_8$6;
|
|
13069
13069
|
|
|
@@ -13178,7 +13178,7 @@ var PriceContainer = newStyled.div(templateObject_4$l || (templateObject_4$l = _
|
|
|
13178
13178
|
})
|
|
13179
13179
|
: 'justify-content: end';
|
|
13180
13180
|
});
|
|
13181
|
-
var Quantity = newStyled.div(templateObject_5$e || (templateObject_5$e = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 0;\n transform: translate(30%, -30%);\n border-radius: 50%;\n width:
|
|
13181
|
+
var Quantity = newStyled.div(templateObject_5$e || (templateObject_5$e = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 0;\n transform: translate(30%, -30%);\n border-radius: 50%;\n width: 1rem;\n height: 1rem;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--colors-shades-300-color);\n color: var(--colors-shades-450-contrast);\n font-size: 0.75rem;\n"], ["\n position: absolute;\n right: 0;\n top: 0;\n transform: translate(30%, -30%);\n border-radius: 50%;\n width: 1rem;\n height: 1rem;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--colors-shades-300-color);\n color: var(--colors-shades-450-contrast);\n font-size: 0.75rem;\n"])));
|
|
13182
13182
|
var SimpleOrderItem = function (_a) {
|
|
13183
13183
|
var title = _a.title, className = _a.className, subtitle = _a.subtitle, image = _a.image, price = _a.price, tag = _a.tag, quantity = _a.quantity, finalPriceStyle = _a.finalPriceStyle;
|
|
13184
13184
|
var theme = useTheme();
|
package/build/index.js
CHANGED
|
@@ -4205,7 +4205,7 @@ exports.InputValidationType = void 0;
|
|
|
4205
4205
|
})(exports.InputValidationType || (exports.InputValidationType = {}));
|
|
4206
4206
|
|
|
4207
4207
|
var Section = newStyled.div(templateObject_1$1D || (templateObject_1$1D = __makeTemplateObject(["\n font-weight: 600;\n display: flex;\n flex-direction: row;\n align-items: center;\n align-text: left;\n width: 100%;\n box-sizing: border-box;\n align-self: flex-start;\n padding: ", ";\n"], ["\n font-weight: 600;\n display: flex;\n flex-direction: row;\n align-items: center;\n align-text: left;\n width: 100%;\n box-sizing: border-box;\n align-self: flex-start;\n padding: ", ";\n"])), function (props) {
|
|
4208
|
-
return props.type === exports.CardSectionType.Header ? '1.
|
|
4208
|
+
return props.type === exports.CardSectionType.Header ? '1.25rem 1.25rem 0' : '0 1.25rem 1.25rem';
|
|
4209
4209
|
});
|
|
4210
4210
|
var CardHeader = function (_a) {
|
|
4211
4211
|
var children = _a.children;
|
|
@@ -13037,14 +13037,14 @@ var Totals = {
|
|
|
13037
13037
|
Subtotal: Subtotal,
|
|
13038
13038
|
};
|
|
13039
13039
|
|
|
13040
|
-
var Container$E = newStyled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n border-radius: 0.313rem;\n display: flex;\n margin-bottom:
|
|
13040
|
+
var Container$E = newStyled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n border-radius: 0.313rem;\n display: flex;\n margin-bottom: 1.25rem;\n"], ["\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n border-radius: 0.313rem;\n display: flex;\n margin-bottom: 1.25rem;\n"])), function (props) { return props.color; });
|
|
13041
13041
|
var IconContainer$3 = newStyled.div(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n width: 1rem;\n height: 0.875rem;\n margin-right: 0.5rem;\n margin-top: 0.125rem;\n"], ["\n width: 1rem;\n height: 0.875rem;\n margin-right: 0.5rem;\n margin-top: 0.125rem;\n"])));
|
|
13042
13042
|
var Text$5 = newStyled.p(templateObject_3$y || (templateObject_3$y = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 400;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 400;\n margin: 0;\n color: ", ";\n"])), function (props) { return props.color; });
|
|
13043
13043
|
var Details = newStyled.span(templateObject_4$p || (templateObject_4$p = __makeTemplateObject(["\n color: ", ";\n font-weight: 700;\n"], ["\n color: ", ";\n font-weight: 700;\n"])), function (props) { return props.color; });
|
|
13044
13044
|
var Note = function (_a) {
|
|
13045
13045
|
var accentColor = _a.accentColor, color = _a.color, backgroundColor = _a.backgroundColor, importantNoteText = _a.importantNoteText, text = _a.text;
|
|
13046
13046
|
var theme = useTheme();
|
|
13047
|
-
return (jsxRuntime.jsxs(Container$E, __assign$1({ color: backgroundColor ? backgroundColor : theme.component.deliveryDetails.note.backgroundColor, "data-testid": "Container" }, { children: [jsxRuntime.jsx(IconContainer$3, { children: jsxRuntime.jsx(Icon.Actions.
|
|
13047
|
+
return (jsxRuntime.jsxs(Container$E, __assign$1({ color: backgroundColor ? backgroundColor : theme.component.deliveryDetails.note.backgroundColor, "data-testid": "Container" }, { children: [jsxRuntime.jsx(IconContainer$3, { children: jsxRuntime.jsx(Icon.Actions.Warning, { fill: accentColor ? accentColor : theme.component.deliveryDetails.note.accentColor }, void 0) }, void 0), jsxRuntime.jsx("div", { children: jsxRuntime.jsxs(Text$5, __assign$1({ color: color ? color : theme.component.deliveryDetails.note.color }, { children: [importantNoteText && (jsxRuntime.jsxs(Details, __assign$1({ color: accentColor ? accentColor : theme.component.deliveryDetails.note.accentColor }, { children: [importantNoteText, ":"] }), void 0)), ' ', text] }), void 0) }, void 0)] }), void 0));
|
|
13048
13048
|
};
|
|
13049
13049
|
var templateObject_1$U, templateObject_2$D, templateObject_3$y, templateObject_4$p;
|
|
13050
13050
|
|
|
@@ -13085,11 +13085,11 @@ var SectionDetails = newStyled.p(templateObject_7$9 || (templateObject_7$9 = __m
|
|
|
13085
13085
|
})
|
|
13086
13086
|
: '';
|
|
13087
13087
|
});
|
|
13088
|
-
var KeepMeUpdated = newStyled.h1(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n border: 0.063rem solid ", ";\n color: #0078ff;\n border-radius: 0.313rem;\n padding: 0.
|
|
13088
|
+
var KeepMeUpdated = newStyled.h1(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n border: 0.063rem solid ", ";\n color: #0078ff;\n border-radius: 0.313rem;\n padding: 0.45rem;\n font-size: 0.875rem;\n line-height: 1.125rem;\n font-weight: 600;\n margin: 0;\n margin-top: 0.625rem;\n display: flex;\n align-items: center;\n background-color: #fff;\n user-select: none;\n\n svg {\n margin-right: 0.375rem;\n }\n\n &:hover {\n cursor: pointer;\n }\n"], ["\n border: 0.063rem solid ", ";\n color: #0078ff;\n border-radius: 0.313rem;\n padding: 0.45rem;\n font-size: 0.875rem;\n line-height: 1.125rem;\n font-weight: 600;\n margin: 0;\n margin-top: 0.625rem;\n display: flex;\n align-items: center;\n background-color: #fff;\n user-select: none;\n\n svg {\n margin-right: 0.375rem;\n }\n\n &:hover {\n cursor: pointer;\n }\n"])), function (props) { return props.borderColor; });
|
|
13089
13089
|
var DeliveryDetails = function (_a) {
|
|
13090
13090
|
var deliveryDetailsText = _a.deliveryDetailsText, arrivingBy = _a.arrivingBy, shippingTo = _a.shippingTo, instantOrderUpdate = _a.instantOrderUpdate, note = _a.note;
|
|
13091
13091
|
var theme = useTheme();
|
|
13092
|
-
return (jsxRuntime.jsxs("div", __assign$1({ "data-testid": "DeliveryDetails" }, { children: [jsxRuntime.jsx(Title$5, __assign$1({ color: theme.colors.shades[700].color }, { children: deliveryDetailsText }), void 0), jsxRuntime.jsx(Line, { backgroundColor: theme.colors.shades['
|
|
13092
|
+
return (jsxRuntime.jsxs("div", __assign$1({ "data-testid": "DeliveryDetails" }, { children: [jsxRuntime.jsx(Title$5, __assign$1({ color: theme.colors.shades[700].color }, { children: deliveryDetailsText }), void 0), jsxRuntime.jsx(Line, { backgroundColor: theme.colors.shades['200'].color }, void 0), note && jsxRuntime.jsx(Note, __assign$1({}, note), void 0), jsxRuntime.jsxs(Row$1, __assign$1({ "data-testid": "DD-row", theme: theme }, { children: [jsxRuntime.jsxs(Col$1, __assign$1({ theme: theme }, { children: [jsxRuntime.jsxs(SectionTitle, __assign$1({ theme: theme }, { children: [jsxRuntime.jsx(IconContainer$2, __assign$1({ theme: theme }, { children: jsxRuntime.jsx(Icon.PDP.Clock, { width: 1.375 }, void 0) }), void 0), arrivingBy.title] }), void 0), jsxRuntime.jsx(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: arrivingBy.details }), void 0)] }), void 0), jsxRuntime.jsxs(Col$1, __assign$1({ theme: theme }, { children: [jsxRuntime.jsxs(SectionTitle, __assign$1({ theme: theme }, { children: [jsxRuntime.jsx(IconContainer$2, __assign$1({ theme: theme }, { children: jsxRuntime.jsx(Icon.Navigation.MapMarker, { width: 1.375 }, void 0) }), void 0), shippingTo.title] }), void 0), jsxRuntime.jsx(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: shippingTo.details }), void 0)] }), void 0), jsxRuntime.jsxs(Col$1, __assign$1({ theme: theme }, { children: [jsxRuntime.jsxs(SectionTitle, __assign$1({ theme: theme }, { children: [jsxRuntime.jsx(IconContainer$2, __assign$1({ theme: theme }, { children: jsxRuntime.jsx(Icon.Messaging.Messenger, { width: 1.375 }, void 0) }), void 0), instantOrderUpdate.title] }), void 0), jsxRuntime.jsx(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: instantOrderUpdate.details }), void 0), instantOrderUpdate.keepMeUpdated && (jsxRuntime.jsxs(KeepMeUpdated, __assign$1({ onClick: instantOrderUpdate.keepMeUpdated.onClick, borderColor: theme.colors.shades['150'].color }, { children: [jsxRuntime.jsx(Icon.Messaging.Messenger, { width: 1, height: 1, fill: "#0078FF" }, void 0), instantOrderUpdate.keepMeUpdated.title] }), void 0))] }), void 0)] }), void 0)] }), void 0));
|
|
13093
13093
|
};
|
|
13094
13094
|
var templateObject_1$T, templateObject_2$C, templateObject_3$x, templateObject_4$o, templateObject_5$f, templateObject_6$d, templateObject_7$9, templateObject_8$6;
|
|
13095
13095
|
|
|
@@ -13204,7 +13204,7 @@ var PriceContainer = newStyled.div(templateObject_4$l || (templateObject_4$l = _
|
|
|
13204
13204
|
})
|
|
13205
13205
|
: 'justify-content: end';
|
|
13206
13206
|
});
|
|
13207
|
-
var Quantity = newStyled.div(templateObject_5$e || (templateObject_5$e = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 0;\n transform: translate(30%, -30%);\n border-radius: 50%;\n width:
|
|
13207
|
+
var Quantity = newStyled.div(templateObject_5$e || (templateObject_5$e = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 0;\n transform: translate(30%, -30%);\n border-radius: 50%;\n width: 1rem;\n height: 1rem;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--colors-shades-300-color);\n color: var(--colors-shades-450-contrast);\n font-size: 0.75rem;\n"], ["\n position: absolute;\n right: 0;\n top: 0;\n transform: translate(30%, -30%);\n border-radius: 50%;\n width: 1rem;\n height: 1rem;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--colors-shades-300-color);\n color: var(--colors-shades-450-contrast);\n font-size: 0.75rem;\n"])));
|
|
13208
13208
|
var SimpleOrderItem = function (_a) {
|
|
13209
13209
|
var title = _a.title, className = _a.className, subtitle = _a.subtitle, image = _a.image, price = _a.price, tag = _a.tag, quantity = _a.quantity, finalPriceStyle = _a.finalPriceStyle;
|
|
13210
13210
|
var theme = useTheme();
|
|
@@ -613,6 +613,14 @@ declare type ThemeComponent = {
|
|
|
613
613
|
divider: {
|
|
614
614
|
color: string;
|
|
615
615
|
};
|
|
616
|
+
checkout: {
|
|
617
|
+
paymentInformation: {
|
|
618
|
+
borderRadius?: string;
|
|
619
|
+
};
|
|
620
|
+
creditCardSection: {
|
|
621
|
+
borderRadius?: string;
|
|
622
|
+
};
|
|
623
|
+
};
|
|
616
624
|
upsell: {
|
|
617
625
|
banner: {
|
|
618
626
|
outlined: {
|
|
@@ -630,6 +638,11 @@ declare type ThemeComponent = {
|
|
|
630
638
|
};
|
|
631
639
|
};
|
|
632
640
|
thankyou: {
|
|
641
|
+
orderBanner?: {
|
|
642
|
+
text: {
|
|
643
|
+
left: string;
|
|
644
|
+
};
|
|
645
|
+
};
|
|
633
646
|
emailSection: {
|
|
634
647
|
backgroundColor?: string;
|
|
635
648
|
};
|
|
@@ -737,6 +737,14 @@ var revel = {
|
|
|
737
737
|
divider: {
|
|
738
738
|
color: '--colors-pallete-secondary-soft-color',
|
|
739
739
|
},
|
|
740
|
+
checkout: {
|
|
741
|
+
paymentInformation: {
|
|
742
|
+
borderRadius: '8px',
|
|
743
|
+
},
|
|
744
|
+
creditCardSection: {
|
|
745
|
+
borderRadius: '8px',
|
|
746
|
+
},
|
|
747
|
+
},
|
|
740
748
|
upsell: {
|
|
741
749
|
banner: {
|
|
742
750
|
outlined: {
|
|
@@ -613,6 +613,14 @@ declare type ThemeComponent = {
|
|
|
613
613
|
divider: {
|
|
614
614
|
color: string;
|
|
615
615
|
};
|
|
616
|
+
checkout: {
|
|
617
|
+
paymentInformation: {
|
|
618
|
+
borderRadius?: string;
|
|
619
|
+
};
|
|
620
|
+
creditCardSection: {
|
|
621
|
+
borderRadius?: string;
|
|
622
|
+
};
|
|
623
|
+
};
|
|
616
624
|
upsell: {
|
|
617
625
|
banner: {
|
|
618
626
|
outlined: {
|
|
@@ -630,6 +638,11 @@ declare type ThemeComponent = {
|
|
|
630
638
|
};
|
|
631
639
|
};
|
|
632
640
|
thankyou: {
|
|
641
|
+
orderBanner?: {
|
|
642
|
+
text: {
|
|
643
|
+
left: string;
|
|
644
|
+
};
|
|
645
|
+
};
|
|
633
646
|
emailSection: {
|
|
634
647
|
backgroundColor?: string;
|
|
635
648
|
};
|
|
@@ -694,9 +694,9 @@ var shapermint = {
|
|
|
694
694
|
fontWeight: 700,
|
|
695
695
|
},
|
|
696
696
|
note: {
|
|
697
|
-
accentColor: '
|
|
697
|
+
accentColor: '#D3373C',
|
|
698
698
|
color: '--colors-text-color',
|
|
699
|
-
backgroundColor: '
|
|
699
|
+
backgroundColor: '#FDF1EF',
|
|
700
700
|
},
|
|
701
701
|
sectionDetails: {
|
|
702
702
|
fontSize: '0.875rem',
|
|
@@ -733,6 +733,14 @@ var shapermint = {
|
|
|
733
733
|
divider: {
|
|
734
734
|
color: '--colors-pallete-secondary-soft-color',
|
|
735
735
|
},
|
|
736
|
+
checkout: {
|
|
737
|
+
paymentInformation: {
|
|
738
|
+
borderRadius: '8px',
|
|
739
|
+
},
|
|
740
|
+
creditCardSection: {
|
|
741
|
+
borderRadius: '8px',
|
|
742
|
+
},
|
|
743
|
+
},
|
|
736
744
|
upsell: {
|
|
737
745
|
banner: {
|
|
738
746
|
outlined: {
|
|
@@ -613,6 +613,14 @@ declare type ThemeComponent = {
|
|
|
613
613
|
divider: {
|
|
614
614
|
color: string;
|
|
615
615
|
};
|
|
616
|
+
checkout: {
|
|
617
|
+
paymentInformation: {
|
|
618
|
+
borderRadius?: string;
|
|
619
|
+
};
|
|
620
|
+
creditCardSection: {
|
|
621
|
+
borderRadius?: string;
|
|
622
|
+
};
|
|
623
|
+
};
|
|
616
624
|
upsell: {
|
|
617
625
|
banner: {
|
|
618
626
|
outlined: {
|
|
@@ -630,6 +638,11 @@ declare type ThemeComponent = {
|
|
|
630
638
|
};
|
|
631
639
|
};
|
|
632
640
|
thankyou: {
|
|
641
|
+
orderBanner?: {
|
|
642
|
+
text: {
|
|
643
|
+
left: string;
|
|
644
|
+
};
|
|
645
|
+
};
|
|
633
646
|
emailSection: {
|
|
634
647
|
backgroundColor?: string;
|
|
635
648
|
};
|
|
@@ -694,7 +694,7 @@ var tsd = {
|
|
|
694
694
|
},
|
|
695
695
|
orderSummary: {
|
|
696
696
|
headingTextAlign: 'center',
|
|
697
|
-
backgroundColor: '
|
|
697
|
+
backgroundColor: '--colors-shades-10-color',
|
|
698
698
|
padding: '20px',
|
|
699
699
|
borderRadius: '--radius-regular',
|
|
700
700
|
maxWidth: '100%',
|
|
@@ -775,6 +775,14 @@ var tsd = {
|
|
|
775
775
|
divider: {
|
|
776
776
|
color: '--colors-pallete-tertiary-soft-color',
|
|
777
777
|
},
|
|
778
|
+
checkout: {
|
|
779
|
+
paymentInformation: {
|
|
780
|
+
borderRadius: '8px',
|
|
781
|
+
},
|
|
782
|
+
creditCardSection: {
|
|
783
|
+
borderRadius: '8px',
|
|
784
|
+
},
|
|
785
|
+
},
|
|
778
786
|
upsell: {
|
|
779
787
|
banner: {
|
|
780
788
|
outlined: {
|
|
@@ -613,6 +613,14 @@ declare type ThemeComponent = {
|
|
|
613
613
|
divider: {
|
|
614
614
|
color: string;
|
|
615
615
|
};
|
|
616
|
+
checkout: {
|
|
617
|
+
paymentInformation: {
|
|
618
|
+
borderRadius?: string;
|
|
619
|
+
};
|
|
620
|
+
creditCardSection: {
|
|
621
|
+
borderRadius?: string;
|
|
622
|
+
};
|
|
623
|
+
};
|
|
616
624
|
upsell: {
|
|
617
625
|
banner: {
|
|
618
626
|
outlined: {
|
|
@@ -630,6 +638,11 @@ declare type ThemeComponent = {
|
|
|
630
638
|
};
|
|
631
639
|
};
|
|
632
640
|
thankyou: {
|
|
641
|
+
orderBanner?: {
|
|
642
|
+
text: {
|
|
643
|
+
left: string;
|
|
644
|
+
};
|
|
645
|
+
};
|
|
633
646
|
emailSection: {
|
|
634
647
|
backgroundColor?: string;
|
|
635
648
|
};
|
|
@@ -149,10 +149,10 @@ var truekind = {
|
|
|
149
149
|
990: { color: '#0b0b0b', contrast: '--colors-shades-white-color' },
|
|
150
150
|
},
|
|
151
151
|
semantic: {
|
|
152
|
-
positive: { color: '#
|
|
153
|
-
urgent: { color: '#
|
|
154
|
-
attention: { color: '#
|
|
155
|
-
informative: { color: '#
|
|
152
|
+
positive: { color: '#2f806a', contrast: '--colors-shades-white-color' },
|
|
153
|
+
urgent: { color: '#c64844', contrast: '--colors-shades-white-color' },
|
|
154
|
+
attention: { color: '#f2d96f', contrast: '--colors-shades-700-color' },
|
|
155
|
+
informative: { color: '#0a609b', contrast: '--colors-shades-700-color' },
|
|
156
156
|
},
|
|
157
157
|
border: {
|
|
158
158
|
color: '',
|
|
@@ -737,7 +737,7 @@ var truekind = {
|
|
|
737
737
|
},
|
|
738
738
|
orderSummary: {
|
|
739
739
|
headingTextAlign: 'center',
|
|
740
|
-
backgroundColor: '
|
|
740
|
+
backgroundColor: '--colors-shades-10-color',
|
|
741
741
|
padding: '20px',
|
|
742
742
|
borderRadius: '--radius-regular',
|
|
743
743
|
maxWidth: '100%',
|
|
@@ -748,7 +748,7 @@ var truekind = {
|
|
|
748
748
|
},
|
|
749
749
|
expressCheckout: {
|
|
750
750
|
button: {
|
|
751
|
-
borderRadius: '
|
|
751
|
+
borderRadius: '24px',
|
|
752
752
|
},
|
|
753
753
|
},
|
|
754
754
|
copyrightText: {
|
|
@@ -817,6 +817,14 @@ var truekind = {
|
|
|
817
817
|
divider: {
|
|
818
818
|
color: '--colors-pallete-secondary-soft-color',
|
|
819
819
|
},
|
|
820
|
+
checkout: {
|
|
821
|
+
paymentInformation: {
|
|
822
|
+
borderRadius: '24px',
|
|
823
|
+
},
|
|
824
|
+
creditCardSection: {
|
|
825
|
+
borderRadius: '24px',
|
|
826
|
+
},
|
|
827
|
+
},
|
|
820
828
|
upsell: {
|
|
821
829
|
banner: {
|
|
822
830
|
outlined: {
|
|
@@ -834,6 +842,11 @@ var truekind = {
|
|
|
834
842
|
},
|
|
835
843
|
},
|
|
836
844
|
thankyou: {
|
|
845
|
+
orderBanner: {
|
|
846
|
+
text: {
|
|
847
|
+
left: '53%',
|
|
848
|
+
},
|
|
849
|
+
},
|
|
837
850
|
emailSection: {
|
|
838
851
|
backgroundColor: '--colors-pallete-champagne-color',
|
|
839
852
|
},
|
|
@@ -966,16 +979,26 @@ var truekind = {
|
|
|
966
979
|
assets: {
|
|
967
980
|
images: {
|
|
968
981
|
favicon: 'https://cdn.shopify.com/s/files/1/2679/8624/files/shapermint_favicon-128x128.png',
|
|
969
|
-
logo: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/
|
|
982
|
+
logo: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/truekind/tkd_logo_checkout.svg',
|
|
970
983
|
logoSize: {
|
|
971
|
-
width: '
|
|
972
|
-
height: '
|
|
984
|
+
width: '204',
|
|
985
|
+
height: '35',
|
|
986
|
+
},
|
|
987
|
+
checkoutLogo: {
|
|
988
|
+
url: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/truekind/tkd_logo_checkout.svg',
|
|
989
|
+
width: '204',
|
|
990
|
+
height: '35',
|
|
973
991
|
},
|
|
974
992
|
upsellLogo: {
|
|
975
|
-
url: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/
|
|
993
|
+
url: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/truekind/tkd_logo_checkout.svg',
|
|
976
994
|
width: '210',
|
|
977
995
|
height: '40',
|
|
978
996
|
},
|
|
997
|
+
tyLogo: {
|
|
998
|
+
url: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/truekind/tkd_logo_checkout.svg',
|
|
999
|
+
width: '276',
|
|
1000
|
+
height: '50',
|
|
1001
|
+
},
|
|
979
1002
|
},
|
|
980
1003
|
},
|
|
981
1004
|
};
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "Trafilea's Design System",
|
|
4
4
|
"author": "Trafilea",
|
|
5
5
|
"repository": "https://github.com/trafilea/afrodita-components",
|
|
6
|
-
"version": "5.0.0-beta.
|
|
6
|
+
"version": "5.0.0-beta.266",
|
|
7
7
|
"private": false,
|
|
8
8
|
"main": "build/index.js",
|
|
9
9
|
"style": "build/index.css",
|