@m4l/components 7.0.0 → 7.1.2

package/components/NoItemSelected/styles.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
-export declare const WrapperNoItemSelected: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const Img: import("@emotion/styled").StyledComponent<import("../Image").ImageProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
-export declare const Label: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export declare const WrapperSKTNoItemSelected: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const WrapperNoItemSelected: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Img: import('@emotion/styled').StyledComponent<import('../Image').ImageProps & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, {}, {}>;
+export declare const Label: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const WrapperSKTNoItemSelected: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/NoItemSelected/styles.js

@@ -0,0 +1,26 @@
+import { I as Image } from "../Image/Image.js";
+import { styled } from "@mui/material/styles";
+const WrapperNoItemSelected = styled("div")(({ theme }) => ({
+  ...theme.components?.M4LNoItemSelected?.styleOverrides || {}
+}));
+const Img = styled(Image)(() => ({
+  display: "flex"
+}));
+const Label = styled("span")(({ theme }) => ({
+  ...theme.colorSchemes.finalTheme.typography.body,
+  padding: `${theme.spacing(1.5)} ${theme.spacing(1)} ${theme.spacing(1)} ${theme.spacing(1)}`
+}));
+const WrapperSKTNoItemSelected = styled("div")(() => ({
+  display: "flex",
+  width: "100%",
+  minWidth: "100%",
+  minHeight: "230px",
+  mask: `url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 70 70' style='enable-background:new 0 0 70 70%3B' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M45 8.7c1.4-1.5 3.4-2.3 5.4-2.3s3.9 0.8 5.4 2.3s2.4 3.5 2.5 5.7c0 2.2-0.9 4.2-2.4 5.7s-3.5 2.3-5.5 2.2c-2.1 0.1-4-0.7-5.5-2.2c-1.4-1.5-2.3-3.5-2.4-5.7C42.6 12.2 43.5 10.2 45 8.7z'/%3E%3Cpath d='M68.4 62.1c-0.3 0.5-0.7 0.8-1.2 1.1s-1 0.4-1.6 0.4H4.3c-0.6 0-1.1-0.1-1.6-0.4s-0.9-0.6-1.2-1.1c-0.2-0.5-0.4-1-0.4-1.5s0.1-1.1 0.4-1.5l23-36.4c0.3-0.5 0.7-0.8 1.2-1.1c0.5-0.3 1-0.4 1.6-0.4c0.6 0 1.1 0.1 1.6 0.4c0.5 0.3 0.9 0.6 1.2 1.1l11.5 18.2c0.2 0.3 0.5 0.5 0.8 0.7c0.3 0.2 0.6 0.3 1 0.3c0.3 0 0.7-0.1 1-0.3c0.3-0.2 0.6-0.4 0.8-0.7l3.1-4.9c0.3-0.5 0.7-0.8 1.2-1.1c0.5-0.3 1-0.4 1.6-0.4c0.6 0 1.1 0.1 1.6 0.4c0.5 0.3 0.9 0.6 1.2 1.1l14.6 23.1c0.3 0.5 0.3 1 0.3 1.5S68.7 61.7 68.4 62.1z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain`,
+  WebkitMask: `url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 70 70' style='enable-background:new 0 0 70 70%3B' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M45 8.7c1.4-1.5 3.4-2.3 5.4-2.3s3.9 0.8 5.4 2.3s2.4 3.5 2.5 5.7c0 2.2-0.9 4.2-2.4 5.7s-3.5 2.3-5.5 2.2c-2.1 0.1-4-0.7-5.5-2.2c-1.4-1.5-2.3-3.5-2.4-5.7C42.6 12.2 43.5 10.2 45 8.7z'/%3E%3Cpath d='M68.4 62.1c-0.3 0.5-0.7 0.8-1.2 1.1s-1 0.4-1.6 0.4H4.3c-0.6 0-1.1-0.1-1.6-0.4s-0.9-0.6-1.2-1.1c-0.2-0.5-0.4-1-0.4-1.5s0.1-1.1 0.4-1.5l23-36.4c0.3-0.5 0.7-0.8 1.2-1.1c0.5-0.3 1-0.4 1.6-0.4c0.6 0 1.1 0.1 1.6 0.4c0.5 0.3 0.9 0.6 1.2 1.1l11.5 18.2c0.2 0.3 0.5 0.5 0.8 0.7c0.3 0.2 0.6 0.3 1 0.3c0.3 0 0.7-0.1 1-0.3c0.3-0.2 0.6-0.4 0.8-0.7l3.1-4.9c0.3-0.5 0.7-0.8 1.2-1.1c0.5-0.3 1-0.4 1.6-0.4c0.6 0 1.1 0.1 1.6 0.4c0.5 0.3 0.9 0.6 1.2 1.1l14.6 23.1c0.3 0.5 0.3 1 0.3 1.5S68.7 61.7 68.4 62.1z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain`
+}));
+export {
+  Img as I,
+  Label as L,
+  WrapperNoItemSelected as W,
+  WrapperSKTNoItemSelected as a
+};

