@m4l/components 0.1.36 → 0.1.37

package/dist/components/areas/components/GridLayout/index.b9c1e846.js

@@ -0,0 +1,92 @@
+import { WidthProvider, Responsive } from "react-grid-layout";
+import { a as useArea } from "../../hooks/useArea/index.9b85ce24.js";
+import { styled } from "@mui/material/styles";
+import { W as WindowPopUp } from "../WindowPopUp/index.214cf099.js";
+import { M as MemonizedWindow } from "../Window/index.252fbf4e.js";
+import "react-grid-layout/css/styles.css";
+import "../../../../react-resizable.1d00271d.js";
+import { jsx, Fragment, jsxs } from "react/jsx-runtime";
+const WrapperPoups = styled("div")(() => ({
+  zIndex: 1,
+  " .react-draggable": {
+    position: "absolute"
+  }
+}));
+const ResponsiveGridLayout = WidthProvider(Responsive);
+const GridLayout = () => {
+  const {
+    status,
+    allLayouts,
+    layouts,
+    hashWindowsLayouts,
+    windowsPopUps,
+    onLayoutChange
+  } = useArea();
+  function onBreakpointChange(_newBreakpoint, _newCols) {
+  }
+  if (status === "init") {
+    return /* @__PURE__ */ jsx(Fragment, {});
+  } else if (status === "load") {
+    return /* @__PURE__ */ jsx("div", {
+      children: "Loading..."
+    });
+  }
+  return /* @__PURE__ */ jsxs(ResponsiveGridLayout, {
+    className: "layout",
+    onLayoutChange,
+    onBreakpointChange,
+    breakpoints: {
+      lg: 1200,
+      md: 996,
+      sm: 768,
+      xs: 480,
+      xxs: 0
+    },
+    cols: {
+      lg: 24,
+      md: 20,
+      sm: 12,
+      xs: 8,
+      xxs: 2
+    },
+    rowHeight: 100,
+    margin: [5, 5],
+    containerPadding: [3, 3],
+    draggableHandle: ".m4l_draggable_handle",
+    compactType: "horizontal",
+    layouts: allLayouts,
+    children: [/* @__PURE__ */ jsx(WrapperPoups, {
+      id: "WrapperPoups",
+      "data-grid": {
+        i: "none",
+        x: 0,
+        y: 0,
+        w: 0,
+        h: 0,
+        maxW: 0,
+        maxH: 0,
+        minW: 0,
+        minH: 0,
+        static: true,
+        isDraggable: false,
+        isResizable: false
+      },
+      children: windowsPopUps.map((wp) => /* @__PURE__ */ jsx(WindowPopUp, {
+        ...wp
+      }, wp.container_id))
+    }, "none"), layouts.map((l) => {
+      if (hashWindowsLayouts[l.i]) {
+        return /* @__PURE__ */ jsx("div", {
+          "data-grid": l,
+          children: /* @__PURE__ */ jsx(MemonizedWindow, {
+            ...hashWindowsLayouts[l.i]
+          })
+        }, l.i);
+      }
+      return null;
+    })]
+  });
+};
+export {
+  GridLayout as G
+};