@m4l/components 9.1.93 → 9.1.94

package/components/WindowBase/types.d.ts

@@ -8,7 +8,7 @@ import { ComponentPalletColor, Sizes } from '@m4l/styles';
  * Type representing a single action in the `WindowBase` component.
  * @author cesar - automatic
  * @createdAt 2024-12-23 09:48:25 - automatic
- * @updatedAt 2025-01-31 08:23:27 - automatic
+ * @updatedAt 2025-02-04 15:44:12 - automatic
  * @updatedUser cesar - automatic
  */
 export interface WindowBaseAction {

package/components/areas/components/AreasAdmin/AreasAdmin.d.ts

@@ -0,0 +1,13 @@
+import { AreasAdminProps } from './types';
+/**
+ * AreasAdmin
+ * Componente para administrar áreas.
+ * Este componente permite al usuario administrar las áreas disponibles,
+ * seleccionar un área específica y agregar nuevas áreas.
+ * Utiliza hooks como useAreasStore, useEnvironment, useModuleDictionary.
+ * @author cesar - automatic
+ * @createdAt 2025-01-24 09:29:33 - automatic
+ * @updatedAt 2025-02-04 09:25:18 - automatic
+ * @updatedUser cesar - automatic
+ */
+export declare const AreasAdmin: (props: AreasAdminProps) => import("react/jsx-runtime").JSX.Element | null;

package/components/areas/components/AreasAdmin/AreasAdmin.js

@@ -0,0 +1,163 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { u as useAreasStore } from "../../hooks/useAreas/index.js";
+import { useEnvironment, useModuleDictionary } from "@m4l/core";
+import clsx from "clsx";
+import { A as AreaChip } from "./subcomponents/AreaChip/AreaChip.js";
+import { shallow } from "zustand/shallow";
+import { I as ICONS } from "../../icons.js";
+import { S as ScrollBar } from "../../../ScrollBar/index.js";
+import { A as AreaChipMobile } from "./subcomponents/AreaChipMobile/AreaChipMobile.js";
+import { useRef } from "react";
+import { g as getAreasDictionary, A as AREAS_DICCTIONARY } from "../../dictionary.js";
+import { A as AreasAdminRootStyled, a as AreasAdminContentStyled, b as AreasContainerChipIconStyled, c as AreasContainerContentChipsStyled, I as IconButtonAddAreaStyled, d as AreaContentChipStyled, C as ContainerAdminWindowsStyled } from "./slots/AreasAdminSlots.js";
+import { useIsMobile } from "@m4l/graphics";
+import { A as AREAS_ADMIN_KEY_COMPONENT } from "./constants.js";
+import { a as getComponentSlotRoot } from "../../../../utils/getComponentSlotRoot.js";
+import { g as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
+import { u as useComponentSize } from "../../../../hooks/useComponentSize/useComponentSize.js";
+import { T as Typography } from "../../../mui_extended/Typography/Typography.js";
+import { A as AreasAdminSlots } from "./slots/AreasAdminEnum.js";
+import { M as MenuActions } from "../../../MenuActions/MenuActions.js";
+const AreasAdmin = (props) => {
+  const {
+    color = "primary",
+    size = "medium",
+    className,
+    dataTestId,
+    ...others
+  } = props;
+  const isMobile = useIsMobile();
+  const { currentSize } = useComponentSize(size);
+  const normalizedSize = currentSize === "large" ? "medium" : currentSize;
+  const areas = useAreasStore((state) => state.areasIds ?? [], shallow);
+  const currentAreaId = useAreasStore((state) => state.currentAreaId, shallow);
+  const status = useAreasStore((state) => state.ownerState.status);
+  const areasLength = useAreasStore((state) => state.areasIds.length);
+  const { addArea } = useAreasStore((state) => state.areasActions, shallow);
+  const { maximizeLayout } = useAreasStore((state) => state.areaActions);
+  const maximizedId = useAreasStore(
+    (state) => state.hashAreas[currentAreaId] ? state.hashAreas[currentAreaId].maximizedId : false,
+    shallow
+  );
+  const windowsLayouts = useAreasStore(
+    (state) => state.hashAreas[state.currentAreaId]?.layoutItemsIds?.filter((li) => state.hashWindows[li].emergeType === "layout")?.map((lim) => {
+      const w = state.hashWindows[lim];
+      return {
+        i: w.windowId,
+        url_icon: w.iconUrl,
+        title: w.title
+      };
+    }) ?? [],
+    shallow
+  );
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const { getLabel } = useModuleDictionary();
+  const divRef = useRef(null);
+  const divRefOut = useRef(null);
+  if (status !== "loaded") {
+    return null;
+  }
+  const ownerState = {
+    isMobile,
+    color,
+    size: normalizedSize
+  };
+  const onTouched = (layoutId) => {
+    maximizeLayout(currentAreaId, layoutId);
+  };
+  const menuActions = windowsLayouts.map((element) => {
+    return {
+      type: "menuItem",
+      onClick: () => onTouched(element.i),
+      label: element.title,
+      urlIcon: element.url_icon,
+      checkable: true,
+      checked: maximizedId === element.i
+    };
+  });
+  return /* @__PURE__ */ jsx(
+    AreasAdminRootStyled,
+    {
+      className: clsx(getComponentSlotRoot(AREAS_ADMIN_KEY_COMPONENT), className),
+      ...getPropDataTestId(AREAS_ADMIN_KEY_COMPONENT, AreasAdminSlots.root, dataTestId),
+      role: "areas-admin-role",
+      ownerState,
+      ref: divRefOut,
+      ...others,
+      children: /* @__PURE__ */ jsx(
+        AreasAdminContentStyled,
+        {
+          size: normalizedSize,
+          ownerState: {},
+          role: "presentation",
+          ref: divRef,
+          children: /* @__PURE__ */ jsx(
+            AreasContainerChipIconStyled,
+            {
+              size: normalizedSize,
+              ownerState: {},
+              children: /* @__PURE__ */ jsx(
+                AreasContainerContentChipsStyled,
+                {
+                  size: normalizedSize,
+                  ownerState: {},
+                  children: !isMobile ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(ScrollBar, { children: /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx(
+                        IconButtonAddAreaStyled,
+                        {
+                          "aria-label": "Agregar área",
+                          size: normalizedSize,
+                          variant: "contained",
+                          ownerState,
+                          src: `${host_static_assets}/${environment_assets}/frontend/components/areas/assets/icons/${ICONS.ADD_AREA}`,
+                          onClick: addArea,
+                          tooltip: getLabel(getAreasDictionary(AREAS_DICCTIONARY.area_add_new))
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        AreaContentChipStyled,
+                        {
+                          size: normalizedSize,
+                          ownerState: {},
+                          children: Array.isArray(areas) && areas.length > 0 && areas.map((areaId) => /* @__PURE__ */ jsx(
+                            AreaChip,
+                            {
+                              size: normalizedSize,
+                              color,
+                              areaId,
+                              selected: areaId === currentAreaId,
+                              disabled: areasLength === 1
+                            },
+                            areaId
+                          ))
+                        }
+                      )
+                    ] }) }),
+                    maximizedId && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(ContainerAdminWindowsStyled, { size: normalizedSize, ownerState, children: [
+                      /* @__PURE__ */ jsx(Typography, { size: normalizedSize, children: getLabel(getAreasDictionary(AREAS_DICCTIONARY.label_window)) }),
+                      /* @__PURE__ */ jsx(
+                        MenuActions,
+                        {
+                          size: normalizedSize,
+                          icon: `${host_static_assets}/${environment_assets}/frontend/components/areas_admin/assets/icons/${ICONS.PENDING_ORDER}`,
+                          arrowType: "no-arrow",
+                          anchorOrigin: { vertical: "bottom", horizontal: "right" },
+                          transformOrigin: { vertical: "top", horizontal: "left" },
+                          menuActions
+                        }
+                      )
+                    ] }) })
+                  ] }) : /* @__PURE__ */ jsx(AreaChipMobile, {})
+                }
+              )
+            }
+          )
+        }
+      )
+    }
+  );
+};
+export {
+  AreasAdmin as A
+};

