import { jsxs as I, jsx as i } from "@emotion/react/jsx-runtime";
import { forwardRef as $, useRef as x, useState as p, useImperativeHandle as q, useMemo as _, useEffect as J } from "react";
import { useModuleDictionary as Q } from "@m4l/core";
import X from "react-data-grid";
import { ColumnsConfigWrapperStyled as Z, ColumnsConfigDataGridStyled as ee, ColumnsConfigSelColumnsStyled as ne, TableWrapperDataGridStyled as te, ColumnsConfigActiosStyled as oe } from "../../../../../../slots/DataGridSlot.js";
import { DICTIONARY as a } from "../../../../../../dictionary.js";
import { ArrowChevronUpOutlined as ie, ArrowChevronMdUpOutlined as le, ArrowChevronDownOutlined as re, ArrowChevronMdDownOutlined as se, ActionsMultiCheckOutlined as ae, ActionsCheckIndeterminateOutlined as de, ArrowRestoreOutlined as ce } from "@m4l/icons";
import { IconButton as c } from "../../../../../../../extended/mui/IconButton/IconButton.js";
import { ColumnInteractiveCheckFormatter as E } from "../../../../../../formatters/ColumnInteractiveCheckFormatter/formatter.js";
function R(u, w) {
  return u.filter((l) => !l.hidden).map(
    (l) => ({
      key: l.key,
      name: w?.find((h) => h.key === l.key)?.name ?? "",
      visible: l.visible === void 0 ? !0 : l.visible,
      showTitle: l.showTitle === void 0 ? !0 : l.showTitle,
      originalIndex: l.originalIndex,
      originalVisible: l.originalVisible,
      originalShowTitle: l.originalShowTitle
    })
  );
}
const f = (u) => {
  const w = u !== void 0 ? `rdg-cell-align-${u}` : "";
  return {
    cellClass: w,
    headerCellClass: w
  };
}, ue = $(
  (u, w) => {
    const l = x(null), {
      onCloseSettings: h,
      columnsConfig: m,
      onChangeColumnsConfig: N,
      rowHeight: O,
      classes: A,
      size: T,
      columns: k
    } = u, { getLabel: s } = Q(), [L, M] = p(!0), [t, d] = p(
      R(m, k)
    ), [C, G] = p(
      () => /* @__PURE__ */ new Set()
    ), b = x(null);
    q(w, () => ({
      onClickIntro: H,
      current: b.current
    }));
    const V = _(
      () => [
        {
          key: "name",
          name: s(a.SETTINGS_COLUMN_NAME),
          width: 220,
          resizable: !0,
          type: "string",
          ...f("left")
        },
        {
          key: "visible",
          name: s(a.SETTINGS_COLUMN_VISIBLE),
          width: 80,
          type: "boolean",
          renderCell: E,
          ...f("center")
        },
        {
          key: "showTitle",
          name: s(a.SETTINGS_COLUMN_SHOW_TITLE),
          width: 100,
          type: "boolean",
          renderCell: E,
          ...f("center")
        }
      ],
      [s]
    ), D = () => {
      d(t.map((e) => ({ ...e, visible: !0 })));
    }, U = () => {
      d(t.map((e) => ({ ...e, visible: !1 })));
    }, F = () => {
      d(
        t.map((e) => ({
          ...e,
          visible: e.originalVisible,
          showTitle: e.originalShowTitle,
          index: e.originalIndex
        })).sort((e, n) => e.index - n.index)
      );
    };
    J(() => {
      L === !1 && d(R(m, k)), M(!1);
    }, [m]);
    const o = _(() => {
      let e = -1;
      if (C.size !== 1)
        return e;
      const r = C.entries().next().value?.[1];
      return e = t.findIndex((S) => S.key === r), e;
    }, [t, C]), B = () => {
      if (o === -1)
        return -1;
      const e = [...t];
      e.splice(o, 1), e.splice(0, 0, t[o]), l.current?.selectCell({ idx: 0, rowIdx: 0 }), d(e);
    }, W = () => {
      if (o === -1)
        return -1;
      const e = [...t];
      e.splice(o, 1), e.splice(e.length, 0, t[o]), l.current?.selectCell({ idx: 0, rowIdx: e.length - 1 }), d(e);
    }, y = (e) => {
      if (o === -1)
        return -1;
      const n = [...t], r = n[o];
      n.splice(o, 1), n.splice(o + e, 0, r), l.current?.selectCell({
        idx: 0,
        rowIdx: o + e
      }), d(n);
    }, z = (e) => {
      const n = t.findIndex((r) => r.key === e);
      if (n > -1)
        return {
          visible: t[n].visible,
          showTitle: t[n].showTitle
        };
    }, g = (e) => {
      const n = t.findIndex((r) => r.key === e.key);
      return n > -1 ? n : m.findIndex(
        (r) => r.key === e.key
      );
    }, H = () => {
      const e = m.map((n) => {
        const r = { ...n };
        if (!n.hidden) {
          const S = z(n.key);
          S && (r.visible = S.visible, r.showTitle = S.showTitle);
          const v = t.findIndex(
            (Y) => Y.key === n.key
          );
          v > -1 && (r.index = v);
        }
        return r;
      }).sort((n, r) => g(n) - g(r));
      N(e), h();
    }, j = () => {
    }, K = (e) => {
      d(e);
    }, P = ({ row: e }) => {
      if (C.has(e.key))
        return;
      const n = /* @__PURE__ */ new Set([e.key]);
      G(n);
    };
    return /* @__PURE__ */ I(Z, { ownerState: {}, ref: b, children: [
      /* @__PURE__ */ I(ee, { ownerState: {}, children: [
        /* @__PURE__ */ i(ne, { ownerState: { size: T }, children: s(a.SETTINGS_SEL_COLUMNS) }),
        /* @__PURE__ */ i(
          te,
          {
            className: A?.tableWrapperDataGrid,
            ownerState: { size: T },
            children: /* @__PURE__ */ i(
              X,
              {
                ref: l,
                rowHeight: O,
                columns: V,
                rows: t,
                onRowsChange: K,
                selectedRows: C,
                onSelectedRowsChange: j,
                onCellClick: P,
                rowKeyGetter: (e) => e.key,
                defaultColumnOptions: { resizable: !0, sortable: !0 }
              }
            )
          }
        )
      ] }),
      /* @__PURE__ */ I(oe, { ownerState: {}, children: [
        /* @__PURE__ */ i(
          c,
          {
            tooltip: s(a.SETTINGS_MOVE_FIRST),
            onClick: B,
            "aria-label": "move first place",
            disabled: o < 1,
            icon: /* @__PURE__ */ i(ie, {})
          }
        ),
        /* @__PURE__ */ i(
          c,
          {
            tooltip: s(a.SETTINGS_MOVE_UP),
            onClick: () => y(-1),
            "aria-label": "move up place",
            disabled: o < 1,
            icon: /* @__PURE__ */ i(le, {})
          }
        ),
        /* @__PURE__ */ i(
          c,
          {
            tooltip: s(a.SETTINGS_MOVE_LAST),
            onClick: W,
            "aria-label": "move last place",
            disabled: o === t.length - 1 || o === -1,
            icon: /* @__PURE__ */ i(re, {})
          }
        ),
        /* @__PURE__ */ i(
          c,
          {
            tooltip: s(a.SETTINGS_MOVE_DOWN),
            onClick: () => y(1),
            "aria-label": "move down place",
            disabled: o === t.length - 1 || o === -1,
            icon: /* @__PURE__ */ i(se, {})
          }
        ),
        /* @__PURE__ */ i(
          c,
          {
            tooltip: s(a.SETTINGS_VISIBLE_ALL),
            onClick: D,
            "aria-label": "check visible all",
            icon: /* @__PURE__ */ i(ae, {})
          }
        ),
        /* @__PURE__ */ i(
          c,
          {
            tooltip: s(a.SETTINGS_NO_VISIBLE_ALL),
            onClick: U,
            "aria-label": "un check all",
            icon: /* @__PURE__ */ i(de, {})
          }
        ),
        /* @__PURE__ */ i(
          c,
          {
            tooltip: s(a.SETTINGS_RESTORE),
            onClick: F,
            "aria-label": "Restore columns",
            icon: /* @__PURE__ */ i(ce, {})
          }
        )
      ] })
    ] });
  }
);
ue.displayName = "ListViewColumnsConfig";
export {
  ue as ColumnsConfig
};
