import { cn } from "./index3.js";
import { ButtonGroupText } from "./index8.js";
import { cva } from "class-variance-authority";
import { jsx } from "react/jsx-runtime";
import { Separator } from "@base-ui/react/separator";
//#region src/components/atoms/buttons/ButtonGroup/ButtonGroup.tsx
var buttonGroupVariants = cva("has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-e-md flex w-fit items-stretch [&>*]:focus-visible:z-10 [&>*]:focus-visible:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1 [&>[data-slot]]:shadow-none", {
	variants: {
		orientation: {
			horizontal: "[&>[data-slot]~[data-slot]]:rounded-s-none [&>[data-slot]~[data-slot]]:border-s [&>[data-slot]~[data-slot]]:border-s-black/15 [&>[data-slot]]:rounded-e-none [&>[data-slot]:has(~[data-slot])]:border-e-0",
			vertical: "flex-col [&>[data-slot]~[data-slot]]:rounded-t-none [&>[data-slot]~[data-slot]]:border-t [&>[data-slot]~[data-slot]]:border-t-black/15 [&>[data-slot]]:rounded-b-none [&>[data-slot]:has(~[data-slot])]:border-b-0"
		},
		shape: {
			rounded: "",
			round: ""
		}
	},
	compoundVariants: [
		{
			orientation: "horizontal",
			shape: "rounded",
			className: "[&>[data-slot]:first-child]:rounded-s-lg [&>[data-slot]:not(:has(~[data-slot]))]:rounded-e-lg!"
		},
		{
			orientation: "horizontal",
			shape: "round",
			className: "[&>[data-slot]:first-child]:rounded-s-full [&>[data-slot]:not(:has(~[data-slot]))]:rounded-e-full!"
		},
		{
			orientation: "vertical",
			shape: "rounded",
			className: "[&>[data-slot]:first-child]:rounded-t-lg [&>[data-slot]:not(:has(~[data-slot]))]:rounded-b-lg!"
		},
		{
			orientation: "vertical",
			shape: "round",
			className: "[&>[data-slot]:first-child]:rounded-t-full [&>[data-slot]:not(:has(~[data-slot]))]:rounded-b-full!"
		}
	],
	defaultVariants: {
		orientation: "horizontal",
		shape: "round"
	}
});
function ButtonGroup({ className, orientation, shape, ...props }) {
	return /* @__PURE__ */ jsx("div", {
		role: "group",
		"data-slot": "button-group",
		"data-orientation": orientation,
		className: cn(buttonGroupVariants({
			orientation,
			shape
		}), className),
		...props
	});
}
ButtonGroup.displayName = "ButtonGroup";
function ButtonGroupSeparator({ className, orientation = "vertical", ...props }) {
	return /* @__PURE__ */ jsx(Separator, {
		"data-slot": "button-group-separator",
		orientation,
		className: cn("bg-input relative self-stretch data-[orientation=horizontal]:mx-px data-[orientation=horizontal]:w-auto data-[orientation=vertical]:my-px data-[orientation=vertical]:h-auto", className),
		...props
	});
}
ButtonGroupSeparator.displayName = "ButtonGroupSeparator";
/**
* ButtonGroup component with dot notation for compound parts.
*
* @example
* ```tsx
* <ButtonGroup>
*   <Button>Button 1</Button>
*   <ButtonGroup.Separator />
*   <Button>Button 2</Button>
* </ButtonGroup>
* ```
*/
var ButtonGroupCompound = Object.assign(ButtonGroup, {
	Root: ButtonGroup,
	Separator: ButtonGroupSeparator,
	Text: ButtonGroupText
});
//#endregion
export { ButtonGroupCompound, ButtonGroupSeparator, buttonGroupVariants };

//# sourceMappingURL=index9.js.map