@progress/kendo-react-buttons/ButtonGroup.mjs

All you need in React Button in one package: disabled/enabled states, built-in styles and more. KendoReact Buttons package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import * as e from "react";
import s from "prop-types";
import { useUnstyled as P, classNames as g, uButtonGroup as N } from "@progress/kendo-react-common";
const T = (i) => {
  const { children: B, className: C, dir: c, disabled: p, width: r } = i, w = P(), d = i.unstyled || w, m = d && d.uButtonGroup, E = (t) => {
    const l = e.Children.count(t), a = c !== void 0 ? c === "rtl" : u.current && getComputedStyle(u.current).direction === "rtl" || !1;
    return e.Children.map(t, (o, n) => {
      if (e.isValidElement(o)) {
        const b = n === l - 1, f = a, O = g(
          o.props.className,
          N.position({
            c: m,
            start: f ? b : n === 0,
            end: f ? n === 0 : b
          })
        );
        return G(o, O);
      }
      return o;
    });
  }, G = (t, l) => {
    const a = { ...r ? { width: r } : {}, ...t.props.style || {} }, o = p || t.props.disabled, n = {
      ...t.props,
      ...l ? { className: l } : {},
      ...Object.keys(a).length ? { style: a } : {},
      ...o !== void 0 ? { disabled: o } : {}
    };
    return e.Children.count(t.props.children) > 0 ? e.cloneElement(t, n, t.props.children) : e.cloneElement(t, n);
  }, u = e.useRef(null), R = E(B), y = g(
    N.wrapper({
      c: m,
      stretched: !!r,
      disabled: p
    }),
    C
  ), v = {
    className: y,
    style: { width: `${r}` },
    dir: c,
    // Accessibility properties
    role: "group",
    "aria-disabled": p
  };
  return /* @__PURE__ */ e.createElement("div", { ref: u, ...v, className: y }, R);
};
T.propTypes = {
  children: s.oneOfType([s.arrayOf(s.element), s.element]),
  className: s.string,
  disabled: s.bool,
  width: s.string,
  dir: s.string
};
export {
  T as ButtonGroup
};