chore: Merge branch and fix conflicts

package.json

@@ -98,7 +98,7 @@
     "lodash": "^4.17.21",
     "lz-string": "^1.5.0",
     "mockdate": "^3.0.5",
-    "prettier": "^3.1.1",
+    "prettier": "^3.2.4",
     "prismjs": "^1.29.0",
     "rc-checkbox": "^3.1.0",
     "rc-drawer": "^7.0.0",

packages/codemod/package.json

@@ -34,7 +34,7 @@
     "lodash": "^4.17.21",
     "postcss": "^8.4.33",
     "postcss-less": "^6.0.0",
-    "prettier": "^3.1.1",
+    "prettier": "^3.2.4",
     "read-pkg-up": "^10.1.0",
     "semver": "^7.5.4",
     "update-check": "^1.5.4",

packages/ui/src/FooterToolbar/style/index.ts

@@ -4,16 +4,105 @@ import type { FullToken, GenerateStyle } from '@oceanbase/design/es/theme';
 import { genComponentStyleHook } from '../../_util/genComponentStyleHook';
 
 export const genOperationStyle = (token: FullToken<any>): CSSObject => {
-  const { antCls, controlHeightLG } = token;
+  const {
+    antCls,
+    iconCls,
+    fontSize,
+    lineWidth,
+    borderRadiusLG,
+    controlHeight,
+    controlHeightSM,
+    controlHeightLG,
+  } = token;
+  const height = controlHeightLG;
+  const lineHeight = `${controlHeightLG}px`;
 
   return {
-    // limit min width for icon button
+    // Button
     [`${antCls}-btn`]: {
+      // limit min width for icon button
       minWidth: controlHeightLG,
+      height,
+      fontSize,
+      borderRadius: borderRadiusLG,
     },
-    // set large DatePicker, TimePicker and RangePicker height when font-size is 14px
-    [`${antCls}-picker-large`]: {
-      height: controlHeightLG,
+    // Radio.Button
+    [`${antCls}-radio-group`]: {
+      [`${antCls}-radio-button-wrapper`]: {
+        height,
+        lineHeight: `${height - lineWidth * 2}px`,
+        fontSize,
+        [`&:first-child`]: {
+          borderStartStartRadius: borderRadiusLG,
+          borderEndStartRadius: borderRadiusLG,
+        },
+        [`&:last-child`]: {
+          borderStartEndRadius: borderRadiusLG,
+          borderEndEndRadius: borderRadiusLG,
+        },
+      },
+    },
+    // Select
+    [`${antCls}-select`]: {
+      height,
+      fontSize,
+      [`${antCls}-select-selector`]: {
+        borderRadius: borderRadiusLG,
+      },
+      [`${antCls}-select-selection-item`]: {
+        fontSize,
+      },
+    },
+    // Input
+    [`${antCls}-input-wrapper`]: {
+      fontSize,
+      [`${iconCls}`]: {
+        fontSize,
+      },
+      [`${antCls}-input-affix-wrapper`]: {
+        borderStartEndRadius: 0,
+        borderEndEndRadius: 0,
+      },
+    },
+    [`${antCls}-input-affix-wrapper`]: {
+      height,
+      borderRadius: borderRadiusLG,
+      [`&:not(${antCls}-input-affix-wrapper-lg)`]: {
+        lineHeight: `${controlHeight - lineWidth * 2}px`,
+      },
+      // avoid to conflict with `${antCls}-input-affix-wrapper` height
+      [`${antCls}-input`]: {
+        height: `${controlHeight - lineWidth * 2}px`,
+      },
+      [`${antCls}-input-lg`]: {
+        height: controlHeightSM,
+      },
+      [`${antCls}-input-sm`]: {
+        height: `${controlHeightLG - lineWidth * 2}px`,
+      },
+    },
+    [`${antCls}-input`]: {
+      fontSize,
+      borderRadius: borderRadiusLG,
+    },
+    [`${antCls}-input-search-button`]: {
+      height,
+      lineHeight,
+      borderStartEndRadius: borderRadiusLG,
+      borderEndEndRadius: borderRadiusLG,
+    },
+    [`${antCls}-input-group-addon`]: {
+      fontSize,
+      borderStartEndRadius: borderRadiusLG,
+      borderEndEndRadius: borderRadiusLG,
+    },
+    // set large DatePicker, TimePicker and RangePicker style
+    [`${antCls}-picker`]: {
+      height,
+      borderRadius: borderRadiusLG,
+      [`${antCls}-picker-input>input`]: {
+        fontSize,
+      },
     },
   };
 };

packages/ui/src/PageContainer/__tests__/__snapshots__/index.test.tsx.snap

@@ -96,7 +96,7 @@ exports[`PageContainer basic 1`] = `
             class="ant-space-item"
           >
             <button
-              class="ant-btn ant-btn-default ant-btn-lg"
+              class="ant-btn ant-btn-default"
               type="button"
             >
               <span>
@@ -108,7 +108,7 @@ exports[`PageContainer basic 1`] = `
             class="ant-space-item"
           >
             <button
-              class="ant-btn ant-btn-primary ant-btn-lg"
+              class="ant-btn ant-btn-primary"
               type="button"
             >
               <span>
@@ -120,7 +120,7 @@ exports[`PageContainer basic 1`] = `
             class="ant-space-item"
           >
             <button
-              class="ant-btn ant-btn-default ant-btn-lg ant-dropdown-trigger"
+              class="ant-btn ant-btn-default ant-dropdown-trigger"
               style="padding: 0px 8px;"
               type="button"
             >
@@ -595,7 +595,6 @@ exports[`PageContainer extra and footer 1`] = `
           >
             <span
               class="ant-input-group-wrapper ant-input-search ant-input-search-large ant-input-group-wrapper-lg"
-              style="display: block;"
             >
               <span
                 class="ant-input-wrapper ant-input-group"
@@ -746,6 +745,25 @@ exports[`PageContainer extra and footer 1`] = `
             <div
               class="ant-radio-group ant-radio-group-outline ant-radio-group-large"
             >
+              <label
+                class="ant-radio-button-wrapper"
+              >
+                <span
+                  class="ant-radio-button"
+                >
+                  <input
+                    class="ant-radio-button-input"
+                    type="radio"
+                    value="input"
+                  />
+                  <span
+                    class="ant-radio-button-inner"
+                  />
+                </span>
+                <span>
+                  Input
+                </span>
+              </label>
               <label
                 class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
               >
@@ -756,14 +774,14 @@ exports[`PageContainer extra and footer 1`] = `
                     checked=""
                     class="ant-radio-button-input"
                     type="radio"
-                    value="option1"
+                    value="search"
                   />
                   <span
                     class="ant-radio-button-inner"
                   />
                 </span>
                 <span>
-                  选项 1
+                  Search
                 </span>
               </label>
               <label
@@ -775,18 +793,59 @@ exports[`PageContainer extra and footer 1`] = `
                   <input
                     class="ant-radio-button-input"
                     type="radio"
-                    value="option2"
+                    value="addon"
                   />
                   <span
                     class="ant-radio-button-inner"
                   />
                 </span>
                 <span>
-                  选项 2
+                  Addon
                 </span>
               </label>
             </div>
           </div>
+          <div
+            class="ant-space-item"
+          >
+            <button
+              class="ant-btn ant-btn-primary ant-btn-lg"
+              type="button"
+            >
+              <span>
+                主要按钮
+              </span>
+            </button>
+          </div>
+          <div
+            class="ant-space-item"
+          >
+            <button
+              class="ant-btn ant-btn-default ant-btn-lg ant-dropdown-trigger"
+              style="padding: 0px 8px;"
+              type="button"
+            >
+              <span
+                aria-label="ellipsis"
+                class="anticon anticon-ellipsis"
+                role="img"
+              >
+                <svg
+                  aria-hidden="true"
+                  data-icon="ellipsis"
+                  fill="currentColor"
+                  focusable="false"
+                  height="1em"
+                  viewBox="64 64 896 896"
+                  width="1em"
+                >
+                  <path
+                    d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"
+                  />
+                </svg>
+              </span>
+            </button>
+          </div>
         </div>
       </span>
     </div>

packages/ui/src/PageContainer/demo/basic.tsx

@@ -2,9 +2,9 @@
  * iframe: 600
  */
 import React, { useState } from 'react';
-import { EllipsisOutlined } from '@oceanbase/icons';
-import { Button, Descriptions, Dropdown, Input, Radio, message } from '@oceanbase/design';
+import { Button, Descriptions, Dropdown, message } from '@oceanbase/design';
 import { PageContainer } from '@oceanbase/ui';
+import { EllipsisOutlined } from '@oceanbase/icons';
 
 export default () => {
   const [loading, setLoading] = useState(false);
@@ -20,6 +20,7 @@ export default () => {
       setLoading(false);
       message.success('刷新成功');
     });
+    return promise;
   };
   return (
     <PageContainer

packages/ui/src/PageContainer/demo/extra-footer.tsx

@@ -6,6 +6,7 @@ import {
   Button,
   DatePicker,
   Descriptions,
+  Dropdown,
   Input,
   Radio,
   Select,
@@ -14,10 +15,12 @@ import {
 } from '@oceanbase/design';
 import { PageContainer } from '@oceanbase/ui';
 import { SizeType } from '@oceanbase/design/es/config-provider';
+import { EllipsisOutlined } from '@oceanbase/icons';
 
 export default () => {
   const [loading, setLoading] = useState(false);
   const [size, setSize] = useState<SizeType>('large');
+  const [inputType, setInputType] = useState('search');
 
   const mockRequest = () => {
     const promise = new Promise<void>(resolve => {
@@ -31,6 +34,8 @@ export default () => {
       message.success('刷新成功');
     });
   };
+  const InputComponent = inputType === 'search' ? Input.Search : Input;
+
   return (
     <PageContainer
       ghost={false}
@@ -62,14 +67,12 @@ export default () => {
           <DatePicker key="1" size={size} placeholder="DatePicker" />,
           <DatePicker.RangePicker key="2" size={size} />,
           <TimePicker key="3" size={size} placeholder="TimePicker" />,
-          <Input.Search
+          <InputComponent
             key="4"
             size={size}
             placeholder="placeholder"
             allowClear={true}
-            style={{
-              display: 'block',
-            }}
+            addonAfter={inputType === 'addon' ? 'suffix' : ''}
           />,
           <Select
             key="5"
@@ -78,18 +81,51 @@ export default () => {
             options={[
               { value: 'large', label: 'large' },
               { value: 'middle', label: 'middle' },
-              { value: 'small', label: 'small' },
+              // { value: 'small', label: 'small' },
             ]}
             onChange={value => {
               setSize(value);
             }}
             placeholder="placeholder"
             style={{ width: 100 }}
           />,
-          <Radio.Group key="6" size={size} defaultValue="option1">
-            <Radio.Button value="option1">选项 1</Radio.Button>
-            <Radio.Button value="option2">选项 2</Radio.Button>
+          <Radio.Group
+            key="6"
+            size={size}
+            value={inputType}
+            onChange={e => {
+              setInputType(e.target.value);
+            }}
+          >
+            <Radio.Button value="input">Input</Radio.Button>
+            <Radio.Button value="search">Search</Radio.Button>
+            <Radio.Button value="addon">Addon</Radio.Button>
           </Radio.Group>,
+          <Button key="7" size={size} type="primary">
+            主要按钮
+          </Button>,
+          <Dropdown
+            menu={{
+              items: [
+                {
+                  label: '下拉菜单',
+                  key: '1',
+                },
+                {
+                  label: '下拉菜单2',
+                  key: '2',
+                },
+                {
+                  label: '下拉菜单3',
+                  key: '3',
+                },
+              ],
+            }}
+          >
+            <Button key="8" size={size} style={{ padding: '0 8px' }}>
+              <EllipsisOutlined />
+            </Button>
+          </Dropdown>,
         ],
       }}
       footer={[<Button>重置</Button>, <Button type="primary">提交</Button>]}