From 4f099742b8fb2ab69717a60a25e3fe22ed2111f4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E7=88=B1=E5=90=83=E7=99=BD=E8=90=9D?= =?UTF-8?q?=E5=8D=9C?= Date: Sat, 15 Jul 2023 10:14:58 +0800 Subject: [PATCH] enhance: auto align logic (#43556) * enhance: auto align logic * test: update snapshot * chore: update snapshot * chore: fix demo --- .../__snapshots__/demo-extend.test.ts.snap | 291 ++++++++++++++++++ .../__snapshots__/demo.test.tsx.snap | 193 ++++++++++++ components/select/demo/placement-debug.md | 7 + components/select/demo/placement-debug.tsx | 59 ++++ components/select/index.en-US.md | 1 + components/select/index.zh-CN.md | 1 + components/select/useBuiltinPlacements.tsx | 5 +- 7 files changed, 556 insertions(+), 1 deletion(-) create mode 100644 components/select/demo/placement-debug.md create mode 100644 components/select/demo/placement-debug.tsx diff --git a/components/select/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/select/__tests__/__snapshots__/demo-extend.test.ts.snap index 222fcb78fa..786653399d 100644 --- a/components/select/__tests__/__snapshots__/demo-extend.test.ts.snap +++ b/components/select/__tests__/__snapshots__/demo-extend.test.ts.snap @@ -6656,6 +6656,297 @@ Array [ ] `; +exports[`renders components/select/demo/placement-debug.tsx extend context correctly 1`] = ` +
+
+
+
+ + + + +
+
+
+ +
+
+ +
+
+
+
+ + + + +
+
+
+
+
+ 0 +
+
+ 1 +
+
+
+
+
+
+
+
+ Option 0 +
+
+
+
+ Option 1 +
+
+
+
+ Option 2 +
+
+
+
+
+
+
+
+ +
+
+`; + exports[`renders components/select/demo/responsive.tsx extend context correctly 1`] = `
+
+
+
+ + + + +
+
+
+ +
+
+ +
+
+
+
+ + + + +
+ +
+
+`; + exports[`renders components/select/demo/responsive.tsx correctly 1`] = `
{ + const length = count ?? Math.floor(Math.random() * 5) + 1; + + // Random 1 ~ 5 options + return Array.from({ length }).map((_, index) => ({ + value: index, + label: `Option ${index}`, + })); +}; + +const App: React.FC = () => { + const [placement, SetPlacement] = useState('topLeft'); + const [open, setOpen] = useState(false); + const [options, setOptions] = useState(() => randomOptions(3)); + + const placementChange = (e: RadioChangeEvent) => { + SetPlacement(e.target.value); + }; + + return ( +
+ + + TL + TR + BL + BR + + + setOpen((o) => !o)} /> + + +