@yamada-ui/button/dist/chunk-4MUEZBMA.mjs

Yamada UI button components

"use client"

// src/button-group.tsx
import { forwardRef, ui } from "@yamada-ui/core";
import { createContext, cx, dataAttr } from "@yamada-ui/utils";
import { useMemo } from "react";
import { jsx } from "react/jsx-runtime";
var [ButtonGroupProvider, useButtonGroup] = createContext(
  {
    name: "ButtonGroupContext",
    strict: false
  }
);
var ButtonGroup = forwardRef(
  ({
    className,
    size,
    variant,
    isAttached,
    attached = isAttached,
    columnGap,
    direction,
    isDisabled,
    disabled = isDisabled,
    flexDirection = direction,
    gap,
    rowGap,
    ...rest
  }, ref) => {
    const column = flexDirection === "column" || flexDirection === "column-reverse";
    const css = {
      display: "inline-flex",
      flexDirection
    };
    const context = useMemo(
      () => ({ size, variant, disabled }),
      [size, variant, disabled]
    );
    if (attached) {
      Object.assign(css, {
        "> *:first-of-type:not(:last-of-type)": column ? { borderBottomRadius: 0 } : { borderRightRadius: 0, borderRightWidth: "0px" },
        "> *:not(:first-of-type):last-of-type": column ? { borderTopRadius: 0, borderTopWidth: "0px" } : { borderLeftRadius: 0 },
        "> *:not(:first-of-type):not(:last-of-type)": column ? { borderRadius: 0, borderTopWidth: "0px" } : { borderRadius: 0, borderRightWidth: "0px" }
      });
    } else {
      Object.assign(css, {
        columnGap,
        gap,
        rowGap
      });
    }
    return /* @__PURE__ */ jsx(ButtonGroupProvider, { value: context, children: /* @__PURE__ */ jsx(
      ui.div,
      {
        ref,
        className: cx("ui-button-group", className),
        "data-attached": dataAttr(attached),
        role: "group",
        __css: css,
        ...rest
      }
    ) });
  }
);
ButtonGroup.displayName = "ButtonGroup";
ButtonGroup.__ui__ = "ButtonGroup";

export {
  useButtonGroup,
  ButtonGroup
};
//# sourceMappingURL=chunk-4MUEZBMA.mjs.map