@m4l/components 0.0.14 → 0.0.17

package/dist/components/Image/index.d.ts

@@ -1,3 +1,4 @@
 /// <reference types="react" />
 import { Props } from './types';
-export default function Image({ ratio, sx, isSekeleton, width, height, src, ...other }: Props): JSX.Element;
+export declare function Image({ ratio, sx, isSekeleton, width, height, src, ...other }: Props): JSX.Element;
+export default Image;

package/dist/components/Image/index.js

@@ -16,6 +16,20 @@ const WrapperLazyLoadImage = styled("div")(({
   width,
   height
 }) => ({
+  ".lazy-load-image-background.blur": {
+    filter: "blur(15px)"
+  },
+  ".lazy-load-image-background.blur.lazy-load-image-loaded": {
+    filter: "blur(0)",
+    transition: "filter .3s;"
+  },
+  ".lazy-load-image-background.blur > img": {
+    opacity: "0"
+  },
+  ".lazy-load-image-background.blur.lazy-load-image-loaded > img": {
+    opacity: 1,
+    transition: "opacity .3s"
+  },
   width,
   height,
   lineHeight: 0,

package/dist/components/LanguagePopover/index.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import { defaultProps } from './types';
-export default function LanguagePopover(props: defaultProps): JSX.Element;
+export declare function LanguagePopover(props: defaultProps): JSX.Element;

package/dist/components/LanguagePopover/index.js

@@ -1,7 +1,43 @@
-import "react";
-import "@mui/material";
-import "../../react-lazy-load-image-component.js";
-import "@mui/material/styles";
-import "../Image/index.js";
-import "react/jsx-runtime";
-import "@m4l/graphics";
+import { useState } from "react";
+import { Skeleton, IconButton } from "@mui/material";
+import { I as Image } from "../Image/index.js";
+import { useLocales } from "@m4l/graphics";
+import { jsx, Fragment } from "react/jsx-runtime";
+function LanguagePopover(props) {
+  const {
+    isSkeleton
+  } = props;
+  const {
+    allLang,
+    currentLang,
+    onChangeLang
+  } = useLocales();
+  const [open, setOpen] = useState(null);
+  const handleOpen = (event) => {
+    setOpen(event.currentTarget);
+  };
+  if (isSkeleton) {
+    return /* @__PURE__ */ jsx(Skeleton, {
+      variant: "circular",
+      width: 20,
+      height: 20
+    });
+  }
+  return /* @__PURE__ */ jsx(Fragment, {
+    children: /* @__PURE__ */ jsx(IconButton, {
+      onClick: handleOpen,
+      sx: {
+        width: 40,
+        height: 40,
+        ...open && {
+          bgcolor: "action.selected"
+        }
+      },
+      children: /* @__PURE__ */ jsx(Image, {
+        src: currentLang.icon,
+        alt: currentLang.label
+      })
+    })
+  });
+}
+export { LanguagePopover as L };

package/dist/index.js

@@ -18,7 +18,7 @@ import "@m4l/graphics";
 export { C as CompanyLogo } from "./components/CompanyLogo/index.js";
 import "./react-lazy-load-image-component.js";
 import "@mui/material/styles";
-import "./components/Image/index.js";
+export { I as Image } from "./components/Image/index.js";
 export { D as DataGrid, g as getGridComponentsDictionary } from "./components/DataGrid/index.js";
 import "react-dnd";
 import "react-dnd-html5-backend";
@@ -42,6 +42,7 @@ export { D as DateFormatter } from "./components/DataGrid/formatters/DateFormatt
 export { R as RHFMultiCheckbox } from "./components/hook-form/RHFMultiCheckbox/index.js";
 export { R as RHFSelect } from "./components/hook-form/RHFSelect.js";
 export { R as RHFRadioGroup } from "./components/hook-form/RHFRadioGroup.js";
+export { L as LanguagePopover } from "./components/LanguagePopover/index.js";
 export { L as Loadable } from "./components/Loadable/index.js";
 export { A as Accordion } from "./components/mui_extended/Accordion/index.js";
 export { B as BoxIcon } from "./components/mui_extended/BoxIcon/index.js";

package/dist/react-lazy-load-image-component.js

@@ -765,5 +765,4 @@ var build = { exports: {} };
     const ie = ne;
   })(), build.exports = o;
 })();
-const blur = /* @__PURE__ */ (() => ".lazy-load-image-background.blur{filter:blur(15px)}.lazy-load-image-background.blur.lazy-load-image-loaded{filter:blur(0);transition:filter .3s}.lazy-load-image-background.blur>img{opacity:0}.lazy-load-image-background.blur.lazy-load-image-loaded>img{opacity:1;transition:opacity .3s}\n")();
 export { build as b };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@m4l/components",
   "private": false,
-  "version": "0.0.14",
+  "version": "0.0.17",
   "license": "UNLICENSED",
   "scripts": {
     "dev": "vite",

package/dist/style.css

@@ -1 +0,0 @@
-.lazy-load-image-background.blur{filter:blur(15px)}.lazy-load-image-background.blur.lazy-load-image-loaded{filter:blur(0);transition:filter .3s}.lazy-load-image-background.blur>img{opacity:0}.lazy-load-image-background.blur.lazy-load-image-loaded>img{opacity:1;transition:opacity .3s}