From c9ad01a285f7ef9b36ebd2f1f4634f8b4f86694e Mon Sep 17 00:00:00 2001
From: Naiyuan Qing <145280634+NevilleQingNY@users.noreply.github.com>
Date: Thu, 9 Jul 2026 18:44:09 +0800
Subject: [PATCH] fix(views): round square avatar crop frame

---
 packages/views/common/avatar-crop-dialog.tsx | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/packages/views/common/avatar-crop-dialog.tsx b/packages/views/common/avatar-crop-dialog.tsx
index 882065af1a..3f09c32c13 100644
--- a/packages/views/common/avatar-crop-dialog.tsx
+++ b/packages/views/common/avatar-crop-dialog.tsx
@@ -23,6 +23,7 @@ import {
 const MIN_ZOOM = 1;
 const MAX_ZOOM = 3;
 const ZOOM_STEP = 0.1;
+const ROUNDED_SQUARE_CROP_AREA_STYLE = { borderRadius: "0.5rem" };
 
 export type AvatarCropShape = "circle" | "square";
 
@@ -138,6 +139,10 @@ export function AvatarCropDialog({
                 minZoom={MIN_ZOOM}
                 maxZoom={MAX_ZOOM}
                 cropShape={shape === "circle" ? "round" : "rect"}
+                style={{
+                  cropAreaStyle:
+                    shape === "circle" ? undefined : ROUNDED_SQUARE_CROP_AREA_STYLE,
+                }}
                 showGrid={false}
                 onCropChange={setCrop}
                 onZoomChange={setZoom}