wcz-test 4.8.0 → 4.9.0

package/dist/index.js

@@ -975,67 +975,36 @@ var require_prop_types = __commonJS({
 // src/components/core/TypographyWithIcon.tsx
 import { Stack, Typography } from "@mui/material";
 import { jsx, jsxs } from "react/jsx-runtime";
-var stackSxProps = [
-  "margin",
-  "marginTop",
-  "marginRight",
-  "marginBottom",
-  "marginLeft",
-  "m",
-  "mt",
-  "mr",
-  "mb",
-  "ml",
-  "mx",
-  "my",
-  "padding",
-  "paddingTop",
-  "paddingRight",
-  "paddingBottom",
-  "paddingLeft",
-  "p",
-  "pt",
-  "pr",
-  "pb",
-  "pl",
-  "px",
-  "py",
-  "flexGrow",
-  "flexShrink",
-  "flexBasis",
-  "flexDirection",
-  "alignItems",
-  "justifyContent",
-  "position",
-  "zIndex",
-  "top",
-  "right",
-  "bottom",
-  "left",
-  "gridGap",
-  "gridColumnGap",
-  "gridRowGap",
-  "gridColumn",
-  "gridRow",
-  "gridAutoFlow",
-  "gap",
-  "columnGap",
-  "rowGap"
-];
-var TypographyWithIcon = ({ startIcon, endIcon, children, sx, gutterBottom, ...props }) => {
-  const sxCopy = { ...sx };
-  const stackStyles = {};
-  for (const current of stackSxProps) {
-    if (sxCopy[current]) {
-      stackStyles[current] = sxCopy[current];
-      delete sxCopy[current];
+var TypographyWithIcon = ({ startIcon, endIcon, children, sx, ...props }) => {
+  const iconSx = {
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flexShrink: 0,
+    lineHeight: 0,
+    "& > svg": {
+      display: "block"
     }
-  }
-  return /* @__PURE__ */ jsxs(Stack, { direction: "row", alignItems: "center", gap: 1, sx: stackStyles, mb: gutterBottom ? 0.7 : void 0, children: [
-    startIcon,
-    /* @__PURE__ */ jsx(Typography, { ...props, sx: sxCopy, children }),
-    endIcon
-  ] });
+  };
+  return /* @__PURE__ */ jsxs(
+    Typography,
+    {
+      component: "span",
+      sx: {
+        display: "inline-flex",
+        alignItems: "center",
+        verticalAlign: "middle",
+        ...sx
+      },
+      gap: 1,
+      ...props,
+      children: [
+        startIcon && /* @__PURE__ */ jsx(Stack, { component: "span", sx: iconSx, children: startIcon }),
+        /* @__PURE__ */ jsx(Stack, { component: "span", sx: { display: "inline", lineHeight: "inherit" }, children }),
+        endIcon && /* @__PURE__ */ jsx(Stack, { component: "span", sx: iconSx, children: endIcon })
+      ]
+    }
+  );
 };
 
 // src/components/core/Fullscreen.tsx
@@ -1247,7 +1216,7 @@ var rootRouteHead = ({ title }) => () => ({
     { rel: "apple-touch-icon", sizes: "180x180", href: "/apple-touch-icon.png" },
     { rel: "icon", type: "image/png", sizes: "32x32", href: "/favicon-32x32.png" },
     { rel: "icon", type: "image/png", sizes: "16x16", href: "/favicon-16x16.png" },
-    { rel: "manifest", href: "/manifest" },
+    { rel: "manifest", href: "/manifest.json" },
     { rel: "icon", href: "/favicon.ico" }
   ]
 });
@@ -2566,10 +2535,9 @@ var AdapterDayjs = class {
 };
 
 // src/providers/LayoutProvider.tsx
-import { useEffect as useEffect6 } from "react";
+import { useEffect as useEffect6, useEffectEvent } from "react";
 import { useTranslation as useTranslation7 } from "react-i18next";
 import * as z from "zod";
-import { cs, en } from "zod/locales";
 
 // src/components/core/Layout.tsx
 import Menu3 from "@mui/icons-material/Menu";
@@ -2942,38 +2910,27 @@ import Translate from "@mui/icons-material/Translate";
 import { Avatar as Avatar2, Box as Box8, IconButton as IconButton4, List as List4, ListItem as ListItem2, ListItemButton as ListItemButton5, ListItemIcon as ListItemIcon4, ListItemText as ListItemText4, ListSubheader as ListSubheader2, Menu as Menu2, Typography as Typography7, useColorScheme } from "@mui/material";
 import { Fragment as Fragment6, useState as useState8 } from "react";
 import { useTranslation as useTranslation5 } from "react-i18next";
+import Done from "@mui/icons-material/Done";
 import { jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
+var capitalize = (value) => value && value.charAt(0).toUpperCase() + value.slice(1);
 var ToolbarAccount = () => {
   const [anchorElement, setAnchorElement] = useState8();
   const [tab, setTab] = useState8("settings");
   const open = Boolean(anchorElement);
   const { t: t2, i18n } = useTranslation5();
   const { mode, setMode } = useColorScheme();
-  const changeLanguage = (newLanguage) => () => {
-    i18n.changeLanguage(newLanguage).finally(() => closeMenu());
-  };
-  const changeMode = (newMode) => () => {
-    setMode(newMode);
-    closeMenu();
-  };
+  const supportedLanguages = (Array.isArray(i18n.options.supportedLngs) ? i18n.options.supportedLngs : []).filter((lng) => lng !== "cimode");
+  const languageDisplayNames = new Intl.DisplayNames([i18n.language], { type: "language" });
+  const colorModes = [
+    { mode: "light", icon: LightMode, label: t2("Layout.Light") },
+    { mode: "dark", icon: DarkMode, label: t2("Layout.Dark") },
+    { mode: "system", icon: SettingsBrightness, label: t2("Layout.System") }
+  ];
   const user = {
     name: "Dalibor Homola",
     employeeId: "C2503017",
     department: "IT"
   };
-  const getModeText = () => {
-    switch (mode) {
-      case "light": {
-        return t2("Layout.Light");
-      }
-      case "dark": {
-        return t2("Layout.Dark");
-      }
-      default: {
-        return t2("Layout.System");
-      }
-    }
-  };
   const usernameInitials = () => {
     if (!user.name) return "";
     const splittedName = user.name.split(" ");
@@ -2988,41 +2945,52 @@ var ToolbarAccount = () => {
   const settings = /* @__PURE__ */ jsxs13(List4, { component: "nav", subheader: /* @__PURE__ */ jsx24(ListSubheader2, { sx: { backgroundColor: "transparent" }, children: t2("Layout.Settings") }), children: [
     /* @__PURE__ */ jsxs13(ListItemButton5, { onClick: changeTab("theme"), sx: { py: 0.3 }, children: [
       /* @__PURE__ */ jsx24(ListItemIcon4, { children: /* @__PURE__ */ jsx24(Brightness4, {}) }),
-      /* @__PURE__ */ jsx24(ListItemText4, { primary: t2("Layout.Appearance"), secondary: getModeText() }),
+      /* @__PURE__ */ jsx24(ListItemText4, { primary: t2("Layout.Appearance"), secondary: colorModes.find((m) => m.mode === mode)?.label }),
       /* @__PURE__ */ jsx24(ChevronRight, {})
     ] }),
     /* @__PURE__ */ jsxs13(ListItemButton5, { onClick: changeTab("language"), sx: { py: 0.3 }, children: [
       /* @__PURE__ */ jsx24(ListItemIcon4, { children: /* @__PURE__ */ jsx24(Translate, {}) }),
-      /* @__PURE__ */ jsx24(ListItemText4, { primary: t2("Layout.Language"), secondary: i18n.resolvedLanguage === "en" ? "English" : "\u010Ce\u0161tina" }),
+      /* @__PURE__ */ jsx24(ListItemText4, { primary: t2("Layout.Language"), secondary: capitalize(languageDisplayNames.of(i18n.language)) }),
       /* @__PURE__ */ jsx24(ChevronRight, {})
     ] })
   ] });
-  const theme = /* @__PURE__ */ jsxs13(List4, { subheader: /* @__PURE__ */ jsxs13(ListSubheader2, { onClick: changeTab("settings"), sx: { backgroundColor: "transparent", display: "flex", alignItems: "center", px: 1, cursor: "pointer" }, children: [
+  const theme = /* @__PURE__ */ jsx24(List4, { subheader: /* @__PURE__ */ jsxs13(ListSubheader2, { onClick: changeTab("settings"), sx: { backgroundColor: "transparent", display: "flex", alignItems: "center", px: 1, cursor: "pointer" }, children: [
     /* @__PURE__ */ jsx24(IconButton4, { size: "small", sx: { mr: 0.5 }, children: /* @__PURE__ */ jsx24(ArrowBack, { fontSize: "small" }) }),
     " ",
     t2("Layout.Appearance")
-  ] }), children: [
-    /* @__PURE__ */ jsxs13(ListItemButton5, { onClick: changeMode("light"), disabled: mode === "light", children: [
-      /* @__PURE__ */ jsx24(ListItemIcon4, { children: /* @__PURE__ */ jsx24(LightMode, {}) }),
-      /* @__PURE__ */ jsx24(ListItemText4, { primary: t2("Layout.Light") })
-    ] }),
-    /* @__PURE__ */ jsxs13(ListItemButton5, { onClick: changeMode("dark"), disabled: mode === "dark", children: [
-      /* @__PURE__ */ jsx24(ListItemIcon4, { children: /* @__PURE__ */ jsx24(DarkMode, {}) }),
-      /* @__PURE__ */ jsx24(ListItemText4, { primary: t2("Layout.Dark") })
-    ] }),
-    /* @__PURE__ */ jsxs13(ListItemButton5, { onClick: changeMode("system"), disabled: mode === "system", children: [
-      /* @__PURE__ */ jsx24(ListItemIcon4, { children: /* @__PURE__ */ jsx24(SettingsBrightness, {}) }),
-      /* @__PURE__ */ jsx24(ListItemText4, { primary: t2("Layout.System") })
-    ] })
-  ] });
-  const language = /* @__PURE__ */ jsxs13(List4, { subheader: /* @__PURE__ */ jsxs13(ListSubheader2, { onClick: changeTab("settings"), sx: { backgroundColor: "transparent", display: "flex", alignItems: "center", px: 1, cursor: "pointer" }, children: [
+  ] }), children: colorModes.map(({ mode: modeValue, icon: Icon, label }) => /* @__PURE__ */ jsxs13(
+    ListItemButton5,
+    {
+      onClick: () => {
+        setMode(modeValue);
+        closeMenu();
+      },
+      selected: mode === modeValue,
+      children: [
+        /* @__PURE__ */ jsx24(ListItemIcon4, { children: /* @__PURE__ */ jsx24(Icon, {}) }),
+        /* @__PURE__ */ jsx24(ListItemText4, { primary: label })
+      ]
+    },
+    modeValue
+  )) });
+  const language = /* @__PURE__ */ jsx24(List4, { subheader: /* @__PURE__ */ jsxs13(ListSubheader2, { onClick: changeTab("settings"), sx: { backgroundColor: "transparent", display: "flex", alignItems: "center", px: 1, cursor: "pointer" }, children: [
     /* @__PURE__ */ jsx24(IconButton4, { size: "small", sx: { mr: 0.5 }, children: /* @__PURE__ */ jsx24(ArrowBack, { fontSize: "small" }) }),
     " ",
     t2("Layout.Language")
-  ] }), children: [
-    /* @__PURE__ */ jsx24(ListItemButton5, { onClick: changeLanguage("en"), disabled: i18n.resolvedLanguage === "en", children: /* @__PURE__ */ jsx24(ListItemText4, { primary: "English" }) }),
-    /* @__PURE__ */ jsx24(ListItemButton5, { onClick: changeLanguage("cs"), disabled: i18n.resolvedLanguage === "cs", children: /* @__PURE__ */ jsx24(ListItemText4, { primary: "\u010Ce\u0161tina" }) })
-  ] });
+  ] }), children: supportedLanguages.map(
+    (languageCode) => /* @__PURE__ */ jsxs13(
+      ListItemButton5,
+      {
+        onClick: () => i18n.changeLanguage(languageCode).finally(() => closeMenu()),
+        selected: i18n.resolvedLanguage === languageCode,
+        children: [
+          /* @__PURE__ */ jsx24(ListItemIcon4, { children: i18n.resolvedLanguage === languageCode && /* @__PURE__ */ jsx24(Done, {}) }),
+          /* @__PURE__ */ jsx24(ListItemText4, { primary: capitalize(languageDisplayNames.of(languageCode)) })
+        ]
+      },
+      languageCode
+    )
+  ) });
   return /* @__PURE__ */ jsxs13(Fragment6, { children: [
     /* @__PURE__ */ jsx24(IconButton4, { size: "small", edge: "end", onClick: openMenu, children: user.name ? /* @__PURE__ */ jsx24(Avatar2, { sx: { width: { xs: 32, sm: 40 }, height: { xs: 32, sm: 40 }, bgcolor: "primary.main" }, children: /* @__PURE__ */ jsx24(Typography7, { variant: "subtitle2", sx: { fontWeight: "bold", lineHeight: 0 }, children: usernameInitials() }) }) : /* @__PURE__ */ jsx24(AccountCircle, { fontSize: "large" }) }),
     /* @__PURE__ */ jsx24(Menu2, { anchorEl: anchorElement, open, onClose: closeMenu, children: /* @__PURE__ */ jsxs13(Box8, { sx: { width: 240 }, children: [
@@ -3963,14 +3931,14 @@ import { jsx as jsx27 } from "react/jsx-runtime";
 var LayoutProvider = ({ navigation, theme, children }) => {
   const { i18n } = useTranslation7();
   const createdTheme = useGetTheme(theme);
+  const languageChangedHandler = useEffectEvent(() => {
+    z.config(z.core.locales[i18n.resolvedLanguage]());
+  });
   useEffect6(() => {
-    const handler = () => {
-      z.config(i18n.resolvedLanguage === "cs" ? cs() : en());
-    };
-    handler();
-    i18n.on("languageChanged", handler);
+    languageChangedHandler();
+    i18n.on("languageChanged", languageChangedHandler);
     return () => {
-      i18n.off("languageChanged", handler);
+      i18n.off("languageChanged", languageChangedHandler);
     };
   }, []);
   return /* @__PURE__ */ jsx27(ThemeProvider, { theme: createdTheme, children: /* @__PURE__ */ jsx27(LocalizationProvider, { dateAdapter: AdapterDayjs, adapterLocale: i18n.resolvedLanguage, children: /* @__PURE__ */ jsx27(DialogsProvider, { children: /* @__PURE__ */ jsx27(Layout, { navigation, children }) }) }) });