package/components/ObjectLogs/components/DetailDialog/index.d.ts

@@ -1,2 +1,5 @@
-import type { DetailDialogProps } from './types';
+import { DetailDialogProps } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare function DetailDialog(props: DetailDialogProps): import("react/jsx-runtime").JSX.Element;

package/components/ObjectLogs/components/DetailDialog/index.js

@@ -0,0 +1,42 @@
+import { jsx } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { useNetwork } from "@m4l/core";
+import { useHostTheme } from "@m4l/graphics";
+import ReactJson from "@microlink/react-json-view";
+import { S as ScrollBar } from "../../../ScrollBar/index.js";
+function DetailDialog(props) {
+  const { log_id } = props;
+  const { networkOperation } = useNetwork();
+  const { hostThemeOptions } = useHostTheme();
+  const [detail, setDetail] = useState({});
+  useEffect(() => {
+    let mounted = true;
+    networkOperation({
+      method: "GET",
+      endPoint: `logs/${log_id}`
+    }).then((response) => {
+      if (mounted) {
+        const parseData = JSON.parse(String(response.data.log_detail));
+        setDetail(parseData);
+      }
+    });
+    return function cleanUp() {
+      mounted = false;
+    };
+  }, []);
+  const modeTheme = hostThemeOptions.palette?.mode;
+  return /* @__PURE__ */ jsx(ScrollBar, { children: /* @__PURE__ */ jsx(
+    ReactJson,
+    {
+      theme: modeTheme === "dark" ? "summerfruit" : "rjv-default",
+      name: null,
+      sortKeys: true,
+      displayDataTypes: false,
+      quotesOnKeys: false,
+      src: detail
+    }
+  ) });
+}
+export {
+  DetailDialog as D
+};

package/components/ObjectLogs/components/DetailDialog/styles.d.ts

@@ -0,0 +1,2 @@
+export declare const Container: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Text: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/components/ObjectLogs/components/DetailFormatter/index.d.ts

@@ -1,2 +1,5 @@
 import { DetailFormatterProps } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare function DetailFormatter(props: DetailFormatterProps): import("react/jsx-runtime").JSX.Element;

package/components/ObjectLogs/components/DetailFormatter/index.js

@@ -0,0 +1,32 @@
+import { jsx } from "react/jsx-runtime";
+import { Tooltip, IconButton } from "@mui/material";
+import { D as DetailDialog } from "../DetailDialog/index.js";
+import { u as useModal } from "../../../../hooks/useModal/index.js";
+import { useModuleDictionary, useEnvironment } from "@m4l/core";
+import { I as Icon } from "../../../Icon/Icon.js";
+import { useResponsiveDesktop } from "@m4l/graphics";
+import { S as Stack } from "../../../mui_extended/Stack/Stack.js";
+import { W as WindowBase } from "../../../modal/WindowBase/index.js";
+function DetailFormatter(props) {
+  const { log_id } = props;
+  const { openModal } = useModal();
+  const { getLabel } = useModuleDictionary();
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const isDesktop = useResponsiveDesktop();
+  const onClickDetail = () => {
+    openModal({
+      // onQueryClose: () => closeModal(),
+      window: /* @__PURE__ */ jsx(WindowBase, { title: getLabel("data_grid.settings_title"), children: /* @__PURE__ */ jsx(Stack, { direction: "column", flexGrow: 1, children: /* @__PURE__ */ jsx(DetailDialog, { log_id }) }) }),
+      fullScreen: !isDesktop ? true : false
+    });
+  };
+  return /* @__PURE__ */ jsx(Tooltip, { title: getLabel("object_logs.view_log_detail"), children: /* @__PURE__ */ jsx(IconButton, { onClick: onClickDetail, "aria-label": "filter", children: /* @__PURE__ */ jsx(
+    Icon,
+    {
+      src: `${host_static_assets}/${environment_assets}/frontend/components/object_logs/assets/icons/search.svg`
+    }
+  ) }) });
+}
+export {
+  DetailFormatter as D
+};

