wcz-layout 5.8.2 → 5.8.4

package/dist/src/components/Button.d.ts

@@ -1,3 +1,3 @@
-import { ButtonProps } from "@mui/material";
-import React from "react";
-export declare const Button: React.FC<ButtonProps>;
+import { ButtonProps } from "@mui/material";
+import React from "react";
+export declare const Button: React.FC<ButtonProps>;

package/dist/src/components/Button.js

@@ -1,9 +1,9 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Button as MaterialButton } from "@mui/material";
-import { useIsFetching, useIsMutating } from "@tanstack/react-query";
-export const Button = props => {
-    const isFetching = !!useIsFetching();
-    const isMutating = !!useIsMutating();
-    return _jsx(MaterialButton, { ...props, disabled: isFetching || isMutating || props.disabled });
-};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button as MaterialButton } from "@mui/material";
+import { useIsFetching, useIsMutating } from "@tanstack/react-query";
+export const Button = props => {
+    const isFetching = !!useIsFetching();
+    const isMutating = !!useIsMutating();
+    return _jsx(MaterialButton, { ...props, disabled: isFetching || isMutating || props.disabled });
+};
 //# sourceMappingURL=Button.js.map

package/dist/src/components/Dialog.d.ts

@@ -0,0 +1,16 @@
+import { Breakpoint } from "@mui/material";
+import { ReactNode } from "react";
+interface DialogProps {
+    children?: ReactNode;
+    title: string | ReactNode;
+    subtitle?: string | ReactNode;
+    open: boolean;
+    onClose: () => void;
+    color?: "success" | "info" | "warning" | "error" | "primary" | "secondary" | "inherit" | "default";
+    maxWidth?: Breakpoint;
+    actions?: ReactNode[];
+    disablePadding?: boolean;
+    disableAutoClose?: boolean;
+}
+export declare const Dialog: React.FC<DialogProps>;
+export {};

package/dist/src/components/Dialog.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Close } from "@mui/icons-material";
+import { AppBar, Dialog as MaterialDialog, DialogActions, DialogContent, DialogTitle, Grid, IconButton, LinearProgress, Toolbar, Typography, useMediaQuery } from "@mui/material";
+import { useTheme } from "@mui/material/styles";
+import { useIsFetching, useIsMutating } from "@tanstack/react-query";
+import { Fragment } from "react";
+import { LayoutSnackbar } from "./LayoutSnackbar";
+export const Dialog = ({ open, onClose, title, subtitle, children, color, maxWidth, actions, disablePadding, disableAutoClose }) => {
+    const theme = useTheme();
+    const fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
+    const isFetching = !!useIsFetching();
+    const isMutating = !!useIsMutating();
+    return (_jsxs(MaterialDialog, { open: open, onClose: disableAutoClose ? undefined : onClose, fullScreen: fullScreen, fullWidth: true, maxWidth: maxWidth, children: [fullScreen ?
+                _jsxs(Fragment, { children: [_jsx(AppBar, { sx: { position: "relative", bgcolor: `${color}.main` }, children: _jsxs(Toolbar, { children: [_jsxs(Typography, { sx: { flex: 1 }, variant: "h6", children: [title, subtitle && _jsx(Typography, { variant: "body2", sx: { opacity: 0.5 }, children: subtitle })] }), _jsx(IconButton, { edge: "start", onClick: onClose, children: _jsx(Close, { sx: { color: `${color}.contrastText` } }) })] }) }), (isFetching || isMutating) && _jsx(LinearProgress, { color: color === "default" ? undefined : color })] })
+                :
+                    _jsxs(Fragment, { children: [_jsxs(Grid, { container: true, justifyContent: "space-between", sx: { bgcolor: `${color}.main`, color: `${color}.contrastText` }, children: [_jsx(Grid, { item: true, xs: true, children: _jsxs(DialogTitle, { children: [title, subtitle && _jsx(Typography, { variant: "body2", sx: { opacity: 0.5 }, children: subtitle })] }) }), _jsx(Grid, { item: true, xs: 2, sx: { p: 1, textAlign: "right" }, children: _jsx(IconButton, { onClick: onClose, children: _jsx(Close, { fontSize: "small", sx: { color: `${color}.contrastText` } }) }) })] }), (isFetching || isMutating) && _jsx(LinearProgress, { color: color === "default" ? undefined : color })] }), disablePadding ? children : _jsx(DialogContent, { children: children }), actions &&
+                _jsx(DialogActions, { children: actions.map(action => action) }), _jsx(LayoutSnackbar, {})] }));
+};
+//# sourceMappingURL=Dialog.js.map

package/dist/src/components/Dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/components/Dialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Close } from \"@mui/icons-material\";\r\nimport { AppBar, Breakpoint, Dialog as MaterialDialog, DialogActions, DialogContent, DialogTitle, Grid, IconButton, LinearProgress, Toolbar, Typography, useMediaQuery } from \"@mui/material\";\r\nimport { useTheme } from \"@mui/material/styles\";\r\nimport { useIsFetching, useIsMutating } from \"@tanstack/react-query\";\r\nimport { Fragment, ReactNode } from \"react\";\r\nimport { LayoutSnackbar } from \"./LayoutSnackbar\";\r\n\r\ninterface DialogProps {\r\n    children?: ReactNode,\r\n    title: string | ReactNode;\r\n    subtitle?: string | ReactNode;\r\n    open: boolean;\r\n    onClose: () => void;\r\n    color?: \"success\" | \"info\" | \"warning\" | \"error\" | \"primary\" | \"secondary\" | \"inherit\" | \"default\";\r\n    maxWidth?: Breakpoint;\r\n    actions?: ReactNode[];\r\n    disablePadding?: boolean;\r\n    disableAutoClose?: boolean;\r\n}\r\n\r\nexport const Dialog: React.FC<DialogProps> = ({ open, onClose, title, subtitle, children, color, maxWidth, actions, disablePadding, disableAutoClose }) => {\r\n    const theme = useTheme();\r\n    const fullScreen = useMediaQuery(theme.breakpoints.down(\"sm\"));\r\n    const isFetching = !!useIsFetching();\r\n    const isMutating = !!useIsMutating();\r\n\r\n    return (\r\n        <MaterialDialog open={open} onClose={disableAutoClose ? undefined : onClose} fullScreen={fullScreen} fullWidth maxWidth={maxWidth}>\r\n            {fullScreen ?\r\n                <Fragment>\r\n                    <AppBar sx={{ position: \"relative\", bgcolor: `${color}.main` }}>\r\n                        <Toolbar>\r\n                            <Typography sx={{ flex: 1 }} variant=\"h6\">\r\n                                {title}\r\n                                {subtitle && <Typography variant=\"body2\" sx={{ opacity: 0.5 }}>{subtitle}</Typography>}\r\n                                </Typography>\r\n                            <IconButton edge=\"start\" onClick={onClose}>\r\n                                <Close sx={{ color: `${color}.contrastText` }} />\r\n                            </IconButton>\r\n                        </Toolbar>\r\n                    </AppBar>\r\n                    {(isFetching || isMutating) && <LinearProgress color={color === \"default\" ? undefined : color} />}\r\n                </Fragment>\r\n                :\r\n                <Fragment>\r\n                    <Grid container justifyContent=\"space-between\" sx={{ bgcolor: `${color}.main`, color: `${color}.contrastText` }}>\r\n                        <Grid item xs>\r\n                            <DialogTitle>\r\n                                {title}\r\n                                {subtitle && <Typography variant=\"body2\" sx={{ opacity: 0.5 }}>{subtitle}</Typography>}\r\n                            </DialogTitle>\r\n                        </Grid>\r\n\r\n                        <Grid item xs={2} sx={{ p: 1, textAlign: \"right\" }}>\r\n                            <IconButton onClick={onClose}>\r\n                                <Close fontSize=\"small\" sx={{ color: `${color}.contrastText` }} />\r\n                            </IconButton>\r\n                        </Grid>\r\n                    </Grid>\r\n                    {(isFetching || isMutating) && <LinearProgress color={color === \"default\" ? undefined : color} />}\r\n                </Fragment>\r\n            }\r\n\r\n            {disablePadding ? children : <DialogContent>{children}</DialogContent>}\r\n\r\n            {actions &&\r\n                <DialogActions>\r\n                    {actions.map(action => action)}\r\n                </DialogActions>\r\n            }\r\n\r\n            <LayoutSnackbar />\r\n        </MaterialDialog>\r\n    );\r\n};\r\n"]}

