Repository: adobe/react-spectrum
File: packages/@react-spectrum/s2/src/Button.tsx (TypeScript)

Code before:
                  size: {
                    size: {
                      S: 14,
                      M: 18,
                      L: 20,
                      XL: 24
                    }
                  }
                })({size})} />
            </div>
          }
        </Provider>
      </>)}
    </RACButton>
  );
});

/**
 * A LinkButton combines the functionality of a link with the appearance of a button. Useful for allowing users to navigate to another page.
 */
export const LinkButton = forwardRef(function LinkButton(props: LinkButtonProps, ref: FocusableRef<HTMLAnchorElement>) {
  [props, ref] = useSpectrumContextProps(props, ref, LinkButtonContext);
  props = useFormProps(props);
  let domRef = useFocusableRef(ref);
  let overlayTriggerState = useContext(OverlayTriggerStateContext);
  let variant = props.variant || 'primary';

  return (
    <Link
      {...props}
      ref={domRef}
      style={pressScale(domRef, props.UNSAFE_style)}
      className={renderProps => (props.UNSAFE_className || '') + button({
        ...renderProps,
        // Retain hover styles when an overlay is open.
        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,
        variant,
        fillStyle: props.fillStyle || 'fill',
        size: props.size || 'M',
        staticColor: props.staticColor,
        isStaticColor: !!props.staticColor,
        isPending: false
      }, props.styles)}>
      {(renderProps) => (<>
        {variant === 'genai' || variant === 'premium'
          ? (
            <span
              className={gradient({
                ...renderProps,
                // Retain hover styles when an overlay is open.
                isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,

Review comment (suggestion):
move to this format instead?
```suggestion
  let {
    fillStyle,
    variant = 'primary',
  } = props;
```
otherwise it should be `let variant = props.variant ?? 'primary'`

Code after:
                  size: {
                    size: {
                      S: 14,
                      M: 18,
                      L: 20,
                      XL: 24
                    }
                  }
                })({size})} />
            </div>
          }
        </Provider>
      </>)}
    </RACButton>
  );
});

/**
 * A LinkButton combines the functionality of a link with the appearance of a button. Useful for allowing users to navigate to another page.
 */
export const LinkButton = forwardRef(function LinkButton(props: LinkButtonProps, ref: FocusableRef<HTMLAnchorElement>) {
  [props, ref] = useSpectrumContextProps(props, ref, LinkButtonContext);
  props = useFormProps(props);
  let domRef = useFocusableRef(ref);
  let overlayTriggerState = useContext(OverlayTriggerStateContext);
  let {
    fillStyle = 'fill',
    size = 'M',
    variant = 'primary',
    staticColor,
    styles,
    children
  } = props;

  return (
    <Link
      {...props}
      ref={domRef}
      style={pressScale(domRef, props.UNSAFE_style)}
      className={renderProps => (props.UNSAFE_className || '') + button({
        ...renderProps,
        // Retain hover styles when an overlay is open.
        isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,
        variant,
        fillStyle,
        size,
        staticColor,
        isStaticColor: !!staticColor,
        isPending: false
      }, styles)}>
      {(renderProps) => (<>