"use client";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef } from "react";
import { useElementInteraction } from "../interaction/useElementInteraction.js";
import { useHigherContrastChildren } from "../interaction/useHigherContrastChildren.js";
import { FloatingActionButton } from "./FloatingActionButton.js";
import { button } from "./styles.js";
/**
 * **Client Component**
 *
 * @example Simple Example
 * ```tsx
 * import { Button } from "@react-md/core/button/Button";
 * import type { ReactElement } from "react";
 *
 * function Example(): ReactElement {
 *   return (
 *     <Button
 *       onClick={(event) => {
 *         // do something
 *       }}
 *     >
 *       Content
 *     </Button>
 *   );
 * }
 * ```
 *
 * @example Theme Example
 * ```tsx
 * import { Button } from "@react-md/core/button/Button";
 * import type { ReactElement } from "react";
 *
 * function Example(): ReactElement {
 *   return (
 *     <Button
 *       theme="primary"
 *       themeType="contained"
 *       onClick={(event) => {
 *         // do something
 *       }}
 *     >
 *       Content
 *     </Button>
 *   );
 * }
 * ```
 *
 * @example Icon Button Example
 * ```tsx
 * import { Button } from "@react-md/core/button/Button";
 * import FavoriteIcon from "@react-md/material-icons/FavoriteIcon";
 * import type { ReactElement } from "react";
 *
 * function Example(): ReactElement {
 *   return (
 *     <Button
 *       theme="secondary"
 *       themeType="outline"
 *       buttonType="icon"
 *       onClick={(event) => {
 *         // do something
 *       }}
 *     >
 *       <FavoriteIcon />
 *     </Button>
 *   );
 * }
 * ```
 *
 * @example Text Button with icons
 * ```tsx
 * import { Button } from "@react-md/core/button/Button";
 * import FavoriteIcon from "@react-md/material-icons/FavoriteIcon";
 * import type { ReactElement } from "react";
 *
 * function Example(): ReactElement {
 *   return (
 *     <Button
 *       onClick={(event) => {
 *         // do something
 *       }}
 *     >
 *       <FavoriteIcon />
 *       Content
 *     </Button>
 *   );
 * }
 * ```
 *
 * @see {@link https://react-md.dev/components/button | Button Demos}
 */ export const Button = /*#__PURE__*/ forwardRef(function Button(props, ref) {
    const { type = "button", disabled = false, floating = null, floatingProps, theme = floating ? "secondary" : "clear", themeType = floating ? "contained" : "flat", iconSize, buttonType = floating || iconSize ? "icon" : "text", className, responsive, children: propChildren, onBlur, onClick, onKeyDown, onKeyUp, onMouseDown, onMouseUp, onMouseLeave, onDragStart, onTouchStart, onTouchEnd, onTouchMove, disableRipple, ...remaining } = props;
    const isThemeDisabled = theme === "disabled";
    const ariaDisabled = props["aria-disabled"];
    const { pressed, pressedClassName, ripples, handlers } = useElementInteraction({
        mode: disableRipple ? "press" : undefined,
        onBlur,
        onClick,
        onKeyDown,
        onKeyUp,
        onMouseDown,
        onMouseUp,
        onMouseLeave,
        onDragStart,
        onTouchStart,
        onTouchEnd,
        onTouchMove,
        disabled: disabled || isThemeDisabled || ariaDisabled && ariaDisabled !== "false"
    });
    const children = useHigherContrastChildren(propChildren);
    return /*#__PURE__*/ _jsx(FloatingActionButton, {
        position: floating,
        ...floatingProps,
        children: /*#__PURE__*/ _jsxs("button", {
            ...remaining,
            ...isThemeDisabled ? {} : handlers,
            "aria-disabled": isThemeDisabled || remaining["aria-disabled"],
            disabled: disabled,
            ref: ref,
            type: type,
            className: button({
                theme,
                themeType,
                buttonType,
                disabled,
                responsive,
                iconSize,
                pressed,
                pressedClassName,
                className
            }),
            children: [
                children,
                ripples
            ]
        })
    });
});

//# sourceMappingURL=Button.js.map