fix(ui): multiple Select should vertical align in PageContainer extra

oceanbase · Dec 10, 2024 · 499e7bc · 499e7bc
1 parent 713348d
commit 499e7bc
Show file tree

Hide file tree

Showing 6 changed files with 5,783 additions and 14,742 deletions.
diff --git a/package.json b/package.json
@@ -43,7 +43,7 @@
   },
   "devDependencies": {
     "@ant-design/colors": "^7.1.0",
-    "@ant-design/cssinjs": "^1.22.0",
+    "@ant-design/cssinjs": "^1.22.1",
     "@ant-design/icons": "^5.5.1",
     "@babel/cli": "^7.25.9",
     "@babel/preset-env": "^7.26.0",
@@ -67,7 +67,7 @@
     "@umijs/fabric": "^4.0.1",
     "@umijs/test": "^4.3.34",
     "@vercel/analytics": "^1.4.0",
-    "antd": "^5.22.1",
+    "antd": "^5.22.4",
     "antd-style": "^3.7.1",
     "antd-token-previewer": "^2.0.8",
     "babel-jest": "^29.7.0",

diff --git a/packages/design/package.json b/packages/design/package.json
@@ -34,12 +34,12 @@
     "build": "father build && cp src/style/reset.css dist/"
   },
   "dependencies": {
-    "@ant-design/cssinjs": "^1.22.0",
+    "@ant-design/cssinjs": "^1.22.1",
     "@oceanbase/aliyun-theme": "^0.1.6",
     "@oceanbase/icons": "workspace:^",
     "@oceanbase/util": "workspace:^",
     "ahooks": "^2.10.14",
-    "antd": "^5.22.1",
+    "antd": "^5.22.4",
     "classnames": "^2.5.1",
     "lodash": "^4.17.21",
     "lottie-web": "^5.12.2",

diff --git a/packages/design/src/_util/genStyle.ts b/packages/design/src/_util/genStyle.ts
@@ -74,6 +74,10 @@ export const genLargeStyle = (token: FullToken<any>): CSSObject => {
         fontSize,
       },
     },
+    [`${antCls}-select-multiple ${antCls}-select-selection-wrap`]: {
+      // ref: https://github.com/oceanbase/oceanbase-design/pull/881
+      height: '100%',
+    },
     // Input
     [`${antCls}-input-wrapper`]: {
       fontSize,

diff --git a/packages/ui/package.json b/packages/ui/package.json
@@ -34,7 +34,7 @@
     "build": "NODE_OPTIONS=--max_old_space_size=4096 father build"
   },
   "dependencies": {
-    "@ant-design/cssinjs": "^1.22.0",
+    "@ant-design/cssinjs": "^1.22.1",
     "@ant-design/pro-components": "^2.8.2",
     "@antv/g6": "3.4.10",
     "@oceanbase/design": "workspace:^",

diff --git a/packages/ui/src/PageContainer/demo/extra-footer.tsx b/packages/ui/src/PageContainer/demo/extra-footer.tsx
@@ -21,7 +21,7 @@ import { EllipsisOutlined, LikeOutlined, CommentOutlined, StarOutlined } from '@
 
 export default () => {
   const [loading, setLoading] = useState(false);
-  const [size, setSize] = useState<SizeType>('large');
+  const [size, setSize] = useState<SizeType>('middle');
   const [inputType, setInputType] = useState('search');
 
   const mockRequest = () => {
@@ -79,17 +79,17 @@ export default () => {
           <Select
             key="5"
             size={size}
-            defaultValue="large"
+            value={size}
+            allowClear={true}
             options={[
               { value: 'large', label: 'large' },
               { value: 'middle', label: 'middle' },
-              // { value: 'small', label: 'small' },
             ]}
             onChange={value => {
               setSize(value);
             }}
             placeholder="placeholder"
-            style={{ width: 100 }}
+            style={{ width: 150 }}
           />,
           <Radio.Group
             key="6"
@@ -150,7 +150,7 @@ export default () => {
         <Space.Compact>
           <Button size={size} icon={<LikeOutlined />} />
           <Button size={size} icon={<CommentOutlined />} />
-          <Button icon={<StarOutlined />} />
+          <Button size={size} icon={<StarOutlined />} />
         </Space.Compact>,
         <Button size={size}>重置</Button>,
         <Button size={size} type="primary">