package/components/ObjectLogs/dictionary.d.ts

@@ -1,3 +1,6 @@
 import { Dictionary } from '@m4l/core';
+/**
+ * TODO: Documentar
+ */
 export declare function getObjectLogsComponentsDictionary(): string[];
 export declare const defaultObjectLogDictionary: Dictionary;

package/components/ObjectLogs/dictionary.js

@@ -0,0 +1,20 @@
+import { g as getDataGridComponentsDictionary } from "../DataGrid/dictionary.js";
+import { a as getDynamicFilterComponentsDictionary } from "../DynamicFilter/dictionary.js";
+function getObjectLogsComponentsDictionary() {
+  return ["object_logs"].concat(getDataGridComponentsDictionary()).concat(getDynamicFilterComponentsDictionary());
+}
+const defaultObjectLogDictionary = {
+  object_logs: {
+    created_at: "Start date",
+    user: "User/email",
+    resource_name: "Resource",
+    privilege_name: "Privilege",
+    log_preview: "Log",
+    log_detail: "Detail",
+    ip: "Ip"
+  }
+};
+export {
+  defaultObjectLogDictionary as d,
+  getObjectLogsComponentsDictionary as g
+};

package/components/ObjectLogs/index.d.ts

@@ -1,2 +1,5 @@
 import { LogsProps } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare function ObjectLogs(props: LogsProps): import("react/jsx-runtime").JSX.Element;

package/components/ObjectLogs/index.js

@@ -0,0 +1,157 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useCallback, useMemo, useEffect } from "react";
+import { useModuleDictionary, useEnvironment, usePaginate } from "@m4l/core";
+import { C as Container, A as Actions, G as GridWrapper } from "./styles.js";
+import { D as DataGrid } from "../DataGrid/index.js";
+import { D as DateFormatter } from "../formatters/DateFormatter/index.js";
+import { D as DetailFormatter } from "./components/DetailFormatter/index.js";
+import { D as DynamicFilter } from "../DynamicFilter/DynamicFilter.js";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock.js";
+function ObjectLogs(props) {
+  const { resource_id, object_id, dataTestId = "" } = props;
+  const { getLabel } = useModuleDictionary();
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const [queryParams, setQueryParams] = useState({
+    resource_id,
+    object_id
+  });
+  const dateFormatterCreatedAt = useCallback(
+    (rowProps) => /* @__PURE__ */ jsx(DateFormatter, { presentationType: "datetime", value: rowProps.row.created_at }),
+    []
+  );
+  const DetailRowFormatter = useCallback(
+    (rowProps) => /* @__PURE__ */ jsx(DetailFormatter, { log_id: rowProps.row.id }),
+    []
+  );
+  const columns = useMemo(
+    () => [
+      {
+        key: "created_at",
+        name: getLabel("object_logs.created_at"),
+        type: "date",
+        width: 300,
+        formatter: dateFormatterCreatedAt
+      },
+      { key: "email", name: getLabel("object_logs.email"), type: "string", width: 300 },
+      {
+        key: "resource_name",
+        name: getLabel("object_logs.resource_name"),
+        type: "string",
+        width: 120
+      },
+      {
+        key: "log_preview",
+        name: getLabel("object_logs.log_preview"),
+        type: "string",
+        width: 250
+      },
+      {
+        key: "Detail",
+        name: getLabel("object_logs.log_detail"),
+        type: "custom",
+        formatter: DetailRowFormatter
+      },
+      { key: "ip", name: getLabel("object_logs.ip"), type: "string", width: 120 }
+    ],
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [getLabel]
+  );
+  const { pagerState, rows, onPageChange, onRowsPerPageChange, clearRows, Refresh } = usePaginate({
+    endPoint: "logs",
+    fireOnChangeParms: false,
+    queryParams
+  });
+  useEffect(() => {
+    clearRows();
+    setQueryParams((oldParms) => ({ ...oldParms, object_id }));
+  }, [object_id]);
+  const onChangeFilter = (_initFilters, rawFilters) => {
+    setQueryParams((oldParms) => ({ ...oldParms, f: rawFilters }));
+    Refresh();
+  };
+  return /* @__PURE__ */ jsxs(
+    Container,
+    {
+      ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: `m4ldatagrid-${dataTestId}` } : {},
+      children: [
+        /* @__PURE__ */ jsx(Actions, { id: "objectLogsActions", children: /* @__PURE__ */ jsx(
+          DynamicFilter,
+          {
+            withAllField: true,
+            onChangeFilters: onChangeFilter,
+            automatic: false,
+            fields: [
+              {
+                name: "user_logs.created_at",
+                dictionaryId: "object_logs.created_at",
+                type: "datetime",
+                multiple: false,
+                presence: "fixed",
+                urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/object_logs/assets/icons/email.svg`
+                // defaultOperand1: startOfMonth(now),
+                // defaultOperand2: endOfDay(new Date()),
+              },
+              {
+                name: "users.email",
+                dictionaryId: "object_logs.email",
+                type: "string",
+                multiple: true,
+                presence: "optional",
+                urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/object_logs/assets/icons/email.svg`
+                // defaultOperand1: startOfMonth(now),
+                // defaultOperand2: endOfDay(new Date()),
+              },
+              {
+                name: "user_logs.log_preview",
+                dictionaryId: "object_logs.log_preview",
+                type: "string",
+                multiple: true,
+                presence: "optional",
+                urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/object_logs/assets/icons/log_preview.svg`
+                // defaultOperand1: startOfMonth(now),
+                // defaultOperand2: endOfDay(new Date()),
+              },
+              {
+                name: "user_logs.log_detail",
+                dictionaryId: "object_logs.log_detail",
+                type: "string",
+                multiple: true,
+                presence: "optional",
+                urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/object_logs/assets/icons/log_detail.svg`
+              }
+            ],
+            initialAppliedFilters: []
+          }
+        ) }),
+        /* @__PURE__ */ jsx(GridWrapper, { id: "GridWrapper", children: /* @__PURE__ */ jsx(
+          DataGrid,
+          {
+            id: "users_logs_list",
+            dataTestId,
+            columns,
+            rows,
+            rowKeyGetter: (row) => row.id,
+            withActions: true,
+            actionsProps: {
+              withPager: true,
+              withLocalFilters: true,
+              pagerOptions: {
+                records: rows.length,
+                totalRecords: pagerState.totalRecords,
+                rowsPerPageOptions: [1, 2, 3, 4, 5, 10, 25],
+                page: pagerState.page,
+                rowsPerPage: pagerState.rowsPerPage,
+                onPageChange,
+                onRowsPerPageChange
+              }
+            }
+          },
+          "users_list_logs"
+        ) })
+      ]
+    }
+  );
+}
+export {
+  ObjectLogs as O
+};

