import { jsx as i } from "react/jsx-runtime";
import { useState as y, useEffect as N } from "react";
import { noop as u } from "es-toolkit/compat";
import S from "../../utils/classNames.js";
import f from "../selects/Select.js";
const o = {
  TABLE: "rioglyph-table-view",
  SINGLE_CARD: "rioglyph-th-list",
  MULTI_CARDS: "rioglyph-split-view"
}, s = (r) => {
  const {
    viewType: l,
    initialViewType: p = "TABLE",
    disabledViewTypes: T = [],
    onViewTypeChange: c = u,
    tableViewTooltipContent: m,
    tableViewLabel: d,
    singleCardViewTooltipContent: w,
    singleCardViewLabel: C,
    multiCardsViewTooltipContent: L,
    multiCardsViewLabel: g,
    disabled: E = !1,
    className: a,
    ...I
  } = r, [V, t] = y(p);
  N(() => {
    l && t(l);
  }, [l]);
  const b = (e) => {
    t(e), c(e);
  }, n = [
    {
      id: "TABLE",
      label: d ?? m ?? "",
      icon: /* @__PURE__ */ i("span", { className: `rioglyph ${o.TABLE}` })
    },
    {
      id: "MULTI_CARDS",
      label: g ?? L ?? "",
      icon: /* @__PURE__ */ i("span", { className: `rioglyph ${o.MULTI_CARDS}` })
    },
    {
      id: "SINGLE_CARD",
      label: C ?? w ?? "",
      icon: /* @__PURE__ */ i("span", { className: `rioglyph ${o.SINGLE_CARD}` })
    }
  ], A = n.filter((e) => !T.includes(e.id)), _ = n.some((e) => e.label), h = S("TableViewToggles", a && a);
  return /* @__PURE__ */ i("div", { ...I, className: h, children: /* @__PURE__ */ i("div", { className: "form-group margin-bottom-0", children: /* @__PURE__ */ i(
    f,
    {
      options: A,
      value: [V],
      onChange: (e) => e && b(e.id),
      disabled: E,
      showSelectedItemIcon: !0,
      pullRight: !0,
      dropdownClassName: _ ? void 0 : "width-auto"
    }
  ) }) });
};
s.VIEW_TYPE_TABLE = "TABLE";
s.VIEW_TYPE_SINGLE_CARD = "SINGLE_CARD";
s.VIEW_TYPE_MULTI_CARDS = "MULTI_CARDS";
export {
  s as default
};
//# sourceMappingURL=TableViewToggles.js.map
