import { jsx as i, jsxs as Z } from "@emotion/react/jsx-runtime";
import { useEnvironment as b, useModuleSkeleton as ee, useModuleDictionary as te } from "@m4l/core";
import { useTheme as re } from "@mui/material";
import { useForkRef as ne } from "@mui/material/utils";
import oe from "clsx";
import se, { forwardRef as ce, useMemo as p, useState as ae, useRef as z, useCallback as S, useEffect as L } from "react";
import { useComponentSize as ie } from "../../../../hooks/useComponentSize/index.js";
import { ArrowDownStyled as le, AdormentStyled as ue, SelectRootStyled as me, SkeletonSelectStyled as fe, MenuItemListStyled as Se, MenuItemNoOptionStyled as de, LabelPlaceholerStyled as Ae, RenderValueContainerStyled as T, RenderValueTypography as pe } from "./slots/SelectSlots.js";
import { ICON_ARROW_DOWN as we, SELECT_CLASSES as u, SELECT_KEY_COMPONENT as he } from "./constants.js";
import { SELECT_DICTIONARY as ye } from "./dictionary.js";
import { getPropDataTestId as Ce } from "../../../../test/getNameDataTestId.js";
import { selectStyles as k } from "./Select.styles.js";
import { Chip as ge } from "../../../Chip/Chip.js";
import { SelectSlots as Ie } from "./slots/SelectEnum.js";
const Be = ce(
  function({
    value: I = null,
    options: l = [],
    multiple: s,
    onChange: d,
    size: P = "medium",
    disabled: r = !1,
    error: w = !1,
    variant: h = "outlined",
    placeholder: V,
    className: v,
    dataTestId: M,
    readOnly: n = !1,
    ...N
  }, _) {
    const { currentSize: y } = ie(P), { host_static_assets: x, environment_assets: j } = b(), B = ee(), { getLabel: K } = te(), a = y === "small" || y === "medium" ? y : "medium", R = `${x}/${j}/${we}`, o = p(() => I, [I]), [m, A] = ae(!1), D = z(null), E = z(null), W = re(), f = p(() => ({
      size: a,
      disabled: r,
      error: w,
      variant: h,
      multiple: s,
      readOnly: n
    }), [a, r, w, h, s, n]), $ = S((e) => {
      if (n || r)
        return;
      const t = e.target.value;
      if (d)
        if (s) {
          if (Array.isArray(t)) {
            const c = l.filter((g) => t.includes(g.id));
            d(c);
          }
        } else {
          const c = l.find((g) => g.id === t);
          c && d(c);
        }
    }, [s, d, l, n, r]), F = S((e) => {
      if (!(n || r) && s && Array.isArray(o)) {
        const t = l.filter((c) => c.id !== e.id && o.includes(c.id));
        d?.(t);
      }
    }, [s, o, d, l, n, r]), C = S(() => {
      if (!(r || n)) {
        if (s) {
          m || A(!0);
          return;
        }
        A(!m);
      }
    }, [r, n, s, m]), Y = p(() => () => /* @__PURE__ */ i(
      le,
      {
        ownerState: { ...f },
        icon: R,
        disabled: r || n,
        size: a,
        onClick: C,
        rotationAngle: m ? 180 : 0
      }
    ), [f, R, r, n, a, m, C]), q = S((e) => e ? typeof e == "string" ? /* @__PURE__ */ i(
      ue,
      {
        src: e,
        size: a,
        className: u.adorment,
        disabled: r
      }
    ) : se.isValidElement(e) ? e : null : null, [r, a]), H = S((e) => {
      e.stopPropagation();
    }, []), G = S((e) => {
      e.stopPropagation();
    }, []), J = () => {
      if (o == null || s && Array.isArray(o) && o.length === 0)
        return /* @__PURE__ */ i(Ae, { ownerState: { disabled: r, readOnly: n }, variant: "bodyStandard", color: "text.disabled", children: V });
      if (s) {
        if (!Array.isArray(o))
          return null;
        const e = o.map((t) => l.find((c) => c.id === t));
        return /* @__PURE__ */ i(
          T,
          {
            ref: E,
            ownerState: { ...f },
            className: u.renderValueContainer,
            children: e.map((t) => t ? /* @__PURE__ */ i(
              ge,
              {
                size: a,
                label: t.label,
                description: t.description,
                startIcon: t.selectedStartAdornment ?? t.startAdornment,
                endIcon: t.endAdornment,
                opacity: !0,
                onDeleted: n || r ? void 0 : () => F(t),
                iconButtonProps: { onMouseDown: H, onKeyDown: G }
              },
              t.id
            ) : null)
          }
        );
      } else {
        const e = l.find((t) => String(t.id) === String(o));
        return e ? /* @__PURE__ */ Z(T, { ownerState: { ...f }, className: u.renderValueContainer, children: [
          (e.selectedStartAdornment ?? e.startAdornment) && q(e.selectedStartAdornment ?? e.startAdornment),
          /* @__PURE__ */ i(pe, { ownerState: { disabled: r, readOnly: n }, variant: "bodyStandard", color: "text.primary", size: a, className: u.renderValueTypography, children: e.label })
        ] }) : "";
      }
    }, O = S(() => {
      r || n || A(!0);
    }, [r, n]), Q = S(() => {
      A(!1);
    }, []);
    L(() => {
      if (!s || !Array.isArray(o))
        return;
      const e = E.current;
      e && requestAnimationFrame(() => {
        e.scrollTop = e.scrollHeight;
      });
    }, [s, o]), L(() => {
      n && m && A(!1);
    }, [n, m]);
    const U = p(() => me(), []), X = ne(D, _);
    return B ? /* @__PURE__ */ i(fe, { ownerState: { ...f }, className: u.skeletonSelect }) : /* @__PURE__ */ i(
      U,
      {
        ...N,
        ...Ce(he, Ie.root, M),
        ref: X,
        className: oe(u.root, u[h], v),
        ownerState: { ...f },
        IconComponent: Y,
        multiple: s,
        value: o ?? (s ? [] : ""),
        onChange: $,
        fullWidth: !0,
        disabled: r,
        error: w,
        renderValue: J,
        open: n ? !1 : m,
        native: !1,
        onOpen: O,
        onClose: Q,
        onClick: C,
        displayEmpty: !0,
        inputProps: {
          ...N.inputProps,
          readOnly: n
        },
        MenuProps: {
          disableScrollLock: !0,
          anchorOrigin: {
            vertical: "bottom",
            horizontal: "left"
          },
          transformOrigin: {
            vertical: "top",
            horizontal: "left"
          },
          sx: {
            ...typeof k?.menuPaper == "function" ? k.menuPaper({ theme: W, selectRef: D }) : {}
          }
        },
        children: l.length > 0 ? l.map(
          (e) => {
            const t = s ? Array.isArray(o) && o.some((c) => c === e.id) : o === e.id;
            return /* @__PURE__ */ i(
              Se,
              {
                className: u.menuItem,
                ownerState: { ...f },
                size: a,
                value: e.id,
                disabled: r,
                selected: t,
                label: e.label,
                description: e.description,
                startAdornment: e.startAdornment,
                endAdornment: e.endAdornment
              },
              String(e.id)
            );
          }
        ) : /* @__PURE__ */ i(
          de,
          {
            ownerState: { ...f },
            className: u.menuItemNoOptions,
            size: a,
            label: K(ye.noOptions),
            disabled: !0
          }
        )
      }
    );
  }
);
export {
  Be as Select
};
