Currently when drawing a Rect and after click on it my Transformer is activating.Now what i want is when draw a Rect and on mouse release i want to activate Transformer for Resizing?

  const handleMouseUp = (e: any) => {
    setIsDragging(false);
    const stage = e.target.getStage();
    if (stage) {
      const container = stage.container();
      if (container) {
        container.style.cursor = 'default';
      }
    }
    // Calculate selected zone based on start and end position
    if (!!startPosition && !!endPosition) {
      const x1 = Math.min(startPosition.x, endPosition.x);
      const y1 = Math.min(startPosition.y, endPosition.y);
      const x2 = Math.max(startPosition.x, endPosition.x);
      const y2 = Math.max(startPosition.y, endPosition.y);
      if ((x2 - x1) !== 0 && (y2 - y1) !== 0) {


        const newZone = {
          x1,
          y1,
          x2,
          y2,
          width: x2 - x1,
          height: y2 - y1,
          isDrag: true,
          isConfirmed: false,

        };
        setTempZones([...tempZones, newZone]);
        
        if (transformerRef.current) {

          transformerRef.current.nodes([newZone]);
          transformerRef.current.getLayer().batchDraw();
        }
      }
      setStartPosition(null);
      setEndPosition(null);
    }
  };

Please give solution for this.I want to activate Trnasformer with ref when mouse release