@arolariu/components
Version:
🎨 70+ beautiful, accessible React components built on Base UI. TypeScript-first, CSS Modules styling, tree-shakeable, SSR-ready. Perfect for modern web apps, design systems & rapid prototyping. Zero config, maximum flexibility! ⚡
50 lines (49 loc) • 2.18 kB
JavaScript
"use client";
import { jsx } from "react/jsx-runtime";
import { Separator } from "./separator.js";
import { cn } from "../../lib/utilities.js";
import button_group_module from "./button-group.module.js";
import * as __rspack_external_react from "react";
function buttonGroupVariants({ orientation = "horizontal", className } = {}) {
return cn(button_group_module.root, "vertical" === orientation ? button_group_module.vertical : button_group_module.horizontal, className);
}
const ButtonGroup = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, orientation = "horizontal", ...props }, ref)=>/*#__PURE__*/ jsx("div", {
ref: ref,
role: "group",
"data-slot": "button-group",
"data-orientation": orientation,
className: buttonGroupVariants({
orientation,
className
}),
...props
}));
const ButtonGroupText = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, asChild = false, children, ...props }, ref)=>{
const mergedClassName = cn(button_group_module.text, className);
if (asChild && /*#__PURE__*/ __rspack_external_react.isValidElement(children)) {
const child = children;
return /*#__PURE__*/ __rspack_external_react.cloneElement(child, {
...props,
ref,
className: cn(mergedClassName, child.props.className)
});
}
return /*#__PURE__*/ jsx("div", {
ref: ref,
className: mergedClassName,
...props,
children: children
});
});
const ButtonGroupSeparator = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, orientation = "vertical", ...props }, ref)=>/*#__PURE__*/ jsx(Separator, {
ref: ref,
"data-slot": "button-group-separator",
orientation: orientation,
className: cn(button_group_module.separator, className),
...props
}));
ButtonGroup.displayName = "ButtonGroup";
ButtonGroupText.displayName = "ButtonGroupText";
ButtonGroupSeparator.displayName = "ButtonGroupSeparator";
export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants };
//# sourceMappingURL=button-group.js.map