Why binding mask handlers on wrap element instand of mask element?

[4074]

While I reading the source code, a question confuses me. Why binding mask handlers on wrap element instand of mask element? For example, the onMaskClick and onMaskMouseUp handlers.

    // At the end of Dialog.tsx.
    return (
      <div className={`${prefixCls}-root`}>
        {this.getMaskElement()}
        <div
          tabIndex={-1}
          onKeyDown={this.onKeyDown}
          className={`${prefixCls}-wrap ${props.wrapClassName || ''}`}
          ref={this.saveRef('wrap')}
          onClick={maskClosable ? this.onMaskClick : null}
          onMouseUp={maskClosable ? this.onMaskMouseUp : null}
          role="dialog"
          aria-labelledby={props.title ? this.titleId : null}
          style={style}
          {...props.wrapProps}
        >
          {this.getDialogElement()}
        </div>
      </div>
    );

Very grateful if someone tell me the reason. And, please forgive my fool question.