package/components/areas/components/AreasAdmin/AreasAdmin.styles.d.ts

@@ -0,0 +1,2 @@
+import { AreasAdminStyles } from './types';
+export declare const areasAdminStyles: AreasAdminStyles;

package/components/areas/components/AreasAdmin/AreasAdmin.styles.js

@@ -0,0 +1,264 @@
+import { g as getHeightSizeStyles } from "../../../../utils/getHeightSizeStyles.js";
+const areasAdminStyles = {
+  /**
+   * Root areas admin Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-22 17:19:48 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  root: ({ theme }) => ({
+    width: "100%",
+    display: "flex",
+    flexDirection: "row",
+    "& .simplebar-content": {
+      display: "flex",
+      flexDirection: "row",
+      gap: theme.vars.size.baseSpacings.sp2,
+      alignItems: "center"
+    }
+  }),
+  /**
+   * Root areas admin content Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-25 19:41:41 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  areasAdminContent: () => ({
+    display: "flex",
+    flexDirection: "row",
+    width: "100%"
+  }),
+  /**
+   * Root container admin windows Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-25 19:41:41 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  containerAdminWindows: ({ theme }) => ({
+    display: "flex",
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.vars.size.baseSpacings.sp2
+  }),
+  areaContainerChipIcon: () => ({
+    width: "100%"
+  }),
+  /**
+   * Root area container content chips
+   * @author cesar - automatic
+   * @createdAt 2025-01-24 09:29:33 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  areaContainerContentChips: () => ({
+    display: "flex",
+    flexDirection: "row"
+  }),
+  /**
+   * Root area content chip Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-24 09:29:33 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  areaContentChip: ({ theme }) => ({
+    height: "100%",
+    display: "flex",
+    flexDirection: "row",
+    gap: theme.vars.size.baseSpacings.sp2,
+    alignItems: "center"
+  }),
+  /**
+   * Root area chip Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-24 09:29:33 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  areaChipRoot: () => ({
+    width: "100%",
+    display: "flex",
+    flexDirection: "row"
+  }),
+  /**
+   * Root area container chip edit button
+   * @author cesar - automatic
+   * @createdAt 2025-01-24 09:29:33 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  areaContainerChipEditButton: () => ({
+    display: "flex",
+    flexDirection: "row"
+  }),
+  /**
+   * Chip areas Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-24 09:29:33 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  chipAreas: ({ theme, ownerState }) => ({
+    borderRadius: theme.vars.size.borderRadius.r1,
+    ...getHeightSizeStyles(
+      theme.generalSettings.isMobile,
+      ownerState.size || "small",
+      "action"
+    ),
+    "&:hover > .M4LAreasAdmin-menuActionsChip": {
+      opacity: 1,
+      pointerEvents: "auto"
+    }
+  }),
+  /**
+   * Icon button add area Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-24 12:34:21 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  iconButtonAddArea: ({ theme, ownerState }) => ({
+    borderRadius: theme.vars.size.borderRadius.r1,
+    ...getHeightSizeStyles(
+      theme.generalSettings.isMobile,
+      ownerState.size || "small",
+      "action"
+    )
+  }),
+  /**
+   * Menu actions Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-25 19:41:41 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  menuActionsChip: () => ({
+    opacity: 0,
+    pointerEvents: "none",
+    transition: "opacity 0.2s ease-in-out"
+  }),
+  /**
+   * Root area chip mobile Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-26 19:29:17 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  areaChipMobileRoot: ({ theme }) => ({
+    display: "flex",
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.vars.size.baseSpacings.sp1
+  }),
+  /**
+   * Root chip mobile Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-26 19:29:17 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  chipMobileRoot: ({ theme }) => ({
+    display: "flex",
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.vars.size.baseSpacings.sp1
+  }),
+  /**
+   * Root chip mobile content Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-26 19:29:17 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  chipMobileContent: ({ theme }) => ({
+    display: "flex",
+    flexDirection: "row",
+    alignItems: "center",
+    borderRadius: theme.vars.size.borderRadius.r1
+  }),
+  /**
+   * Name area chip mobile Styles
+   * @author cesar - automatic
+   * @createdAt 2025-01-27 12:58:18 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  nameChipMobile: ({ theme }) => ({
+    padding: theme.vars.size.baseSpacings.sp1
+  }),
+  /**
+   * Root add areas mobile container
+   * @author cesar - automatic
+   * @createdAt 2025-01-26 19:29:17 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  addAreasMobileContainer: () => ({
+    display: "flex",
+    flexDirection: "column"
+  }),
+  /**
+   * Root menu actions area chip mobile
+   * @author cesar - automatic
+   * @createdAt 2025-01-26 19:29:17 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  menuActionsAreaChipMobile: ({ theme }) => ({
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    alignContent: "center",
+    borderRadius: theme.vars.size.borderRadius.r1,
+    gap: theme.vars.size.baseSpacings.sp1
+  }),
+  buttonAddArea: ({ theme }) => ({
+    color: theme.vars.palette.primary.contrastText
+  }),
+  /**
+   * Root edit area chip container
+   * @author cesar - automatic
+   * @createdAt 2025-01-26 22:11:32 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  editAreaChipContainer: ({ theme }) => ({
+    borderRadius: theme.vars.size.borderRadius.r1,
+    display: "flex",
+    flexDirection: "column"
+  }),
+  /**
+   * Root edit area header
+   * @author cesar - automatic
+   * @createdAt 2025-01-26 22:11:32 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  editAreaHeader: ({ theme }) => ({
+    display: "flex",
+    padding: theme.vars.size.baseSpacings.sp0,
+    flexDirection: "column",
+    justifyContent: "center",
+    gap: theme.vars.size.baseSpacings["sp0-5"],
+    alignSelf: "stretch"
+  }),
+  /**
+   * Root edit area chip mobile container
+   * @author cesar - automatic
+   * @createdAt 2025-01-26 22:11:32 - automatic
+   * @updatedAt 2025-02-04 09:17:16 - automatic
+   * @updatedUser cesar - automatic
+   */
+  editAreaChipMobileContainer: ({ theme }) => ({
+    borderRadius: theme.vars.size.borderRadius.r1,
+    display: "flex",
+    flexDirection: "column",
+    width: "100%"
+  })
+};
+export {
+  areasAdminStyles as a
+};

