cloudmr-ux 4.1.0 → 4.1.1
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.
|
@@ -1,6 +1,23 @@
|
|
|
1
1
|
import "./Signin.scss";
|
|
2
|
-
|
|
3
|
-
appIcon
|
|
4
|
-
appTitle
|
|
2
|
+
type SigninProps = {
|
|
3
|
+
appIcon?: string;
|
|
4
|
+
appTitle?: string;
|
|
5
5
|
appIconHeight?: string | number;
|
|
6
|
-
|
|
6
|
+
/**
|
|
7
|
+
* "page" = original layout (flex-center + big top padding + container margins)
|
|
8
|
+
* "embed" = popover/card mode (no page layout wrapper; no outer margins)
|
|
9
|
+
*/
|
|
10
|
+
variant?: "page" | "embed";
|
|
11
|
+
/**
|
|
12
|
+
* Optional styling overrides for the Container that wraps the Paper card.
|
|
13
|
+
* (Use this to tweak spacing/width in embed mode.)
|
|
14
|
+
*/
|
|
15
|
+
sx?: any;
|
|
16
|
+
/**
|
|
17
|
+
* Optional styling overrides for the Paper card.
|
|
18
|
+
* (Use this to tweak padding/shadow in embed mode.)
|
|
19
|
+
*/
|
|
20
|
+
paperSx?: any;
|
|
21
|
+
};
|
|
22
|
+
export default function Signin({ appIcon, appTitle, appIconHeight, variant, sx, paperSx, }: SigninProps): import("react/jsx-runtime").JSX.Element;
|
|
23
|
+
export {};
|
|
@@ -31,20 +31,16 @@ import ForgotPassword from "./ForgotPassword";
|
|
|
31
31
|
import "./Signin.scss";
|
|
32
32
|
var theme = createTheme({
|
|
33
33
|
palette: {
|
|
34
|
-
primary: {
|
|
35
|
-
|
|
36
|
-
},
|
|
37
|
-
secondary: {
|
|
38
|
-
main: "#6c757d"
|
|
39
|
-
}
|
|
34
|
+
primary: { main: "#580F8B" },
|
|
35
|
+
secondary: { main: "#6c757d" }
|
|
40
36
|
}
|
|
41
37
|
});
|
|
42
38
|
export default function Signin(_a) {
|
|
43
|
-
var appIcon = _a.appIcon, appTitle = _a.appTitle, _b = _a.appIconHeight, appIconHeight = _b === void 0 ? "70pt" : _b;
|
|
39
|
+
var appIcon = _a.appIcon, appTitle = _a.appTitle, _b = _a.appIconHeight, appIconHeight = _b === void 0 ? "70pt" : _b, _c = _a.variant, variant = _c === void 0 ? "page" : _c, _d = _a.sx, sx = _d === void 0 ? {} : _d, _e = _a.paperSx, paperSx = _e === void 0 ? {} : _e;
|
|
44
40
|
var dispatch = useAppDispatch();
|
|
45
|
-
var
|
|
46
|
-
var
|
|
47
|
-
var
|
|
41
|
+
var _f = useAppSelector(function (state) { return state.authenticate; }), loading = _f.loading, error = _f.error;
|
|
42
|
+
var _g = useState(false), showRegister = _g[0], setShowRegister = _g[1];
|
|
43
|
+
var _h = useState(false), showForgotPassword = _h[0], setShowForgotPassword = _h[1];
|
|
48
44
|
useEffect(function () {
|
|
49
45
|
// Clear error when component unmounts
|
|
50
46
|
return function () {
|
|
@@ -62,23 +58,32 @@ export default function Signin(_a) {
|
|
|
62
58
|
};
|
|
63
59
|
dispatch(getLoggedInToken(credentials));
|
|
64
60
|
};
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
61
|
+
var content = (_jsxs("div", __assign({ id: "welcome" }, { children: [_jsx("div", __assign({ id: "welcome-logo" }, { children: _jsxs("div", __assign({ style: {
|
|
62
|
+
margin: "auto",
|
|
63
|
+
width: "100%",
|
|
64
|
+
display: "flex",
|
|
65
|
+
justifyContent: "center",
|
|
66
|
+
alignItems: "center"
|
|
67
|
+
} }, { children: [appIcon ? (_jsx("img", { src: appIcon, className: "img-fluid", style: { margin: "auto", height: appIconHeight }, alt: "" })) : null, appTitle ? (_jsx("h1", __assign({ style: {
|
|
68
|
+
display: "block",
|
|
69
|
+
marginTop: "8pt",
|
|
70
|
+
marginRight: "5pt",
|
|
71
|
+
textAlign: "center",
|
|
72
|
+
fontWeight: "bold"
|
|
73
|
+
} }, { children: appTitle }))) : null] })) })), _jsx("div", __assign({ id: "welcome-login" }, { children: !showRegister && !showForgotPassword ? (_jsx(Container
|
|
74
|
+
// In embed mode, don't clamp width with maxWidth and remove margins/padding
|
|
75
|
+
, __assign({
|
|
76
|
+
// In embed mode, don't clamp width with maxWidth and remove margins/padding
|
|
77
|
+
maxWidth: variant === "embed" ? false : "lg", sx: __assign({ mt: variant === "embed" ? 0 : 4, mb: variant === "embed" ? 0 : 4, px: variant === "embed" ? 0 : undefined }, sx) }, { children: _jsx(Paper, __assign({ sx: __assign(__assign({ p: 3 }, (variant === "embed" ? { boxShadow: "none" } : {})), paperSx) }, { children: _jsxs(Box, __assign({ component: "form", onSubmit: handleSubmit, noValidate: true }, { children: [_jsx(Typography, __assign({ variant: "h6", gutterBottom: true, sx: { mb: 2 } }, { children: "Sign In" })), error && (_jsx(Alert, __assign({ severity: "error", sx: { mb: 2 }, onClose: function () { return dispatch(clearError()); } }, { children: error }))), _jsx(TextField, { margin: "normal", className: "col-md-6", required: true, fullWidth: true, id: "email", label: "Email Address", name: "email", size: "small", autoComplete: "email", autoFocus: true }), _jsx(TextField, { margin: "normal", required: true, fullWidth: true, name: "password", label: "Password", type: "password", id: "password", size: "small", autoComplete: "current-password" }), _jsx(FormControlLabel, { control: _jsx(Checkbox, { value: "remember", size: "small", color: "primary" }), label: _jsx(Typography, __assign({ variant: "subtitle2" }, { children: "Remember Me" })), style: { float: "right", marginRight: "0" }, className: "input-sm" }), _jsx(Button, __assign({ type: "submit", fullWidth: true, variant: "contained", sx: { mt: 3, mb: 2 }, disabled: loading }, { children: loading ? "Signing In..." : "Sign In" })), _jsxs(Grid, __assign({ container: true, justifyContent: "space-between", alignItems: "center" }, { children: [_jsx(Grid, __assign({ item: true }, { children: _jsx(Link, __assign({ href: "#", onClick: function (e) {
|
|
78
|
+
e.preventDefault();
|
|
79
|
+
setShowForgotPassword(true);
|
|
80
|
+
}, variant: "body2" }, { children: "Forgot Password?" })) })), _jsx(Grid, __assign({ item: true }, { children: _jsx(Link, __assign({ href: "#", onClick: function (e) {
|
|
81
|
+
e.preventDefault();
|
|
82
|
+
setShowRegister(true);
|
|
83
|
+
}, variant: "body2" }, { children: "Sign Up" })) }))] }))] })) })) }))) : showForgotPassword ? (_jsx(ForgotPassword, { onBackToSignin: function () { return setShowForgotPassword(false); } })) : (_jsx(Register, { onBackToSignin: function () { return setShowRegister(false); } })) }))] })));
|
|
84
|
+
return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: variant === "embed" ? (
|
|
85
|
+
// Popover/card mode: no "page layout" wrapper
|
|
86
|
+
content) : (
|
|
87
|
+
// Original behavior stays the same for existing apps
|
|
88
|
+
_jsx("div", __assign({ className: "flex-center", style: { paddingTop: "clamp(16px, 12vh, 140px)" } }, { children: content }))) })));
|
|
84
89
|
}
|