package/dist/src/components/Layout.d.ts

@@ -1,15 +1,15 @@
-import React from "react";
-import { LeftDrawerItem } from "../models/LeftDrawerItem";
-import { ExtendedUser } from "../models/User";
-interface LayoutProps {
-    title: string;
-    appVersion: string;
-    leftDrawerItems: LeftDrawerItem[];
-    primaryColor: string;
-    secondaryColor: string;
-    children: React.ReactNode;
-    user: ExtendedUser;
-    initialized: boolean;
-}
-export default function Layout(props: LayoutProps): import("react/jsx-runtime").JSX.Element;
-export {};
+import React from "react";
+import { LeftDrawerItem } from "../models/LeftDrawerItem";
+import { ExtendedUser } from "../models/User";
+interface LayoutProps {
+    title: string;
+    appVersion: string;
+    leftDrawerItems: LeftDrawerItem[];
+    primaryColor: string;
+    secondaryColor: string;
+    children: React.ReactNode;
+    user: ExtendedUser;
+    initialized: boolean;
+}
+export default function Layout(props: LayoutProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/components/Layout.js

@@ -1,72 +1,83 @@
-var _a;
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Menu } from "@mui/icons-material";
-import { AppBar as MuiAppBar, Box, Chip, CssBaseline, IconButton, LinearProgress, Toolbar, Typography, useMediaQuery } from "@mui/material";
-import { csCZ, enUS } from "@mui/material/locale";
-import { createTheme, styled, ThemeProvider } from "@mui/material/styles";
-import { useIsFetching, useIsMutating } from "@tanstack/react-query";
-import { useCallback, useEffect, useState } from "react";
-import { useTranslation } from "react-i18next";
-import { useLocation } from "react-router-dom";
-import { isDevelopment } from "../utils/Helpers";
-import { persistStorage } from "../utils/PersistStorage";
-import CenteredBox from "./common/CenteredBox";
-import AccountMenu from "./layout/AccountMenu";
-import LeftDrawer from "./layout/LeftDrawer";
-//Mode
-const storedMode = (_a = persistStorage.get("mode")) !== null && _a !== void 0 ? _a : "system";
-//Drawer
-const drawerWidth = 240;
-const DrawerHeader = styled("div")(({ theme }) => ({
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "flex-end",
-    padding: theme.spacing(0, 1),
-    // necessary for content to be below app bar
-    ...theme.mixins.toolbar,
-}));
-const AppBar = styled(MuiAppBar, {
-    shouldForwardProp: (prop) => prop !== "open",
-})(({ theme, open }) => ({
-    zIndex: theme.zIndex.drawer + 1,
-    transition: theme.transitions.create(["width", "margin"], {
-        easing: theme.transitions.easing.sharp,
-        duration: theme.transitions.duration.leavingScreen,
-    }),
-    ...(open && {
-        marginLeft: drawerWidth,
-        width: `calc(100% - ${drawerWidth}px)`,
-        transition: theme.transitions.create(["width", "margin"], {
-            easing: theme.transitions.easing.sharp,
-            duration: theme.transitions.duration.enteringScreen,
-        }),
-    }),
-}));
-export default function Layout(props) {
-    const { primaryColor, secondaryColor, title, appVersion, leftDrawerItems, user, initialized, children } = props;
-    const prefersDarkMode = useMediaQuery("(prefers-color-scheme: dark)");
-    const [mode, setMode] = useState(storedMode);
-    const [leftDrawerOpen, setLeftDrawerOpen] = useState(false);
-    const [authorized, setAuthorized] = useState(true);
-    const isFetching = !!useIsFetching();
-    const isMutating = !!useIsMutating();
-    const location = useLocation();
-    const { t, i18n } = useTranslation();
-    const theme = createTheme({
-        palette: {
-            mode: mode === "system" ? prefersDarkMode ? "dark" : "light" : mode,
-            primary: { main: primaryColor },
-            secondary: { main: secondaryColor },
-        },
-    }, i18n.language === "cs" ? csCZ : enUS);
-    useEffect(() => handleUnauthorized(), [location.pathname, initialized, leftDrawerItems]);
-    const handleUnauthorized = () => {
-        const activePage = leftDrawerItems.find(i => i.path === location.pathname);
-        if (activePage === null || activePage === void 0 ? void 0 : activePage.hidden)
-            return setAuthorized(false);
-        return setAuthorized(true);
-    };
-    const toggleDrawerOpen = useCallback(() => setLeftDrawerOpen(!leftDrawerOpen), [leftDrawerOpen]);
-    return (_jsxs(ThemeProvider, { theme: theme, children: [_jsxs(Box, { sx: { display: "flex", position: "sticky" }, children: [_jsx(CssBaseline, {}), _jsx(AppBar, { position: "fixed", open: leftDrawerOpen, children: _jsxs(Toolbar, { children: [_jsx(IconButton, { color: "inherit", onClick: toggleDrawerOpen, edge: "start", sx: { marginRight: 2, ...(leftDrawerOpen && { display: "none" }) }, children: _jsx(Menu, {}) }), _jsx(Typography, { variant: "h6", noWrap: true, component: "div", sx: { flexGrow: 1 }, children: title }), isDevelopment && _jsx(Chip, { color: "secondary", sx: { mr: 1.5 }, label: "Development" }), _jsx(AccountMenu, { mode: mode, setMode: setMode, user: user })] }) }), _jsx(LeftDrawer, { appVersion: appVersion, items: leftDrawerItems, drawerOpen: leftDrawerOpen, setDrawerOpen: setLeftDrawerOpen }), _jsxs(Box, { component: "main", sx: { flex: 1, overflow: "auto" }, children: [_jsx(DrawerHeader, {}), authorized ? children : _jsx(CenteredBox, { label: t("Layout.Unauthorized") })] })] }), (isFetching || isMutating) && _jsx(LinearProgress, { sx: { position: "fixed", top: { xs: 56, sm: 64 }, left: 0, right: 0 } })] }));
-}
+var _a;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Menu, Warning } from "@mui/icons-material";
+import { Box, Chip, CssBaseline, IconButton, LinearProgress, AppBar as MuiAppBar, Toolbar, Typography, useMediaQuery } from "@mui/material";
+import { csCZ, enUS } from "@mui/material/locale";
+import { ThemeProvider, createTheme, styled } from "@mui/material/styles";
+import { useIsFetching, useIsMutating } from "@tanstack/react-query";
+import { useCallback, useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { useLocation } from "react-router-dom";
+import { isDevelopment } from "../utils/Helpers";
+import { persistStorage } from "../utils/PersistStorage";
+import { hasRole } from "../utils/UserService";
+import { Dialog } from "./Dialog";
+import { TypographyWithIcon } from "./TypographyWithIcon";
+import CenteredBox from "./common/CenteredBox";
+import AccountMenu from "./layout/AccountMenu";
+import LeftDrawer from "./layout/LeftDrawer";
+import { Button } from "./Button";
+//Mode
+const storedMode = (_a = persistStorage.get("mode")) !== null && _a !== void 0 ? _a : "system";
+//Drawer
+const drawerWidth = 240;
+const DrawerHeader = styled("div")(({ theme }) => ({
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "flex-end",
+    padding: theme.spacing(0, 1),
+    // necessary for content to be below app bar
+    ...theme.mixins.toolbar,
+}));
+const AppBar = styled(MuiAppBar, {
+    shouldForwardProp: (prop) => prop !== "open",
+})(({ theme, open }) => ({
+    zIndex: theme.zIndex.drawer + 1,
+    transition: theme.transitions.create(["width", "margin"], {
+        easing: theme.transitions.easing.sharp,
+        duration: theme.transitions.duration.leavingScreen,
+    }),
+    ...(open && {
+        marginLeft: drawerWidth,
+        width: `calc(100% - ${drawerWidth}px)`,
+        transition: theme.transitions.create(["width", "margin"], {
+            easing: theme.transitions.easing.sharp,
+            duration: theme.transitions.duration.enteringScreen,
+        }),
+    }),
+}));
+export default function Layout(props) {
+    const { primaryColor, secondaryColor, title, appVersion, leftDrawerItems, user, initialized, children } = props;
+    const prefersDarkMode = useMediaQuery("(prefers-color-scheme: dark)");
+    const [mode, setMode] = useState(storedMode);
+    const [leftDrawerOpen, setLeftDrawerOpen] = useState(false);
+    const [authorized, setAuthorized] = useState(true);
+    const [developmentDialogOpen, setDevelopmentDialogOpen] = useState(false);
+    const isFetching = !!useIsFetching();
+    const isMutating = !!useIsMutating();
+    const location = useLocation();
+    const { t, i18n } = useTranslation();
+    const theme = createTheme({
+        palette: {
+            mode: mode === "system" ? prefersDarkMode ? "dark" : "light" : mode,
+            primary: { main: primaryColor },
+            secondary: { main: secondaryColor },
+        },
+    }, i18n.language === "cs" ? csCZ : enUS);
+    useEffect(() => handleUnauthorized(), [location.pathname, initialized, leftDrawerItems]);
+    const handleUnauthorized = () => {
+        const activePage = leftDrawerItems.find(i => i.path === location.pathname);
+        if (activePage === null || activePage === void 0 ? void 0 : activePage.hidden)
+            return setAuthorized(false);
+        return setAuthorized(true);
+    };
+    useEffect(() => {
+        if (user.loggedIn && !hasRole(["wcz-developers"]))
+            toggleDevelopmentDialogOpen();
+    }, [user.loggedIn]);
+    const toggleDevelopmentDialogOpen = useCallback(() => setDevelopmentDialogOpen(!developmentDialogOpen), [developmentDialogOpen]);
+    const developmentDialog = (_jsx(Dialog, { open: developmentDialogOpen, onClose: toggleDevelopmentDialogOpen, title: _jsx(TypographyWithIcon, { variant: "h6", startIcon: _jsx(Warning, {}), children: t("Layout.DevelopmentDialogTitle") }), color: "warning", disableAutoClose: true, actions: [_jsx(Button, { color: "warning", onClick: toggleDevelopmentDialogOpen, children: t("Close") }, "close")], children: t("Layout.DevelopmentDialogContent") }));
+    const toggleDrawerOpen = useCallback(() => setLeftDrawerOpen(!leftDrawerOpen), [leftDrawerOpen]);
+    return (_jsxs(ThemeProvider, { theme: theme, children: [_jsxs(Box, { sx: { display: "flex", position: "sticky" }, children: [_jsx(CssBaseline, {}), _jsx(AppBar, { position: "fixed", open: leftDrawerOpen, children: _jsxs(Toolbar, { children: [_jsx(IconButton, { color: "inherit", onClick: toggleDrawerOpen, edge: "start", sx: { marginRight: 2, ...(leftDrawerOpen && { display: "none" }) }, children: _jsx(Menu, {}) }), _jsx(Typography, { variant: "h6", noWrap: true, component: "div", sx: { flexGrow: 1 }, children: title }), isDevelopment && _jsx(Chip, { variant: "outlined", sx: theme => ({ mr: 1.5, color: theme.palette.primary.contrastText }), label: "Development" }), _jsx(AccountMenu, { mode: mode, setMode: setMode, user: user })] }) }), _jsx(LeftDrawer, { appVersion: appVersion, items: leftDrawerItems, drawerOpen: leftDrawerOpen, setDrawerOpen: setLeftDrawerOpen }), _jsxs(Box, { component: "main", sx: { flex: 1, overflow: "auto" }, children: [_jsx(DrawerHeader, {}), authorized ? children : _jsx(CenteredBox, { label: t("Layout.Unauthorized") })] })] }), developmentDialog, (isFetching || isMutating) && _jsx(LinearProgress, { sx: { position: "fixed", top: { xs: 56, sm: 64 }, left: 0, right: 0 } })] }));
+}
 //# sourceMappingURL=Layout.js.map

package/dist/src/components/Layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../../../src/components/Layout.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Menu } from \"@mui/icons-material\";\r\nimport { AppBar as MuiAppBar, AppBarProps as MuiAppBarProps, Box, Chip, CssBaseline, IconButton, LinearProgress, PaletteMode, Theme, Toolbar, Typography, useMediaQuery } from \"@mui/material\";\r\nimport { csCZ, enUS } from \"@mui/material/locale\";\r\nimport { createTheme, styled, ThemeProvider } from \"@mui/material/styles\";\r\nimport { useIsFetching, useIsMutating } from \"@tanstack/react-query\";\r\nimport React, { useCallback, useEffect, useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { useLocation } from \"react-router-dom\";\r\nimport { LeftDrawerItem } from \"../models/LeftDrawerItem\";\r\nimport { ExtendedUser } from \"../models/User\";\r\nimport { isDevelopment } from \"../utils/Helpers\";\r\nimport { persistStorage } from \"../utils/PersistStorage\";\r\nimport CenteredBox from \"./common/CenteredBox\";\r\nimport AccountMenu from \"./layout/AccountMenu\";\r\nimport LeftDrawer from \"./layout/LeftDrawer\";\r\n\r\n//Mode\r\nconst storedMode = persistStorage.get(\"mode\") as PaletteMode ?? \"system\";\r\n\r\n//Drawer\r\nconst drawerWidth = 240;\r\nconst DrawerHeader = styled(\"div\")(({ theme }) => ({\r\n    display: \"flex\",\r\n    alignItems: \"center\",\r\n    justifyContent: \"flex-end\",\r\n    padding: theme.spacing(0, 1),\r\n    // necessary for content to be below app bar\r\n    ...theme.mixins.toolbar,\r\n}));\r\n\r\n//AppBar\r\ninterface AppBarProps extends MuiAppBarProps {\r\n    open?: boolean;\r\n}\r\n\r\nconst AppBar = styled(MuiAppBar, {\r\n    shouldForwardProp: (prop) => prop !== \"open\",\r\n})<AppBarProps>(({ theme, open }) => ({\r\n    zIndex: theme.zIndex.drawer + 1,\r\n    transition: theme.transitions.create([\"width\", \"margin\"], {\r\n        easing: theme.transitions.easing.sharp,\r\n        duration: theme.transitions.duration.leavingScreen,\r\n    }),\r\n    ...(open && {\r\n        marginLeft: drawerWidth,\r\n        width: `calc(100% - ${drawerWidth}px)`,\r\n        transition: theme.transitions.create([\"width\", \"margin\"], {\r\n            easing: theme.transitions.easing.sharp,\r\n            duration: theme.transitions.duration.enteringScreen,\r\n        }),\r\n    }),\r\n}));\r\n\r\n//Layout\r\ninterface LayoutProps {\r\n    title: string,\r\n    appVersion: string,\r\n    leftDrawerItems: LeftDrawerItem[],\r\n    primaryColor: string,\r\n    secondaryColor: string,\r\n    children: React.ReactNode,\r\n    user: ExtendedUser,\r\n    initialized: boolean\r\n}\r\n\r\nexport default function Layout(props: LayoutProps) {\r\n    const { primaryColor, secondaryColor, title, appVersion, leftDrawerItems, user, initialized, children } = props;\r\n    const prefersDarkMode: boolean = useMediaQuery(\"(prefers-color-scheme: dark)\");\r\n    const [mode, setMode] = useState<PaletteMode | \"system\">(storedMode);\r\n    const [leftDrawerOpen, setLeftDrawerOpen] = useState<boolean>(false);\r\n    const [authorized, setAuthorized] = useState<boolean>(true);\r\n    const isFetching = !!useIsFetching();\r\n    const isMutating = !!useIsMutating();\r\n    const location = useLocation();\r\n    const { t, i18n } = useTranslation();\r\n\r\n    const theme: Theme = createTheme({\r\n        palette: {\r\n            mode: mode === \"system\" ? prefersDarkMode ? \"dark\" : \"light\" : mode,\r\n            primary: { main: primaryColor },\r\n            secondary: { main: secondaryColor },\r\n        },\r\n    }, i18n.language === \"cs\" ? csCZ : enUS);\r\n\r\n    useEffect(() => handleUnauthorized(), [location.pathname, initialized, leftDrawerItems]);\r\n\r\n    const handleUnauthorized = () => {\r\n        const activePage: LeftDrawerItem | undefined = leftDrawerItems.find(i => i.path === location.pathname);\r\n        if (activePage?.hidden)\r\n            return setAuthorized(false);\r\n\r\n        return setAuthorized(true);\r\n    };\r\n\r\n    const toggleDrawerOpen = useCallback(() => setLeftDrawerOpen(!leftDrawerOpen), [leftDrawerOpen]);\r\n\r\n    return (\r\n        <ThemeProvider theme={theme}>\r\n            <Box sx={{ display: \"flex\", position: \"sticky\" }}>\r\n                <CssBaseline />\r\n                <AppBar position=\"fixed\" open={leftDrawerOpen}>\r\n                    <Toolbar>\r\n                        <IconButton color=\"inherit\" onClick={toggleDrawerOpen} edge=\"start\" sx={{ marginRight: 2, ...(leftDrawerOpen && { display: \"none\" }) }} >\r\n                            <Menu />\r\n                        </IconButton>\r\n\r\n                        <Typography variant=\"h6\" noWrap component=\"div\" sx={{ flexGrow: 1 }}>{title}</Typography>\r\n\r\n                        {isDevelopment && <Chip color=\"secondary\" sx={{ mr: 1.5 }} label=\"Development\" />}\r\n\r\n                        <AccountMenu mode={mode} setMode={setMode} user={user} />\r\n                    </Toolbar>\r\n                </AppBar>\r\n\r\n                <LeftDrawer appVersion={appVersion} items={leftDrawerItems} drawerOpen={leftDrawerOpen} setDrawerOpen={setLeftDrawerOpen} />\r\n\r\n                <Box component=\"main\" sx={{ flex: 1, overflow: \"auto\" }}>\r\n                    <DrawerHeader />\r\n                    {authorized ? children : <CenteredBox label={t(\"Layout.Unauthorized\")!} />}\r\n                </Box>\r\n            </Box>\r\n\r\n            {(isFetching || isMutating) && <LinearProgress sx={{ position: \"fixed\", top: { xs: 56, sm: 64 }, left: 0, right: 0 }} />}\r\n        </ThemeProvider>\r\n    );\r\n}\r\n"]}
+{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../../../src/components/Layout.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Menu, Warning } from \"@mui/icons-material\";\r\nimport { Box, Chip, CssBaseline, IconButton, LinearProgress, AppBar as MuiAppBar, AppBarProps as MuiAppBarProps, PaletteMode, Theme, Toolbar, Typography, useMediaQuery } from \"@mui/material\";\r\nimport { csCZ, enUS } from \"@mui/material/locale\";\r\nimport { ThemeProvider, createTheme, styled } from \"@mui/material/styles\";\r\nimport { useIsFetching, useIsMutating } from \"@tanstack/react-query\";\r\nimport React, { useCallback, useEffect, useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { useLocation } from \"react-router-dom\";\r\nimport { LeftDrawerItem } from \"../models/LeftDrawerItem\";\r\nimport { ExtendedUser } from \"../models/User\";\r\nimport { isDevelopment } from \"../utils/Helpers\";\r\nimport { persistStorage } from \"../utils/PersistStorage\";\r\nimport { hasRole } from \"../utils/UserService\";\r\nimport { Dialog } from \"./Dialog\";\r\nimport { TypographyWithIcon } from \"./TypographyWithIcon\";\r\nimport CenteredBox from \"./common/CenteredBox\";\r\nimport AccountMenu from \"./layout/AccountMenu\";\r\nimport LeftDrawer from \"./layout/LeftDrawer\";\r\nimport { Button } from \"./Button\";\r\n\r\n//Mode\r\nconst storedMode = persistStorage.get(\"mode\") as PaletteMode ?? \"system\";\r\n\r\n//Drawer\r\nconst drawerWidth = 240;\r\nconst DrawerHeader = styled(\"div\")(({ theme }) => ({\r\n    display: \"flex\",\r\n    alignItems: \"center\",\r\n    justifyContent: \"flex-end\",\r\n    padding: theme.spacing(0, 1),\r\n    // necessary for content to be below app bar\r\n    ...theme.mixins.toolbar,\r\n}));\r\n\r\n//AppBar\r\ninterface AppBarProps extends MuiAppBarProps {\r\n    open?: boolean;\r\n}\r\n\r\nconst AppBar = styled(MuiAppBar, {\r\n    shouldForwardProp: (prop) => prop !== \"open\",\r\n})<AppBarProps>(({ theme, open }) => ({\r\n    zIndex: theme.zIndex.drawer + 1,\r\n    transition: theme.transitions.create([\"width\", \"margin\"], {\r\n        easing: theme.transitions.easing.sharp,\r\n        duration: theme.transitions.duration.leavingScreen,\r\n    }),\r\n    ...(open && {\r\n        marginLeft: drawerWidth,\r\n        width: `calc(100% - ${drawerWidth}px)`,\r\n        transition: theme.transitions.create([\"width\", \"margin\"], {\r\n            easing: theme.transitions.easing.sharp,\r\n            duration: theme.transitions.duration.enteringScreen,\r\n        }),\r\n    }),\r\n}));\r\n\r\n//Layout\r\ninterface LayoutProps {\r\n    title: string,\r\n    appVersion: string,\r\n    leftDrawerItems: LeftDrawerItem[],\r\n    primaryColor: string,\r\n    secondaryColor: string,\r\n    children: React.ReactNode,\r\n    user: ExtendedUser,\r\n    initialized: boolean\r\n}\r\n\r\nexport default function Layout(props: LayoutProps) {\r\n    const { primaryColor, secondaryColor, title, appVersion, leftDrawerItems, user, initialized, children } = props;\r\n    const prefersDarkMode: boolean = useMediaQuery(\"(prefers-color-scheme: dark)\");\r\n    const [mode, setMode] = useState<PaletteMode | \"system\">(storedMode);\r\n    const [leftDrawerOpen, setLeftDrawerOpen] = useState<boolean>(false);\r\n    const [authorized, setAuthorized] = useState<boolean>(true);\r\n    const [developmentDialogOpen, setDevelopmentDialogOpen] = useState<boolean>(false);\r\n    const isFetching = !!useIsFetching();\r\n    const isMutating = !!useIsMutating();\r\n    const location = useLocation();\r\n    const { t, i18n } = useTranslation();\r\n\r\n    const theme: Theme = createTheme({\r\n        palette: {\r\n            mode: mode === \"system\" ? prefersDarkMode ? \"dark\" : \"light\" : mode,\r\n            primary: { main: primaryColor },\r\n            secondary: { main: secondaryColor },\r\n        },\r\n    }, i18n.language === \"cs\" ? csCZ : enUS);\r\n\r\n    useEffect(() => handleUnauthorized(), [location.pathname, initialized, leftDrawerItems]);\r\n\r\n    const handleUnauthorized = () => {\r\n        const activePage: LeftDrawerItem | undefined = leftDrawerItems.find(i => i.path === location.pathname);\r\n        if (activePage?.hidden)\r\n            return setAuthorized(false);\r\n\r\n        return setAuthorized(true);\r\n    };\r\n\r\n    useEffect(() => {\r\n        if (user.loggedIn && !hasRole([\"wcz-developers\"]))\r\n            toggleDevelopmentDialogOpen();\r\n    }, [user.loggedIn]);\r\n\r\n    const toggleDevelopmentDialogOpen = useCallback(() => setDevelopmentDialogOpen(!developmentDialogOpen), [developmentDialogOpen]);\r\n\r\n    const developmentDialog = (\r\n        <Dialog\r\n            open={developmentDialogOpen}\r\n            onClose={toggleDevelopmentDialogOpen}\r\n            title={<TypographyWithIcon variant=\"h6\" startIcon={<Warning />}>{t(\"Layout.DevelopmentDialogTitle\")}</TypographyWithIcon>}\r\n            color=\"warning\"\r\n            disableAutoClose\r\n            actions={[<Button key=\"close\" color=\"warning\" onClick={toggleDevelopmentDialogOpen}>{t(\"Close\")}</Button>]}\r\n        >\r\n            {t(\"Layout.DevelopmentDialogContent\")}\r\n        </Dialog>\r\n    );\r\n\r\n    const toggleDrawerOpen = useCallback(() => setLeftDrawerOpen(!leftDrawerOpen), [leftDrawerOpen]);\r\n\r\n    return (\r\n        <ThemeProvider theme={theme}>\r\n            <Box sx={{ display: \"flex\", position: \"sticky\" }}>\r\n                <CssBaseline />\r\n                <AppBar position=\"fixed\" open={leftDrawerOpen}>\r\n                    <Toolbar>\r\n                        <IconButton color=\"inherit\" onClick={toggleDrawerOpen} edge=\"start\" sx={{ marginRight: 2, ...(leftDrawerOpen && { display: \"none\" }) }} >\r\n                            <Menu />\r\n                        </IconButton>\r\n\r\n                        <Typography variant=\"h6\" noWrap component=\"div\" sx={{ flexGrow: 1 }}>{title}</Typography>\r\n\r\n                        {isDevelopment && <Chip variant=\"outlined\" sx={theme => ({ mr: 1.5, color: theme.palette.primary.contrastText })} label=\"Development\" />}\r\n\r\n                        <AccountMenu mode={mode} setMode={setMode} user={user} />\r\n                    </Toolbar>\r\n                </AppBar>\r\n\r\n                <LeftDrawer appVersion={appVersion} items={leftDrawerItems} drawerOpen={leftDrawerOpen} setDrawerOpen={setLeftDrawerOpen} />\r\n\r\n                <Box component=\"main\" sx={{ flex: 1, overflow: \"auto\" }}>\r\n                    <DrawerHeader />\r\n                    {authorized ? children : <CenteredBox label={t(\"Layout.Unauthorized\")!} />}\r\n                </Box>\r\n            </Box>\r\n\r\n            {developmentDialog}\r\n            {(isFetching || isMutating) && <LinearProgress sx={{ position: \"fixed\", top: { xs: 56, sm: 64 }, left: 0, right: 0 }} />}\r\n        </ThemeProvider>\r\n    );\r\n}\r\n"]}