package/components/ObjectLogs/styles.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
-export declare const Container: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const Actions: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const GridWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Container: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Actions: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const GridWrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/ObjectLogs/styles.js

@@ -0,0 +1,35 @@
+import { styled } from "@mui/material/styles";
+const Container = styled("div")(() => ({
+  height: "100%",
+  width: "100%",
+  display: "flex",
+  flexDirection: "column",
+  justifyContent: "flex-start",
+  gap: "4px"
+}));
+const Actions = styled("div")(({ theme }) => ({
+  position: "relative",
+  height: "auto",
+  display: "flex",
+  flexDirection: "row",
+  justifyContent: "flex-start",
+  alignItems: "center",
+  "& .MuiFormControl-root": {
+    flexGrow: 1
+  },
+  [theme.breakpoints.up("sm")]: {
+    "& .MuiFormControl-root:nth-of-type(1)": {
+      marginRight: theme.spacing(3)
+    }
+  }
+}));
+const GridWrapper = styled("div")(() => ({
+  position: "relative",
+  flexGrow: "1",
+  width: "100%"
+}));
+export {
+  Actions as A,
+  Container as C,
+  GridWrapper as G
+};

package/components/PDFViewer/PDFViewer.d.ts

@@ -1,2 +1,5 @@
 import { PDFViewerPros } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare const PDFViewer: (props: PDFViewerPros) => import("react/jsx-runtime").JSX.Element;

package/components/PDFViewer/PDFViewer.js

