@mailstep/design-system 0.7.49-beta.0 → 0.7.50-beta.0
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/package.json +1 -1
- package/ui/Blocks/LoginPage/LoginPage.js +2 -2
- package/ui/Blocks/LoginPage/styles.d.ts +1 -0
- package/ui/Blocks/LoginPage/styles.js +6 -3
- package/ui/Blocks/LoginPage/types.d.ts +1 -0
- package/ui/index.es.js +6930 -6919
- package/ui/index.umd.js +397 -397
package/package.json
CHANGED
|
@@ -8,7 +8,7 @@ import { Trans } from '@lingui/react';
|
|
|
8
8
|
import { x } from '@xstyled/styled-components';
|
|
9
9
|
import { Wrapper, MailTo, LanguageBox, LogoWrapper, MainLogo, Version, CardBodyWithLanguage } from './styles';
|
|
10
10
|
var Login = function (_a) {
|
|
11
|
-
var onSubmit = _a.onSubmit, activeLanguage = _a.activeLanguage, onLanguageChange = _a.onLanguageChange, children = _a.children, brand = _a.brand, brandVariant = _a.brandVariant, isSubmitting = _a.isSubmitting, isSubmitDisabled = _a.isSubmitDisabled, withDistributionCenterSelect = _a.withDistributionCenterSelect, distributionCenterOptions = _a.distributionCenterOptions, selectedDistributionCenter = _a.selectedDistributionCenter, onChangeDistributionCenter = _a.onChangeDistributionCenter, languageItems = _a.languageItems, version = _a.version, backgroundImage = _a.backgroundImage, _b = _a.hasSupport, hasSupport = _b === void 0 ? true : _b, _c = _a.hasSocialLinks, hasSocialLinks = _c === void 0 ? true : _c, _d = _a.withPassword, withPassword = _d === void 0 ? true : _d, loginLabel = _a.loginLabel;
|
|
12
|
-
return (_jsxs(Wrapper, { backgroundImage: backgroundImage, children: [_jsxs(CardBodyWithLanguage, { children: [_jsx(LogoWrapper, { children: _jsx(MainLogo, { brand: brand, variant: brandVariant }) }), _jsxs(LanguageBox, { children: [hasSupport && (_jsxs(x.div, { mr: 4, children: [_jsx(H6, { color: "gray1", variant: "bold", mt: "8px", mb: "8px", as: "h6", children: _jsx(Trans, { id: "form.heading.support", message: "Support:" }) }), _jsx(MailTo, { href: "mailto:mailstep@mailstep.cz", children: EMAIL_ADDRESS })] })), _jsx(LanguageSwitch, { activeLanguage: activeLanguage, onLanguageChange: onLanguageChange, languageItems: languageItems })] }), _jsx(LoginForm, { onSubmit: onSubmit, isSubmitDisabled: isSubmitDisabled, isSubmitting: isSubmitting, onChangeDistributionCenter: onChangeDistributionCenter, withDistributionCenterSelect: withDistributionCenterSelect, distributionCenterOptions: distributionCenterOptions, selectedDistributionCenter: selectedDistributionCenter, withPassword: withPassword, loginLabel: loginLabel })] }), children, version && _jsx(Version, { children: version }), hasSocialLinks && _jsx(SocialLinks, {})] }));
|
|
11
|
+
var onSubmit = _a.onSubmit, activeLanguage = _a.activeLanguage, onLanguageChange = _a.onLanguageChange, children = _a.children, brand = _a.brand, brandVariant = _a.brandVariant, isSubmitting = _a.isSubmitting, isSubmitDisabled = _a.isSubmitDisabled, withDistributionCenterSelect = _a.withDistributionCenterSelect, distributionCenterOptions = _a.distributionCenterOptions, selectedDistributionCenter = _a.selectedDistributionCenter, onChangeDistributionCenter = _a.onChangeDistributionCenter, languageItems = _a.languageItems, version = _a.version, backgroundImage = _a.backgroundImage, backgroundColor = _a.backgroundColor, _b = _a.hasSupport, hasSupport = _b === void 0 ? true : _b, _c = _a.hasSocialLinks, hasSocialLinks = _c === void 0 ? true : _c, _d = _a.withPassword, withPassword = _d === void 0 ? true : _d, loginLabel = _a.loginLabel;
|
|
12
|
+
return (_jsxs(Wrapper, { backgroundImage: backgroundImage, backgroundColor: backgroundColor, children: [_jsxs(CardBodyWithLanguage, { children: [_jsx(LogoWrapper, { children: _jsx(MainLogo, { brand: brand, variant: brandVariant }) }), _jsxs(LanguageBox, { children: [hasSupport && (_jsxs(x.div, { mr: 4, children: [_jsx(H6, { color: "gray1", variant: "bold", mt: "8px", mb: "8px", as: "h6", children: _jsx(Trans, { id: "form.heading.support", message: "Support:" }) }), _jsx(MailTo, { href: "mailto:mailstep@mailstep.cz", children: EMAIL_ADDRESS })] })), _jsx(LanguageSwitch, { activeLanguage: activeLanguage, onLanguageChange: onLanguageChange, languageItems: languageItems })] }), _jsx(LoginForm, { onSubmit: onSubmit, isSubmitDisabled: isSubmitDisabled, isSubmitting: isSubmitting, onChangeDistributionCenter: onChangeDistributionCenter, withDistributionCenterSelect: withDistributionCenterSelect, distributionCenterOptions: distributionCenterOptions, selectedDistributionCenter: selectedDistributionCenter, withPassword: withPassword, loginLabel: loginLabel })] }), children, version && _jsx(Version, { children: version }), hasSocialLinks && _jsx(SocialLinks, {})] }));
|
|
13
13
|
};
|
|
14
14
|
export default Login;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export declare const Wrapper: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {
|
|
3
3
|
backgroundImage?: "mailship" | undefined;
|
|
4
|
+
backgroundColor?: string | undefined;
|
|
4
5
|
}, never>;
|
|
5
6
|
export declare const LanguageBox: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;
|
|
6
7
|
export declare const CardBodyWithLanguage: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;
|
|
@@ -8,9 +8,12 @@ import styled, { th } from '@xstyled/styled-components';
|
|
|
8
8
|
var backgroundImageMap = {
|
|
9
9
|
mailship: mailship
|
|
10
10
|
};
|
|
11
|
-
export var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n font-family: ", ";\n flex-grow: 1;\n background: ", ";\n opacity: 1;\n z-index: 1;\n display: flex;\n justify-content: space-between;\n @media (min-width: 1024px) {\n background: ", "\n background-size: cover;\n }\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n font-family: ", ";\n flex-grow: 1;\n background: ", ";\n opacity: 1;\n z-index: 1;\n display: flex;\n justify-content: space-between;\n @media (min-width: 1024px) {\n background: ", "\n background-size: cover;\n }\n"])), th('fonts.primary'),
|
|
12
|
-
var
|
|
13
|
-
return
|
|
11
|
+
export var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n font-family: ", ";\n flex-grow: 1;\n background: ", ";\n opacity: 1;\n z-index: 1;\n display: flex;\n justify-content: space-between;\n @media (min-width: 1024px) {\n background: ", "\n background-size: cover;\n }\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n font-family: ", ";\n flex-grow: 1;\n background: ", ";\n opacity: 1;\n z-index: 1;\n display: flex;\n justify-content: space-between;\n @media (min-width: 1024px) {\n background: ", "\n background-size: cover;\n }\n"])), th('fonts.primary'), function (_a) {
|
|
12
|
+
var backgroundColor = _a.backgroundColor;
|
|
13
|
+
return backgroundColor || th('colors.bgLightGray');
|
|
14
|
+
}, function (_a) {
|
|
15
|
+
var backgroundImage = _a.backgroundImage, backgroundColor = _a.backgroundColor;
|
|
16
|
+
return "".concat(backgroundColor ? backgroundColor : 'transparent', " ").concat(backgroundImage && "url(".concat(backgroundImageMap[backgroundImage], ")"), " 50% 0% no-repeat padding-box;");
|
|
14
17
|
});
|
|
15
18
|
export var LanguageBox = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n margin: 15px 0;\n align-items: flex-end;\n justify-content: space-between;\n @media (min-width: 1024px) {\n justify-content: flex-end;\n margin: 40px 0;\n }\n"], ["\n display: flex;\n margin: 15px 0;\n align-items: flex-end;\n justify-content: space-between;\n @media (min-width: 1024px) {\n justify-content: flex-end;\n margin: 40px 0;\n }\n"])));
|
|
16
19
|
export var CardBodyWithLanguage = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n justify-content: start;\n padding: 0 32px 10px 32px;\n flex-grow: 1;\n margin: auto;\n width: 500px;\n @media (min-width: 1024px) {\n display: block;\n flex-grow: 0;\n }\n"], ["\n display: flex;\n justify-content: start;\n padding: 0 32px 10px 32px;\n flex-grow: 1;\n margin: auto;\n width: 500px;\n @media (min-width: 1024px) {\n display: block;\n flex-grow: 0;\n }\n"])));
|