import { jsxs as i, jsx as t } from "react/jsx-runtime";
import { noop as m } from "es-toolkit/compat";
import x from "../../../utils/classNames.js";
import N from "../../slider/Slider.js";
const j = (r) => {
  const {
    width: e = 0,
    defaultWidth: d = 0,
    maxWidth: a,
    column: o,
    maxColumnWidth: l,
    onColumnWidthChange: s = m,
    onResetColumnWidth: u = m
  } = r, c = (n) => {
    const C = n.target.value ? Number.parseInt(n.target.value, 10) : 0, b = Math.min(C, a || l);
    s(o, b);
  }, h = (n) => s(o, n), p = () => u(o), g = x(
    "btn",
    "btn-muted",
    "btn-icon-only",
    "btn-sm",
    "margin-left-10",
    e === d && "disabled"
  );
  return /* @__PURE__ */ i("div", { className: "table-settings-item-body", children: [
    /* @__PURE__ */ t(
      N,
      {
        className: "margin-bottom-0",
        value: e,
        minValue: 0,
        maxValue: a || l,
        step: 1,
        onChange: h
      }
    ),
    /* @__PURE__ */ t("div", { className: g, role: "button", onClick: p, children: /* @__PURE__ */ t("span", { className: "rioglyph rioglyph-revert" }) }),
    /* @__PURE__ */ t("div", { className: "column-width-input", children: /* @__PURE__ */ i("div", { className: "input-group", children: [
      /* @__PURE__ */ t(
        "input",
        {
          className: "form-control text-right padding-right-5 no-controls",
          type: "number",
          value: e || "",
          min: 0,
          max: a || l,
          onChange: c
        }
      ),
      /* @__PURE__ */ t("div", { className: "input-group-addon", children: "px" })
    ] }) })
  ] });
};
export {
  j as TableSettingsColumnDetails
};
//# sourceMappingURL=TableSettingsColumnDetails.js.map
