React aria merge props causing initial styling to be ignored Next.js TypeScript

Question

When I use react aria's mergeProps to merge button props and then pass to my component it causes it to override (I'm guessing) the initial props, but not all. The background color won't appear but everything else does, and the styling works fine on hover or any secondary "conditional" props. Code:

export default function Button(props: ButtonProps): ReactElement {
  const p = { ...DEFAULT_PROPS, ...props };

  const ref = useRef<HTMLButtonElement>(null);
  const { buttonProps, isPressed } = useButton(p, ref);
  const { hoverProps, isHovered } = useHover({ isDisabled: p.isDisabled });
  const behaviorProps = mergeProps(buttonProps, hoverProps);

  return (
    <button
      className={clsx([
        'button-main',
        {
          'is-hovered': isHovered,
          'is-pressed': isPressed,
          'is-secondary': p.variant === 'secondary',
        },
      ])}
      {...behaviorProps}
    >
      {p.children}
    </button>
  );
}