@@ -0,0 +1,30 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { P as PDFVeiwerRoot } from "./styles.js";
+import { p as pdfviewerUtilityClasses } from "./classes/index.js";
+import { B as Button } from "../mui_extended/Button/Button.js";
+const PDFViewer = (props) => {
+  const { pdfUrl } = props;
+  const handleDownload = async () => {
+    try {
+      const response = await fetch(pdfUrl);
+      const blob = await response.blob();
+      const url = window.URL.createObjectURL(new Blob([blob]));
+      const link = document.createElement("a");
+      link.href = url;
+      link.download = pdfUrl.substring(pdfUrl.lastIndexOf("/") + 1);
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+    } catch (error) {
+      console.error("Error al descargar el PDF:", error);
+    }
+  };
+  const classes = pdfviewerUtilityClasses();
+  return /* @__PURE__ */ jsxs(PDFVeiwerRoot, { className: classes.root, children: [
+    /* @__PURE__ */ jsx("embed", { src: pdfUrl, type: "application/pdf", width: "100%", height: "100%" }),
+    /* @__PURE__ */ jsx(Button, { onClick: handleDownload, variant: "contained", children: "Descargar PDF" })
+  ] });
+};
+export {
+  PDFViewer as P
+};

package/components/PDFViewer/classes/constants.js

@@ -0,0 +1,4 @@
+const componentName = "M4LPDFViewer";
+export {
+  componentName as c
+};

package/components/PDFViewer/classes/index.d.ts

@@ -1,6 +1,9 @@
 import { PDFViewerClassesType } from './types';
 export declare const pdfViewerClasses: PDFViewerClassesType;
 export declare function getPDFViewerUtilityClass(slot: string): string;
