import { dynamic } from "@solidjs/web";
import { omit } from "solid-js";
import { mergeRootProps } from "../internals/merge-root-props.jsx";
import { resolveClassStyle } from "../internals/resolve-class-style.jsx";
import { ToolbarGroupContext } from "./toolbar-group-context.jsx";
import { useToolbarRootContext } from "./toolbar-root-context.jsx";
/**
 * Groups several toolbar items (buttons, toggles, etc.) under a shared
 * `disabled` flag. Renders a `<div role="group">` (or `as` override) and
 * publishes a context value consumed by descendant `<Toolbar.Button>`s.
 */
export function ToolbarGroup(props) {
  const toolbar = useToolbarRootContext();
  const ownDisabled = () => props.disabled === true;
  const disabled = () => toolbar.disabled() || ownDisabled();
  const orientation = () => toolbar.orientation();
  const contextValue = {
    disabled,
    present: true
  };
  const userClassStyle = resolveClassStyle(props, () => ({
    disabled: disabled(),
    orientation: orientation()
  }));
  const userHtmlProps = omit(props, "as", "class", "style", "attrs", "children", "disabled");
  const internalProps = {
    role: "group",
    get "data-orientation"() {
      return orientation();
    },
    get "data-disabled"() {
      return disabled() ? "" : undefined;
    }
  };
  const merged = mergeRootProps(mergeRootProps(internalProps, userClassStyle), userHtmlProps);
  const Tag = dynamic(() => props.as ?? "div");
  return <Tag {...merged}>
			<ToolbarGroupContext value={contextValue}>
				{props.children}
			</ToolbarGroupContext>
		</Tag>;
}
//# sourceMappingURL=toolbar-group.jsx.map
