From 2b1345431e4dc50ff9ae19c9de7596f3e8562455 Mon Sep 17 00:00:00 2001
From: ronload <91997734+ronload@users.noreply.github.com>
Date: Tue, 14 Apr 2026 23:58:16 +0800
Subject: [PATCH] fix(select): align dropdown popup with trigger edge

The default alignItemWithTrigger behavior in Base UI shifts the
popup horizontally to overlay the selected item on the trigger
text, causing the dropdown to appear offset to the right.
---
 src/components/city-select.tsx     | 2 +-
 src/components/district-select.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/city-select.tsx b/src/components/city-select.tsx
index 323bfa3..7c1e94a 100644
--- a/src/components/city-select.tsx
+++ b/src/components/city-select.tsx
@@ -31,7 +31,7 @@ export function CitySelect({ cities, value, onChange }: CitySelectProps) {
         <SelectTrigger className="w-full text-base">
           <SelectValue placeholder={"請選擇縣市..."} />
         </SelectTrigger>
-        <SelectContent>
+        <SelectContent align="start" alignItemWithTrigger={false}>
           {cities.map((city) => (
             <SelectItem key={city.name} value={city.name}>
               {city.name}
diff --git a/src/components/district-select.tsx b/src/components/district-select.tsx
index 654903c..7609e9b 100644
--- a/src/components/district-select.tsx
+++ b/src/components/district-select.tsx
@@ -38,7 +38,7 @@ export function DistrictSelect({
         <SelectTrigger className="w-full text-base">
           <SelectValue placeholder={"請選擇鄉鎮市區..."} />
         </SelectTrigger>
-        <SelectContent>
+        <SelectContent align="start" alignItemWithTrigger={false}>
           {districts.map((d) => (
             <SelectItem key={d.name} value={d.name}>
               {d.name}