package/components/areas/components/AreasAdmin/classes/index.js

@@ -2,7 +2,7 @@ import { generateUtilityClasses } from "@mui/material";
 import { unstable_composeClasses } from "@mui/base";
 import { g as getComponentUtilityClass } from "../../../../../utils/index.js";
 import { A as AREAS_ADMIN_CLASS_NAME } from "../../../constants.js";
-const areasAdminClasses = generateUtilityClasses(
+generateUtilityClasses(
   AREAS_ADMIN_CLASS_NAME,
   [
     /* elements */
@@ -65,6 +65,5 @@ const useAreasAdminUtilityClasses = (ownerState) => {
   return unstable_composeClasses(slots, getComponentUtilityClass(AREAS_ADMIN_CLASS_NAME), {});
 };
 export {
-  areasAdminClasses as a,
   useAreasAdminUtilityClasses as u
 };

package/components/areas/components/AreasAdmin/constants.d.ts

@@ -0,0 +1 @@
+export declare const AREAS_ADMIN_KEY_COMPONENT = "M4LAreasAdmin";

package/components/areas/components/AreasAdmin/constants.js

@@ -0,0 +1,4 @@
+const AREAS_ADMIN_KEY_COMPONENT = "M4LAreasAdmin";
+export {
+  AREAS_ADMIN_KEY_COMPONENT as A
+};

package/components/areas/components/AreasAdmin/slots/AreasAdminEnum.d.ts

@@ -0,0 +1,23 @@
+export declare enum AreasAdminSlots {
+    root = "root",
+    areasAdminContent = "areasAdminContent",
+    areaContainerChipIcon = "areaContainerChipIcon",
+    areaContainerContentChips = "areaContainerContentChips",
+    areaContentChip = "areaContentChip",
+    containerAdminWindows = "containerAdminWindows",
+    areaChipRoot = "areaChipRoot",
+    areaContainerChipEditButton = "areaContainerChipEditButton",
+    menuActionsChip = "menuActionsChip",
+    editAreaChipContainer = "editAreaChipContainer",
+    editAreaHeader = "editAreaHeader",
+    areaChipMobileRoot = "areaChipMobileRoot",
+    addAreasMobileContainer = "addAreasMobileContainer",
+    menuActionsAreaChipMobile = "menuActionsAreaChipMobile",
+    buttonAddArea = "buttonAddArea",
+    chipMobileRoot = "chipMobileRoot",
+    chipMobileContent = "chipMobileContent",
+    editAreaChipMobileContainer = "editAreaChipMobileContainer",
+    nameChipMobile = "nameChipMobile",
+    chipAreas = "chipAreas",
+    iconButtonAddArea = "iconButtonAddArea"
+}

package/components/areas/components/AreasAdmin/slots/AreasAdminEnum.js

@@ -0,0 +1,27 @@
+var AreasAdminSlots = /* @__PURE__ */ ((AreasAdminSlots2) => {
+  AreasAdminSlots2["root"] = "root";
+  AreasAdminSlots2["areasAdminContent"] = "areasAdminContent";
+  AreasAdminSlots2["areaContainerChipIcon"] = "areaContainerChipIcon";
+  AreasAdminSlots2["areaContainerContentChips"] = "areaContainerContentChips";
+  AreasAdminSlots2["areaContentChip"] = "areaContentChip";
+  AreasAdminSlots2["containerAdminWindows"] = "containerAdminWindows";
+  AreasAdminSlots2["areaChipRoot"] = "areaChipRoot";
+  AreasAdminSlots2["areaContainerChipEditButton"] = "areaContainerChipEditButton";
+  AreasAdminSlots2["menuActionsChip"] = "menuActionsChip";
+  AreasAdminSlots2["editAreaChipContainer"] = "editAreaChipContainer";
+  AreasAdminSlots2["editAreaHeader"] = "editAreaHeader";
+  AreasAdminSlots2["areaChipMobileRoot"] = "areaChipMobileRoot";
+  AreasAdminSlots2["addAreasMobileContainer"] = "addAreasMobileContainer";
+  AreasAdminSlots2["menuActionsAreaChipMobile"] = "menuActionsAreaChipMobile";
+  AreasAdminSlots2["buttonAddArea"] = "buttonAddArea";
+  AreasAdminSlots2["chipMobileRoot"] = "chipMobileRoot";
+  AreasAdminSlots2["chipMobileContent"] = "chipMobileContent";
+  AreasAdminSlots2["editAreaChipMobileContainer"] = "editAreaChipMobileContainer";
+  AreasAdminSlots2["nameChipMobile"] = "nameChipMobile";
+  AreasAdminSlots2["chipAreas"] = "chipAreas";
+  AreasAdminSlots2["iconButtonAddArea"] = "iconButtonAddArea";
+  return AreasAdminSlots2;
+})(AreasAdminSlots || {});
+export {
+  AreasAdminSlots as A
+};

package/components/areas/components/AreasAdmin/slots/AreasAdminSlots.d.ts

@@ -0,0 +1,63 @@
+export declare const AreasAdminRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const AreasContainerChipIconStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const AreasContainerContentChipsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const AreaContentChipStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const AreaChipRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const AreaContainerChipEditButtonStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const AreasAdminContentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ChipAreasStyled: import('@emotion/styled').StyledComponent<Pick<import('../../../../Chip/types').ChipProps & import('react').RefAttributes<HTMLDivElement>, keyof import('react').RefAttributes<HTMLDivElement> | keyof import('../../../../Chip/types').ChipProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+export declare const IconButtonAddAreaStyled: import('@emotion/styled').StyledComponent<Pick<Omit<import('../../../../mui_extended/IconButton/types').IconButtonProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>, "children" | "value" | "title" | "component" | "size" | "name" | "id" | "type" | "selected" | "action" | "hidden" | "content" | "style" | "icon" | "tooltip" | "disabled" | "variant" | "translate" | "sx" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "lang" | "nonce" | "slot" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "placement" | "form" | "src" | "rotationAngle" | "tooltipContent" | "instaceDataTestId" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "componentPaletteColor" | "badgeContent" | "dictionaryTooltipId" | keyof import('react').RefAttributes<HTMLButtonElement>> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+export declare const MenuActionsChipStyled: import('@emotion/styled').StyledComponent<Pick<import('../../../../MenuActions/types').MenuActionsProps, keyof import('../../../../MenuActions/types').MenuActionsProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+export declare const ContainerAdminWindowsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const AreaChipMobileRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ChipMobileRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ChipMobileContentStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const AddAreasMobileContainerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const MenuActionsAreaChipMobileStyled: import('@emotion/styled').StyledComponent<Pick<import('../../../../MenuActions/types').MenuActionsProps, keyof import('../../../../MenuActions/types').MenuActionsProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+export declare const ButtonAddAreaStyled: import('@emotion/styled').StyledComponent<Pick<Omit<import('../../../../mui_extended/Button').ButtonProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>, "children" | "value" | "title" | "component" | "size" | "name" | "id" | "type" | "action" | "hidden" | "color" | "content" | "style" | "disabled" | "variant" | "translate" | "sx" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "lang" | "nonce" | "slot" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "form" | "label" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "href" | "startIcon" | "endIcon" | "skeletonWidth" | "disableElevation" | "fullWidth" | keyof import('react').RefAttributes<HTMLButtonElement>> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, {}, {}>;
+export declare const EditAreaChipContainerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const EditAreaHeaderStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const EditAreaChipMobileContainerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const NameChipMobileStyled: import('@emotion/styled').StyledComponent<Pick<import('../../../../mui_extended/Typography/types').TypographyProps, keyof import('../../../../mui_extended/Typography/types').TypographyProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Record<string, unknown> & {
+    ownerState: Partial<import('../types').AreasAdminOwnerState> & Record<string, unknown>;
+}, {}, {}>;