package/dist/src/components/LayoutSnackbar.d.ts

@@ -1,2 +1,2 @@
-/// <reference types="react" />
-export declare const LayoutSnackbar: React.FC;
+/// <reference types="react" />
+export declare const LayoutSnackbar: React.FC;

package/dist/src/components/LayoutSnackbar.js

@@ -1,17 +1,17 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Alert, AlertTitle, Snackbar } from "@mui/material";
-import { Fragment, useCallback, useContext } from "react";
-import { SnackbarContext } from "../contexts/SnackbarContext";
-export const LayoutSnackbar = () => {
-    const { snackbar, setSnackbar } = useContext(SnackbarContext);
-    const handleOnSnackbarClose = useCallback((_event, reason) => {
-        if (reason === "clickaway")
-            return;
-        setSnackbar({ ...snackbar, message: "" });
-    }, [snackbar]);
-    return (_jsx(Snackbar, { open: !!snackbar.message, autoHideDuration: snackbar.autoHideDuration === undefined ? 6000 : snackbar.autoHideDuration, onClose: handleOnSnackbarClose, children: _jsx(Alert, { onClose: handleOnSnackbarClose, severity: snackbar.severity, sx: { width: "100%" }, variant: "filled", children: snackbar.description ?
-                _jsxs(Fragment, { children: [_jsx(AlertTitle, { children: snackbar.message }), snackbar.description] })
-                :
-                    snackbar.message }) }));
-};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Alert, AlertTitle, Snackbar } from "@mui/material";
+import { Fragment, useCallback, useContext } from "react";
+import { SnackbarContext } from "../contexts/SnackbarContext";
+export const LayoutSnackbar = () => {
+    const { snackbar, setSnackbar } = useContext(SnackbarContext);
+    const handleOnSnackbarClose = useCallback((_event, reason) => {
+        if (reason === "clickaway")
+            return;
+        setSnackbar({ ...snackbar, message: "" });
+    }, [snackbar]);
+    return (_jsx(Snackbar, { open: !!(snackbar === null || snackbar === void 0 ? void 0 : snackbar.message), autoHideDuration: (snackbar === null || snackbar === void 0 ? void 0 : snackbar.autoHideDuration) === undefined ? 6000 : snackbar.autoHideDuration, onClose: handleOnSnackbarClose, children: _jsx(Alert, { onClose: handleOnSnackbarClose, severity: snackbar === null || snackbar === void 0 ? void 0 : snackbar.severity, sx: { width: "100%" }, variant: "filled", children: (snackbar === null || snackbar === void 0 ? void 0 : snackbar.description) ?
+                _jsxs(Fragment, { children: [_jsx(AlertTitle, { children: snackbar === null || snackbar === void 0 ? void 0 : snackbar.message }), snackbar.description] })
+                :
+                    snackbar === null || snackbar === void 0 ? void 0 : snackbar.message }) }));
+};
 //# sourceMappingURL=LayoutSnackbar.js.map

