import { jsxs as h, jsx as r } from "@emotion/react/jsx-runtime";
import { useAreasStore as o } from "../../../../hooks/useAreas/index.js";
import { shallow as l } from "zustand/shallow";
import { useModuleDictionary as f, useEnvironment as C } from "@m4l/core";
import { ICONS as m } from "../../../../icons.js";
import { useMemo as b } from "react";
import { getAreasDictionary as I, AREAS_DICCTIONARY as y } from "../../../../dictionary.js";
import { ChipMobile as S } from "./subcomponents/ChipMobile/ChipMobile.js";
import { AreaChipMobileRootStyled as g, AddAreasMobileContainerStyled as $, MenuActionsAreaChipMobileStyled as w, ButtonAddAreaStyled as M } from "../../slots/AreasAdminSlots.js";
const L = () => {
  const t = o(
    (e) => e.areasIds.map((d) => ({ id: d, name: e.hashAreas[d].name })),
    l
  ), { selectArea: p } = o((e) => e.areasActions), n = o((e) => e.currentAreaId, l), { addArea: A } = o((e) => e.areasActions, l), { getLabel: u } = f(), a = t.find((e) => e.id === n), { host_static_assets: i, environment_assets: s } = C(), c = b(() => t.length === 0 ? [
    {
      type: "menuItem",
      startIcon: `${i}/${s}/frontend/components/areas/assets/icons/${m.CHECK}`,
      onClick: () => {
      },
      label: "No hay Áreas",
      disabled: !0
    }
  ] : t.map((e) => ({
    type: "menuItem",
    onClick: () => p(e.id),
    label: e.name,
    selected: e.id === n
  })), [t, n]);
  return /* @__PURE__ */ h(g, { "data-testid": "area-chip-mobile", ownerState: {}, children: [
    c.length >= 0 ? /* @__PURE__ */ r($, { ownerState: {}, children: /* @__PURE__ */ r(
      w,
      {
        ownerState: {},
        urlIcon: `${i}/${s}/frontend/components/areas/assets/icons/${m.CHEVRON_DOWN}`,
        arrowType: "no-arrow",
        marginTop: "12px!important",
        marginLeft: "14px!important",
        anchorOrigin: { vertical: "bottom", horizontal: "right" },
        transformOrigin: { vertical: "top", horizontal: "right" },
        menuActions: c,
        endListElement: /* @__PURE__ */ r(
          M,
          {
            color: "primary",
            ownerState: {},
            onClick: () => {
              A();
            },
            variant: "contained",
            endIcon: `${i}/${s}/frontend/components/areas/assets/icons/${m.ADD_AREA}`,
            label: u(I(y.area_add_new))
          }
        )
      }
    ) }) : null,
    a ? /* @__PURE__ */ r(
      S,
      {
        areaId: a.id,
        selected: !0,
        disabled: !0
      },
      a.id
    ) : null
  ] });
};
export {
  L as AreaChipMobile
};
