import { jsx } from 'react/jsx-runtime';
import { forwardRef, useState, useEffect } from 'react';
import { B as Button } from './Button-BNzCI47m.js';
import { c as cx } from './index-De1g9FRV.js';
import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DjqeAJZ9.js';
import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
import { useTrackingId } from './useTrackingId.js';

import './ButtonToggle.css';const styles = {
	"button-toggle": "_button-toggle_i6zdh_1"
};

const ButtonToggle = forwardRef(
  (props, ref) => {
    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
    const {
      value,
      defaultChecked = false,
      checked,
      className,
      onClick,
      onChange,
      onKeyDown,
      style,
      icon,
      size,
      type,
      ...rest
    } = componentProps;
    const [isPressed, setIsPressed] = useState(checked ?? defaultChecked);
    const onClickHandler = (e) => {
      if (typeof checked === "undefined") {
        setIsPressed(!isPressed);
        onChange?.(e, { pressed: !isPressed, value });
      }
      onClick?.(e);
    };
    useEffect(() => {
      if (typeof checked === "undefined") return;
      setIsPressed(checked);
    }, [checked]);
    const data = {
      children: childrenToString(props.children),
      icon,
      size,
      value,
      type
    };
    const trackingId = useTrackingId({
      name: "ButtonToggle",
      data,
      hasOverride: !!props["data-tracking-id"]
    });
    const ButtonToggleClassNames = cx(className, styles["button-toggle"]);
    const styleCombined = {
      ...style,
      ...layoutStyles
    };
    return /* @__PURE__ */ jsx(
      Button,
      {
        "data-tracking-id": trackingId,
        "data-anv": "button-toggle",
        "aria-pressed": isPressed,
        onClick: onClickHandler,
        className: ButtonToggleClassNames,
        value,
        style: styleCombined,
        icon,
        size,
        type,
        ref,
        ...rest
      }
    );
  }
);
ButtonToggle.displayName = "ButtonToggle";

export { ButtonToggle as B };
//# sourceMappingURL=ButtonToggle-DBGc7dIn.js.map