package/dist/src/components/LayoutSnackbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutSnackbar.js","sourceRoot":"","sources":["../../../src/components/LayoutSnackbar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAkB,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAE9D,MAAM,CAAC,MAAM,cAAc,GAAa,GAAG,EAAE;IACzC,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAE9D,MAAM,qBAAqB,GAAG,WAAW,CAAC,CAAC,MAA+B,EAAE,MAAe,EAAE,EAAE;QAC3F,IAAI,MAAM,KAAK,WAAW;YAAE,OAAO;QACnC,WAAW,CAAC,EAAE,GAAG,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAAC;IAC9C,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,OAAO,CACH,KAAC,QAAQ,IAAC,IAAI,EAAE,CAAC,CAAC,QAAQ,CAAC,OAAO,EAAE,gBAAgB,EAAE,QAAQ,CAAC,gBAAgB,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,gBAAgB,EAAE,OAAO,EAAE,qBAAqB,YAC5J,KAAC,KAAK,IAAC,OAAO,EAAE,qBAAqB,EAAE,QAAQ,EAAE,QAAQ,CAAC,QAAQ,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,OAAO,EAAC,QAAQ,YACtG,QAAQ,CAAC,WAAW,CAAC,CAAC;gBACnB,MAAC,QAAQ,eACL,KAAC,UAAU,cAAE,QAAQ,CAAC,OAAO,GAAc,EAC1C,QAAQ,CAAC,WAAW,IACd;gBACX,CAAC;oBACD,QAAQ,CAAC,OAAO,GAEhB,GACD,CACd,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { Alert, AlertTitle, Snackbar } from \"@mui/material\";\r\nimport { Fragment, SyntheticEvent, useCallback, useContext } from \"react\";\r\nimport { SnackbarContext } from \"../contexts/SnackbarContext\";\r\n\r\nexport const LayoutSnackbar: React.FC = () => {\r\n    const { snackbar, setSnackbar } = useContext(SnackbarContext);\r\n\r\n    const handleOnSnackbarClose = useCallback((_event?: SyntheticEvent | Event, reason?: string) => {\r\n        if (reason === \"clickaway\") return;\r\n        setSnackbar({ ...snackbar, message: \"\" });\r\n    }, [snackbar]);\r\n\r\n    return (\r\n        <Snackbar open={!!snackbar.message} autoHideDuration={snackbar.autoHideDuration === undefined ? 6000 : snackbar.autoHideDuration} onClose={handleOnSnackbarClose}>\r\n            <Alert onClose={handleOnSnackbarClose} severity={snackbar.severity} sx={{ width: \"100%\" }} variant=\"filled\">\r\n                {snackbar.description ?\r\n                    <Fragment>\r\n                        <AlertTitle>{snackbar.message}</AlertTitle>\r\n                        {snackbar.description}\r\n                    </Fragment>\r\n                    :\r\n                    snackbar.message\r\n                }\r\n            </Alert>\r\n        </Snackbar>\r\n    );\r\n};"]}
+{"version":3,"file":"LayoutSnackbar.js","sourceRoot":"","sources":["../../../src/components/LayoutSnackbar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAkB,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAE9D,MAAM,CAAC,MAAM,cAAc,GAAa,GAAG,EAAE;IACzC,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAE9D,MAAM,qBAAqB,GAAG,WAAW,CAAC,CAAC,MAA+B,EAAE,MAAe,EAAE,EAAE;QAC3F,IAAI,MAAM,KAAK,WAAW;YAAE,OAAO;QACnC,WAAW,CAAC,EAAE,GAAG,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAAC;IAC9C,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,OAAO,CACH,KAAC,QAAQ,IAAC,IAAI,EAAE,CAAC,CAAC,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,OAAO,CAAA,EAAE,gBAAgB,EAAE,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,gBAAgB,MAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,gBAAgB,EAAE,OAAO,EAAE,qBAAqB,YAC9J,KAAC,KAAK,IAAC,OAAO,EAAE,qBAAqB,EAAE,QAAQ,EAAE,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,OAAO,EAAC,QAAQ,YACvG,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,WAAW,EAAC,CAAC;gBACpB,MAAC,QAAQ,eACL,KAAC,UAAU,cAAE,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,OAAO,GAAc,EAC3C,QAAQ,CAAC,WAAW,IACd;gBACX,CAAC;oBACD,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,OAAO,GAEjB,GACD,CACd,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { Alert, AlertTitle, Snackbar } from \"@mui/material\";\r\nimport { Fragment, SyntheticEvent, useCallback, useContext } from \"react\";\r\nimport { SnackbarContext } from \"../contexts/SnackbarContext\";\r\n\r\nexport const LayoutSnackbar: React.FC = () => {\r\n    const { snackbar, setSnackbar } = useContext(SnackbarContext);\r\n\r\n    const handleOnSnackbarClose = useCallback((_event?: SyntheticEvent | Event, reason?: string) => {\r\n        if (reason === \"clickaway\") return;\r\n        setSnackbar({ ...snackbar, message: \"\" });\r\n    }, [snackbar]);\r\n\r\n    return (\r\n        <Snackbar open={!!snackbar?.message} autoHideDuration={snackbar?.autoHideDuration === undefined ? 6000 : snackbar.autoHideDuration} onClose={handleOnSnackbarClose}>\r\n            <Alert onClose={handleOnSnackbarClose} severity={snackbar?.severity} sx={{ width: \"100%\" }} variant=\"filled\">\r\n                {snackbar?.description ?\r\n                    <Fragment>\r\n                        <AlertTitle>{snackbar?.message}</AlertTitle>\r\n                        {snackbar.description}\r\n                    </Fragment>\r\n                    :\r\n                    snackbar?.message\r\n                }\r\n            </Alert>\r\n        </Snackbar>\r\n    );\r\n};"]}

