@grafana/ui/dist/cjs/components/Button/ButtonGroup.cjs

Grafana Components Library

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var jsxRuntime = require('react/jsx-runtime');
var css = require('@emotion/css');
var React = require('react');
var ThemeContext = require('../../themes/ThemeContext.cjs');

"use strict";
const ButtonGroup = React.forwardRef(({ className, children, ...rest }, ref) => {
  const styles = ThemeContext.useStyles2(getStyles);
  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: css.cx("button-group", styles.wrapper, className), ...rest, children });
});
ButtonGroup.displayName = "ButtonGroup";
const getStyles = (theme) => ({
  wrapper: css.css({
    display: "flex",
    borderRadius: theme.shape.radius.default,
    "> .button-group:not(:first-child) > button, > button:not(:first-child)": {
      borderTopLeftRadius: "unset",
      borderBottomLeftRadius: "unset",
      borderLeft: `1px solid rgba(255, 255, 255, 0.12)`
    },
    "> .button-group:not(:last-child) > button, > button:not(:last-child)": {
      borderTopRightRadius: "unset",
      borderBottomRightRadius: "unset",
      borderRight: `1px solid rgba(0, 0, 0, 0.12)`
    }
  })
});

exports.ButtonGroup = ButtonGroup;
//# sourceMappingURL=ButtonGroup.cjs.map