+/**
+ * TODO: Documentar
+ */
 export declare const pdfviewerUtilityClasses: () => {
     root: string;
     buttonDownload: string;

package/components/PDFViewer/classes/index.js

@@ -0,0 +1,25 @@
+import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
+import { unstable_composeClasses } from "@mui/base";
+import { c as componentName } from "./constants.js";
+generateUtilityClasses(componentName, [
+  /* elements */
+  "root",
+  "buttonDownload"
+  /* states or variants of elements */
+]);
+function getPDFViewerUtilityClass(slot) {
+  return generateUtilityClass(componentName, slot);
+}
+const pdfviewerUtilityClasses = () => {
+  const slots = {
+    root: ["root"],
+    buttonDownload: ["buttonDownload"]
+  };
+  const composedClasses = unstable_composeClasses(slots, getPDFViewerUtilityClass, {});
+  return {
+    ...composedClasses
+  };
+};
+export {
+  pdfviewerUtilityClasses as p
+};

package/components/PDFViewer/classes/types.d.ts

@@ -4,4 +4,4 @@ export interface PDFViewerClassesType {
     buttonDownload: string;
 }
 export declare type PDFViewerClassesKey = keyof PDFViewerClassesType;
-export declare type Classes = ReturnType<typeof pdfviewerUtilityClasses>;
+export type Classes = ReturnType<typeof pdfviewerUtilityClasses>;

package/components/PDFViewer/index.js

@@ -0,0 +1 @@
+

package/components/PDFViewer/styles.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
-export declare const PDFVeiwerRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const PDFVeiwerRoot: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/PDFViewer/styles.js

@@ -0,0 +1,7 @@
+import { styled } from "@mui/material";
+const PDFVeiwerRoot = styled("div")(({ theme }) => ({
+  ...theme.components?.M4LPDFViewer?.styleOverrides || {}
+}));
+export {
+  PDFVeiwerRoot as P
+};

package/components/PaperForm/PaperForm.d.ts

@@ -1,2 +1,5 @@
 import { PaperFormProps } from './types';
+/**
+ * TODO: Documentar
+ */
 export declare function PaperForm(props: PaperFormProps): import("react/jsx-runtime").JSX.Element;

package/components/PaperForm/PaperForm.js

@@ -0,0 +1,18 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { P as PaperFormRoot, C as Content } from "./styles.js";
+import { H as Header } from "./components/Header.js";
+import { p as paperFormUtilityClasses } from "./classes/index.js";
+function PaperForm(props) {
+  const { urlIcon, title, children, isForm = false } = props;
+  const ownerState = {
+    isForm
+  };
+  const classes = paperFormUtilityClasses(ownerState);
+  return /* @__PURE__ */ jsxs(PaperFormRoot, { className: classes.root, children: [
+    /* @__PURE__ */ jsx(Header, { urlIcon, title, classes }),
+    /* @__PURE__ */ jsx(Content, { className: classes.content, children })
+  ] });
+}
+export {
+  PaperForm as P
+};

package/components/PaperForm/classes/constants.js

@@ -0,0 +1,4 @@
+const componentName = "M4LPaperForm";
+export {
+  componentName as c
+};

package/components/PaperForm/classes/index.d.ts

@@ -2,6 +2,9 @@ import { PaperFormClassesType } from './types';
 import { OwnerState } from '../types';
 export declare const periodClasses: PaperFormClassesType;
 export declare function getPaperFormUtilityClass(slot: string): string;
+/**
+ * TODO: Documentar
+ */
 export declare const paperFormUtilityClasses: (ownerState: OwnerState) => {
     root: string;
     content: string;

package/components/PaperForm/classes/index.js

@@ -0,0 +1,33 @@
+import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
+import { unstable_composeClasses } from "@mui/base";
+import { c as componentName } from "./constants.js";
+generateUtilityClasses(componentName, [
+  /* elements */
+  "root",
+  "headerContainer",
+  "iconTitleContainer",
+  "iconHeaderContainer",
+  "skeletonContainer",
+  /* states or variants of elements */
+  "isForm"
+]);
+function getPaperFormUtilityClass(slot) {
+  return generateUtilityClass(componentName, slot);
+}
+const paperFormUtilityClasses = (ownerState) => {
+  const slots = {
+    root: ["root", ownerState.isForm && "isForm"],
+    headerContainer: ["headerContainer"],
+    iconTitleContainer: ["iconTitleContainer"],
+    iconHeaderContainer: ["iconHeaderContainer"],
+    skeletonContainer: ["skeletonContainer"],
+    content: ["content"]
+  };
+  const composedClasses = unstable_composeClasses(slots, getPaperFormUtilityClass, {});
+  return {
+    ...composedClasses
+  };
+};
+export {
+  paperFormUtilityClasses as p
+};

package/components/PaperForm/classes/types.d.ts

@@ -8,4 +8,4 @@ export interface PaperFormClassesType {
     isForm: string;
 }
 export declare type PaperFormClassesKey = keyof PaperFormClassesType;
-export declare type Classes = ReturnType<typeof paperFormUtilityClasses>;
+export type Classes = ReturnType<typeof paperFormUtilityClasses>;

package/components/PaperForm/components/Header.d.ts

@@ -1,2 +1,5 @@
 import { HeaderProps } from '../types';
+/**
+ * TODO: Documentar
+ */
 export declare const Header: (props: HeaderProps) => import("react/jsx-runtime").JSX.Element;

package/components/PaperForm/components/Header.js

@@ -0,0 +1,19 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useModuleSkeleton } from "@m4l/core";
+import { Skeleton } from "@mui/material";
+import { I as Icon } from "../../Icon/Icon.js";
+import { H as HeaderContainer, I as IconTitleContainer, a as IconHeader, S as SkTPaperFormHeader } from "../styles.js";
+const Header = (props) => {
+  const { urlIcon, title, classes } = props;
+  const isSkeleton = useModuleSkeleton();
+  return /* @__PURE__ */ jsx(HeaderContainer, { id: "Header", className: classes.headerContainer, children: !isSkeleton ? /* @__PURE__ */ jsxs(IconTitleContainer, { className: classes.iconTitleContainer, children: [
+    urlIcon ? /* @__PURE__ */ jsx(IconHeader, { className: classes.iconHeaderContainer, children: /* @__PURE__ */ jsx(Icon, { src: urlIcon }) }) : null,
+    title
+  ] }) : /* @__PURE__ */ jsxs(SkTPaperFormHeader, { className: classes.skeletonContainer, children: [
+    /* @__PURE__ */ jsx(Skeleton, { variant: "circular", width: 16, height: 16 }),
+    /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: 68, height: 14 })
+  ] }) });
+};
+export {
+  Header as H
+};

package/components/PaperForm/index.d.ts

@@ -0,0 +1,2 @@
+export { PaperForm } from './PaperForm';
+export type { PaperFormProps } from './types';

package/components/PaperForm/styles.d.ts

@@ -1,7 +1,6 @@
-/// <reference types="react" />
-export declare const PaperFormRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const HeaderContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const IconTitleContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const IconHeader: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const Content: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const SkTPaperFormHeader: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const PaperFormRoot: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const HeaderContainer: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const IconTitleContainer: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const IconHeader: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Content: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const SkTPaperFormHeader: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;