package/dist/src/components/TypographyWithIcon.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { TypographyProps } from "@mui/material";
+interface TypographyWithIconProps extends TypographyProps {
+    startIcon?: React.ReactNode;
+    endIcon?: React.ReactNode;
+}
+export declare const TypographyWithIcon: React.FC<TypographyWithIconProps>;
+export {};

package/dist/src/components/TypographyWithIcon.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Typography } from "@mui/material";
+export const TypographyWithIcon = ({ startIcon, endIcon, children, ...props }) => {
+    return (_jsxs(Typography, { ...props, sx: { ...props.sx, display: "flex", alignItems: "center" }, children: [startIcon && _jsx(Box, { sx: { mr: 1, display: "inherit" }, children: startIcon }), children, endIcon && _jsx(Box, { sx: { ml: 1, display: "inherit" }, children: endIcon })] }));
+};
+//# sourceMappingURL=TypographyWithIcon.js.map

package/dist/src/components/TypographyWithIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TypographyWithIcon.js","sourceRoot":"","sources":["../../../src/components/TypographyWithIcon.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,UAAU,EAAmB,MAAM,eAAe,CAAC;AAOjE,MAAM,CAAC,MAAM,kBAAkB,GAAsC,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAChH,OAAO,CACH,MAAC,UAAU,OAAK,KAAK,EAAE,EAAE,EAAE,EAAE,GAAG,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC5E,SAAS,IAAI,KAAC,GAAG,IAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,YAAG,SAAS,GAAO,EACtE,QAAQ,EACR,OAAO,IAAI,KAAC,GAAG,IAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,YAAG,OAAO,GAAO,IAC1D,CAChB,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { Box, Typography, TypographyProps } from \"@mui/material\";\r\n\r\ninterface TypographyWithIconProps extends TypographyProps {\r\n    startIcon?: React.ReactNode;\r\n    endIcon?: React.ReactNode;\r\n}\r\n\r\nexport const TypographyWithIcon: React.FC<TypographyWithIconProps> = ({ startIcon, endIcon, children, ...props }) => {\r\n    return (\r\n        <Typography {...props} sx={{ ...props.sx, display: \"flex\", alignItems: \"center\" }}>\r\n            {startIcon && <Box sx={{ mr: 1, display: \"inherit\" }}>{startIcon}</Box>}\r\n            {children}\r\n            {endIcon && <Box sx={{ ml: 1, display: \"inherit\" }}>{endIcon}</Box>}\r\n        </Typography>\r\n    );\r\n};"]}

