import { filterUndefined } from "../utils/object.js";
import { cs } from "../utils/styles.js";
import styled from "../core/styled.js";
import vui from "../core/vui.js";
import { CheckboxGroupProvider } from "./context.js";
import { useMemo } from "react";
import { jsx } from "react/jsx-runtime";

//#region src/checkbox/checkboxGroup.tsx
const CheckboxGroupBase = styled.divBox`
  display: flex;
  flex-direction: column;
`;
/**
* Organizes layout and display of multiple checkboxes as a row or column.
* Exposes some props to the children via context.
*/
const CheckboxGroup = vui((props, ref) => {
	const { className, defaultValue, disabled, isRow, name, onBlur, onChange, onFocus, size, variant, ...rest } = props;
	const context = useMemo(() => filterUndefined({
		defaultValue,
		disabled,
		name,
		onBlur,
		onChange,
		onFocus,
		size,
		variant
	}), [
		defaultValue,
		disabled,
		name,
		onBlur,
		onChange,
		onFocus,
		size,
		variant
	]);
	const aliasedProps = filterUndefined({ flexDirection: isRow ? "row" : void 0 });
	return /* @__PURE__ */ jsx(CheckboxGroupProvider, {
		value: context,
		children: /* @__PURE__ */ jsx(CheckboxGroupBase, {
			className: cs("vui-checkboxGroup", className),
			ref,
			...aliasedProps,
			...rest
		})
	});
});
CheckboxGroup.displayName = "CheckboxGroup";

//#endregion
export { CheckboxGroupBase, CheckboxGroup as default };
globalThis.__vuiVersion__ = "4.0.0"
//# sourceMappingURL=checkboxGroup.js.map