"use client";
import { jsx as _jsx } from "react/jsx-runtime";
import { cnb } from "cnbuilder";
import { forwardRef } from "react";
import { InputToggleIcon } from "../form/InputToggleIcon.js";
import { SwitchTrack } from "../form/SwitchTrack.js";
import { ListItem } from "../list/ListItem.js";
import { useEnsuredId } from "../useEnsuredId.js";
import { menuItemInputToggle, menuItemInputToggleBall, menuItemInputToggleIcon, menuItemInputToggleTrack } from "./styles.js";
const noop = ()=>{
// do nothing
};
/**
 * **Client Component**
 *
 * This is a low-level component that should probably not be used externally and
 * instead the `MenuItemCheckbox`, `MenuItemRadio`, or `MenuItemSwitch` should
 * be used instead.
 *
 * @see {@link https://react-md.dev/components/menu | DropdownMenu Demos}
 * @see {@link MenuItemCheckbox} for checkbox examples
 * @see {@link MenuItemRadio} for radio examples
 * @see {@link MenuItemSwitch} for switch examples
 * @since 2.8.0
 */ export const MenuItemInputToggle = /*#__PURE__*/ forwardRef(function MenuItemInputToggle(props, ref) {
    const { id: propId, type, disabled = false, checked, onCheckedChange, preventMenuHideOnClick = false, onClick = noop, className, tabIndex = -1, children, size = "auto", icon: propIcon, iconAfter = false, iconProps, iconStyle, iconClassName, checkedIcon, indeterminate, indeterminateIcon, addon, addonType, addonPosition, addonForceWrap, disableAddonCenteredMedia, ballProps, ballStyle, ballClassName, trackProps, trackStyle, trackClassName, ...remaining } = props;
    const id = useEnsuredId(propId, "menu-item");
    let icon = propIcon;
    if (type === "switch") {
        icon = /*#__PURE__*/ _jsx(SwitchTrack, {
            style: trackStyle,
            ...trackProps,
            className: cnb(menuItemInputToggleTrack(), trackClassName, trackProps?.className),
            active: checked,
            ballProps: ballProps,
            ballStyle: ballStyle,
            ballClassName: cnb(menuItemInputToggleBall(), ballClassName)
        });
    } else {
        icon = /*#__PURE__*/ _jsx(InputToggleIcon, {
            style: iconStyle,
            disableEm: true,
            ...iconProps,
            className: cnb(menuItemInputToggleIcon(), iconClassName, iconProps?.className),
            size: size,
            type: type,
            checked: checked,
            disabled: disabled,
            icon: propIcon,
            checkedIcon: checkedIcon,
            indeterminate: indeterminate,
            indeterminateIcon: indeterminateIcon
        });
    }
    let leftAddon;
    let leftAddonType;
    let leftAddonPosition;
    let leftAddonForceWrap;
    let disableLeftAddonCenteredMedia;
    let rightAddon;
    let rightAddonType;
    let rightAddonPosition;
    let rightAddonForceWrap;
    let disableRightAddonCenteredMedia;
    if (iconAfter) {
        leftAddon = addon;
        leftAddonType = addonType;
        leftAddonPosition = addonPosition;
        leftAddonForceWrap = addonForceWrap;
        disableLeftAddonCenteredMedia = disableAddonCenteredMedia;
        rightAddon = icon;
    } else {
        leftAddon = icon;
        rightAddon = addon;
        rightAddonType = addonType;
        rightAddonPosition = addonPosition;
        rightAddonForceWrap = addonForceWrap;
        disableRightAddonCenteredMedia = disableAddonCenteredMedia;
    }
    return /*#__PURE__*/ _jsx(ListItem, {
        ...remaining,
        // I'm not actually sure if this is correct
        "aria-checked": indeterminate && checked ? "mixed" : checked,
        id: id,
        role: type === "radio" ? "menuitemradio" : "menuitemcheckbox",
        onClick: (event)=>{
            onClick(event);
            onCheckedChange(!checked, event);
            if (preventMenuHideOnClick) {
                event.stopPropagation();
            }
        },
        ref: ref,
        className: menuItemInputToggle({
            type,
            className
        }),
        disabled: disabled,
        tabIndex: tabIndex,
        leftAddon: leftAddon,
        leftAddonType: leftAddonType,
        leftAddonPosition: leftAddonPosition,
        leftAddonForceWrap: leftAddonForceWrap,
        disableLeftAddonCenteredMedia: disableLeftAddonCenteredMedia,
        rightAddon: rightAddon,
        rightAddonType: rightAddonType,
        rightAddonPosition: rightAddonPosition,
        rightAddonForceWrap: rightAddonForceWrap,
        disableRightAddonCenteredMedia: disableRightAddonCenteredMedia,
        children: children
    });
});

//# sourceMappingURL=MenuItemInputToggle.js.map