package/dist/src/components/common/CenteredBox.d.ts

@@ -1,6 +1,6 @@
-interface CenteredBoxProps {
-    label?: string;
-    circularProgress?: boolean;
-}
-export default function CenteredBox(props: CenteredBoxProps): import("react/jsx-runtime").JSX.Element;
-export {};
+interface CenteredBoxProps {
+    label?: string;
+    circularProgress?: boolean;
+}
+export default function CenteredBox(props: CenteredBoxProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/components/common/CenteredBox.js

@@ -1,13 +1,13 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, CircularProgress, Typography } from "@mui/material";
-import { useEffect, useState } from "react";
-export default function CenteredBox(props) {
-    const { label, circularProgress } = props;
-    const [delayedLabel, setDelayedLabel] = useState(undefined);
-    useEffect(() => {
-        if (label)
-            setTimeout(() => setDelayedLabel(label), 1000);
-    }, [label]);
-    return (_jsx(Box, { sx: { position: "relative", height: { xs: "calc(100vh - 56px)", sm: "calc(100vh - 64px)" } }, children: _jsxs(Box, { sx: { position: "absolute", top: "50%", left: "50%", transform: "translate(-50%, -50%)" }, children: [delayedLabel && _jsx(Typography, { variant: "h6", children: delayedLabel }), circularProgress && _jsx(CircularProgress, {})] }) }));
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, CircularProgress, Typography } from "@mui/material";
+import { useEffect, useState } from "react";
+export default function CenteredBox(props) {
+    const { label, circularProgress } = props;
+    const [delayedLabel, setDelayedLabel] = useState(undefined);
+    useEffect(() => {
+        if (label)
+            setTimeout(() => setDelayedLabel(label), 1000);
+    }, [label]);
+    return (_jsx(Box, { sx: { position: "relative", height: { xs: "calc(100vh - 56px)", sm: "calc(100vh - 64px)" } }, children: _jsxs(Box, { sx: { position: "absolute", top: "50%", left: "50%", transform: "translate(-50%, -50%)" }, children: [delayedLabel && _jsx(Typography, { variant: "h6", children: delayedLabel }), circularProgress && _jsx(CircularProgress, {})] }) }));
+}
 //# sourceMappingURL=CenteredBox.js.map

