@lanaco/lnc-react-ui/dist/ButtonGroup.js

React component library

import { jsx as u } from "react/jsx-runtime";
import { n as i } from "./emotion-styled.browser.esm-CjCaF13H.js";
import { P as t } from "./index-S5Cd7WrG.js";
import { b as o, a as b } from "./utils-DtRLzzTZ.js";
import { u as l } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
const s = i.div`
  display: inline-flex;
  flex-wrap: wrap;
  width: fit-content;
  border-radius: ${(e) => e.borderRadius};

  & button {
    border: none;
    border-top: ${(e) => "0.0625rem solid " + o(
  e.theme,
  "ButtonGroup",
  e.color,
  "enabled",
  "border"
)};

    border-bottom: ${(e) => "0.0625rem  solid " + o(
  e.theme,
  "ButtonGroup",
  e.color,
  "enabled",
  "border"
)};
  }

  & button:focus {
    outline: none;
  }

  & button:not(:first-of-type):not(:last-of-type) {
    border-radius: 0;
  }

  & button[data-type="filled"],
  button[data-type="tinted"] {
    border: none;
  }

  & button:first-of-type {
    border-radius: ${(e) => `${e.borderRadius} 0 0 ${e.borderRadius}`};
    border-left: ${(e) => "0.0625rem solid " + o(
  e.theme,
  "ButtonGroup",
  e.color,
  "enabled",
  "border"
)};
  }

  & button:last-of-type {
    border-radius: ${(e) => `0 ${e.borderRadius} ${e.borderRadius} 0`};
    border-right: ${(e) => "0.0625rem solid " + o(
  e.theme,
  "ButtonGroup",
  e.color,
  "enabled",
  "border"
)};
  }

  & button:first-of-type:not([data-type="filled"]) {
    border-right: ${(e) => "0.0625rem solid " + o(
  e.theme,
  "ButtonGroup",
  e.color,
  "enabled",
  "border"
)};
  }

  & button:not(:first-of-type):not(:last-of-type):not([data-type="filled"]) {
    border-right: ${(e) => "0.0625rem solid " + o(
  e.theme,
  "ButtonGroup",
  e.color,
  "enabled",
  "border"
)};
  }
`, m = ({
  children: e,
  borderRadius: d = "regular",
  style: n = {},
  className: a = ""
}) => {
  const r = l();
  return /* @__PURE__ */ u(
    s,
    {
      borderRadius: b(r, d),
      theme: r,
      style: n,
      className: "lnc-ui-button-group " + a,
      children: e
    }
  );
};
m.propTypes = {
  borderRadius: t.oneOf([
    "slight",
    "regular",
    "edged",
    "curved",
    "none"
  ]),
  className: t.string,
  style: t.object
};
export {
  m as default
};