package/dist/src/components/layout/AccountMenu.d.ts

@@ -1,9 +1,9 @@
-import { PaletteMode } from "@mui/material";
-import { ExtendedUser } from "../../models/User";
-interface AccountMenuProps {
-    mode: PaletteMode | "system";
-    setMode: (mode: PaletteMode | "system") => void;
-    user: ExtendedUser;
-}
-export default function AccountMenu(props: AccountMenuProps): import("react/jsx-runtime").JSX.Element;
-export {};
+import { PaletteMode } from "@mui/material";
+import { ExtendedUser } from "../../models/User";
+interface AccountMenuProps {
+    mode: PaletteMode | "system";
+    setMode: (mode: PaletteMode | "system") => void;
+    user: ExtendedUser;
+}
+export default function AccountMenu(props: AccountMenuProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/components/layout/AccountMenu.js

@@ -1,51 +1,51 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { AccountCircle, ArrowBack, Brightness4, ChevronRight, DarkMode, LightMode, Login, Logout, SettingsBrightness, Translate } from "@mui/icons-material";
-import { Avatar, Box, IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText, ListSubheader, Menu, Typography } from "@mui/material";
-import { grey } from "@mui/material/colors";
-import { Fragment, useCallback, useRef, useState } from "react";
-import { useTranslation } from "react-i18next";
-import { persistStorage } from "../../utils/PersistStorage";
-const drawerWidth = 240;
-export default function AccountMenu(props) {
-    const { mode, setMode, user } = props;
-    const [anchorEl, setAnchorEl] = useState(null);
-    const [tab, setTab] = useState("settings");
-    const open = Boolean(anchorEl);
-    const accountButtonElement = useRef(null);
-    const { t, i18n } = useTranslation();
-    const changeLanguage = useCallback((newLanguage) => () => {
-        i18n.changeLanguage(newLanguage)
-            .finally(() => closeMenu());
-    }, []);
-    const changeMode = useCallback((newMode) => () => {
-        setMode(newMode);
-        closeMenu();
-        persistStorage.set("mode", newMode);
-    }, []);
-    const getNameInitials = () => {
-        const splittedName = user.name.split(" ");
-        return `${splittedName[0][0]}${splittedName.length > 1 ? splittedName[1][0] : ""}`;
-    };
-    const openMenu = useCallback((e) => setAnchorEl(e.currentTarget), []);
-    const closeMenu = useCallback(() => { setAnchorEl(null); setTimeout(() => setTab("settings"), 300); }, []);
-    const login = useCallback(() => {
-        user.login()
-            .catch(console.error);
-    }, []);
-    const logout = useCallback(() => {
-        user.logout()
-            .catch(console.error);
-    }, []);
-    const changeTab = useCallback((newTab) => () => setTab(newTab), []);
-    const settings = (_jsxs(List, { component: "nav", subheader: _jsx(ListSubheader, { sx: { backgroundColor: "transparent" }, children: t("Layout.Settings") }), children: [_jsxs(ListItemButton, { onClick: changeTab("theme"), sx: { py: 0.3 }, children: [_jsx(ListItemIcon, { children: _jsx(Brightness4, {}) }), _jsx(ListItemText, { primary: t("Layout.Appearance"), secondary: t(`Layout.${mode.charAt(0).toUpperCase() + mode.slice(1)}`) }), _jsx(ChevronRight, {})] }), _jsxs(ListItemButton, { onClick: changeTab("language"), sx: { py: 0.3 }, children: [_jsx(ListItemIcon, { children: _jsx(Translate, {}) }), _jsx(ListItemText, { primary: t("Layout.Language"), secondary: i18n.resolvedLanguage === "en" ? "English" : "Čeština" }), _jsx(ChevronRight, {})] })] }));
-    const theme = (_jsxs(List, { subheader: _jsxs(ListSubheader, { onClick: changeTab("settings"), sx: { backgroundColor: "transparent", display: "flex", alignItems: "center", px: 1, cursor: "pointer" }, children: [_jsx(IconButton, { size: "small", sx: { mr: 0.5 }, children: _jsx(ArrowBack, { fontSize: "small" }) }), " ", t("Layout.Appearance")] }), children: [_jsxs(ListItemButton, { onClick: changeMode("light"), disabled: mode === "light", children: [_jsx(ListItemIcon, { children: _jsx(LightMode, {}) }), _jsx(ListItemText, { primary: t("Layout.Light") })] }), _jsxs(ListItemButton, { onClick: changeMode("dark"), disabled: mode === "dark", children: [_jsx(ListItemIcon, { children: _jsx(DarkMode, {}) }), _jsx(ListItemText, { primary: t("Layout.Dark") })] }), _jsxs(ListItemButton, { onClick: changeMode("system"), disabled: mode === "system", children: [_jsx(ListItemIcon, { children: _jsx(SettingsBrightness, {}) }), _jsx(ListItemText, { primary: t("Layout.System") })] })] }));
-    const language = (_jsxs(List, { subheader: _jsxs(ListSubheader, { onClick: changeTab("settings"), sx: { backgroundColor: "transparent", display: "flex", alignItems: "center", px: 1, cursor: "pointer" }, children: [_jsx(IconButton, { size: "small", sx: { mr: 0.5 }, children: _jsx(ArrowBack, { fontSize: "small" }) }), " ", t("Layout.Language")] }), children: [_jsx(ListItemButton, { onClick: changeLanguage("en"), disabled: i18n.resolvedLanguage === "en", children: _jsx(ListItemText, { primary: "English" }) }), _jsx(ListItemButton, { onClick: changeLanguage("cs"), disabled: i18n.resolvedLanguage === "cs", children: _jsx(ListItemText, { primary: "\u010Ce\u0161tina" }) })] }));
-    return (_jsxs(Fragment, { children: [_jsx(IconButton, { color: "inherit", onClick: openMenu, edge: "end", ref: accountButtonElement, children: user.name ?
-                    _jsx(Avatar, { sx: { bgcolor: "white", color: grey[800], width: 32, height: 32, }, children: _jsx(Typography, { variant: "subtitle2", sx: { fontWeight: "bold", lineHeight: 0 }, children: getNameInitials() }) })
-                    :
-                        _jsx(AccountCircle, {}) }), _jsx(Menu, { anchorEl: anchorEl, open: open, onClose: closeMenu, children: _jsxs(Box, { sx: { width: drawerWidth }, role: "presentation", children: [_jsx(List, { "aria-labelledby": "account-menu", children: user.name ?
-                                _jsxs(Fragment, { children: [_jsx(ListItem, { children: _jsx(ListItemText, { primary: user.name, secondary: _jsxs("span", { children: [_jsx("span", { children: user.id }), _jsx("br", {}), _jsx("span", { children: user.department })] }) }) }), _jsxs(ListItemButton, { onClick: logout, children: [_jsx(ListItemIcon, { children: _jsx(Logout, { color: "error" }) }), _jsx(ListItemText, { primary: t("Layout.Logout") })] })] })
-                                :
-                                    _jsxs(ListItemButton, { onClick: login, children: [_jsx(ListItemIcon, { children: _jsx(Login, { color: "success" }) }), _jsx(ListItemText, { primary: t("Layout.LogIn") })] }) }), tab === "settings" && settings, tab === "theme" && theme, tab === "language" && language] }) })] }));
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AccountCircle, ArrowBack, Brightness4, ChevronRight, DarkMode, LightMode, Login, Logout, SettingsBrightness, Translate } from "@mui/icons-material";
+import { Avatar, Box, IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText, ListSubheader, Menu, Typography } from "@mui/material";
+import { grey } from "@mui/material/colors";
+import { Fragment, useCallback, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { persistStorage } from "../../utils/PersistStorage";
+const drawerWidth = 240;
+export default function AccountMenu(props) {
+    const { mode, setMode, user } = props;
+    const [anchorEl, setAnchorEl] = useState(null);
+    const [tab, setTab] = useState("settings");
+    const open = Boolean(anchorEl);
+    const accountButtonElement = useRef(null);
+    const { t, i18n } = useTranslation();
+    const changeLanguage = useCallback((newLanguage) => () => {
+        i18n.changeLanguage(newLanguage)
+            .finally(() => closeMenu());
+    }, []);
+    const changeMode = useCallback((newMode) => () => {
+        setMode(newMode);
+        closeMenu();
+        persistStorage.set("mode", newMode);
+    }, []);
+    const getNameInitials = () => {
+        const splittedName = user.name.split(" ");
+        return `${splittedName[0][0]}${splittedName.length > 1 ? splittedName[1][0] : ""}`;
+    };
+    const openMenu = useCallback((e) => setAnchorEl(e.currentTarget), []);
+    const closeMenu = useCallback(() => { setAnchorEl(null); setTimeout(() => setTab("settings"), 300); }, []);
+    const login = useCallback(() => {
+        user.login()
+            .catch(console.error);
+    }, []);
+    const logout = useCallback(() => {
+        user.logout()
+            .catch(console.error);
+    }, []);
+    const changeTab = useCallback((newTab) => () => setTab(newTab), []);
+    const settings = (_jsxs(List, { component: "nav", subheader: _jsx(ListSubheader, { sx: { backgroundColor: "transparent" }, children: t("Layout.Settings") }), children: [_jsxs(ListItemButton, { onClick: changeTab("theme"), sx: { py: 0.3 }, children: [_jsx(ListItemIcon, { children: _jsx(Brightness4, {}) }), _jsx(ListItemText, { primary: t("Layout.Appearance"), secondary: t(`Layout.${mode.charAt(0).toUpperCase() + mode.slice(1)}`) }), _jsx(ChevronRight, {})] }), _jsxs(ListItemButton, { onClick: changeTab("language"), sx: { py: 0.3 }, children: [_jsx(ListItemIcon, { children: _jsx(Translate, {}) }), _jsx(ListItemText, { primary: t("Layout.Language"), secondary: i18n.resolvedLanguage === "en" ? "English" : "Čeština" }), _jsx(ChevronRight, {})] })] }));
+    const theme = (_jsxs(List, { subheader: _jsxs(ListSubheader, { onClick: changeTab("settings"), sx: { backgroundColor: "transparent", display: "flex", alignItems: "center", px: 1, cursor: "pointer" }, children: [_jsx(IconButton, { size: "small", sx: { mr: 0.5 }, children: _jsx(ArrowBack, { fontSize: "small" }) }), " ", t("Layout.Appearance")] }), children: [_jsxs(ListItemButton, { onClick: changeMode("light"), disabled: mode === "light", children: [_jsx(ListItemIcon, { children: _jsx(LightMode, {}) }), _jsx(ListItemText, { primary: t("Layout.Light") })] }), _jsxs(ListItemButton, { onClick: changeMode("dark"), disabled: mode === "dark", children: [_jsx(ListItemIcon, { children: _jsx(DarkMode, {}) }), _jsx(ListItemText, { primary: t("Layout.Dark") })] }), _jsxs(ListItemButton, { onClick: changeMode("system"), disabled: mode === "system", children: [_jsx(ListItemIcon, { children: _jsx(SettingsBrightness, {}) }), _jsx(ListItemText, { primary: t("Layout.System") })] })] }));
+    const language = (_jsxs(List, { subheader: _jsxs(ListSubheader, { onClick: changeTab("settings"), sx: { backgroundColor: "transparent", display: "flex", alignItems: "center", px: 1, cursor: "pointer" }, children: [_jsx(IconButton, { size: "small", sx: { mr: 0.5 }, children: _jsx(ArrowBack, { fontSize: "small" }) }), " ", t("Layout.Language")] }), children: [_jsx(ListItemButton, { onClick: changeLanguage("en"), disabled: i18n.resolvedLanguage === "en", children: _jsx(ListItemText, { primary: "English" }) }), _jsx(ListItemButton, { onClick: changeLanguage("cs"), disabled: i18n.resolvedLanguage === "cs", children: _jsx(ListItemText, { primary: "\u010Ce\u0161tina" }) })] }));
+    return (_jsxs(Fragment, { children: [_jsx(IconButton, { color: "inherit", onClick: openMenu, edge: "end", ref: accountButtonElement, children: user.name ?
+                    _jsx(Avatar, { sx: { bgcolor: "white", color: grey[800], width: 32, height: 32, }, children: _jsx(Typography, { variant: "subtitle2", sx: { fontWeight: "bold", lineHeight: 0 }, children: getNameInitials() }) })
+                    :
+                        _jsx(AccountCircle, {}) }), _jsx(Menu, { anchorEl: anchorEl, open: open, onClose: closeMenu, children: _jsxs(Box, { sx: { width: drawerWidth }, role: "presentation", children: [_jsx(List, { "aria-labelledby": "account-menu", children: user.name ?
+                                _jsxs(Fragment, { children: [_jsx(ListItem, { children: _jsx(ListItemText, { primary: user.name, secondary: _jsxs("span", { children: [_jsx("span", { children: user.id }), _jsx("br", {}), _jsx("span", { children: user.department })] }) }) }), _jsxs(ListItemButton, { onClick: logout, children: [_jsx(ListItemIcon, { children: _jsx(Logout, { color: "error" }) }), _jsx(ListItemText, { primary: t("Layout.Logout") })] })] })
+                                :
+                                    _jsxs(ListItemButton, { onClick: login, children: [_jsx(ListItemIcon, { children: _jsx(Login, { color: "success" }) }), _jsx(ListItemText, { primary: t("Layout.LogIn") })] }) }), tab === "settings" && settings, tab === "theme" && theme, tab === "language" && language] }) })] }));
+}
 //# sourceMappingURL=AccountMenu.js.map