feat:dropdownButton children buttons level & className (#7777)

packages/amis/__tests__/renderers/DropDownButton.test.tsx

@@ -10,6 +10,7 @@
  * 7. 默认展开 defaultIsOpened
  * 8. 对齐方式 align
  * 9. block & size
+ * 10. buttons level & className
  */
 
 import React from 'react';
@@ -396,3 +397,36 @@ test('Renderer:dropdown-button with block & size', async () => {
   );
   expect(container).toMatchSnapshot();
 });
+
+test('Renderer:dropdown-button buttons with className & level', async () => {
+  const {container} = render(
+    amisRender({
+      type: "dropdown-button",
+      level: "success",
+      label: "下拉菜单",
+      buttons: [
+        {
+          type: "button",
+          label: "按钮1",
+          level: "success",
+          className: "custom-button-class"
+        },
+        {
+          type: "button",
+          label: "按钮2"
+        }
+      ]
+    })
+  );
+
+  const dropdownButton = document.querySelector('button.cxd-Button');
+  fireEvent.click(dropdownButton as HTMLDivElement);
+
+  expect(container.querySelectorAll('.cxd-DropDown-menu-root .cxd-DropDown-button')[0]!).toHaveClass(
+    'cxd-Button--success'
+  );
+
+  expect(container.querySelectorAll('.cxd-DropDown-menu-root .cxd-DropDown-button')[0]!).toHaveClass(
+    'custom-button-class'
+  );
+});

packages/amis/src/renderers/DropDownButton.tsx

@@ -279,15 +279,25 @@ export default class DropDownButton extends React.Component<
       return (
         <li
           key={index}
-          className={cx('DropDown-button', {
-            ['is-disabled']: isDisabled(button, data)
-          })}
+          className={cx(
+            'DropDown-button',
+            {
+              ['is-disabled']: isDisabled(button, data)
+            },
+            typeof button.level === 'undefined'
+              ? ''
+              : button.level
+              ? `Button--${button.level}`
+              : '',
+            button.className
+          )}
         >
           {render(
             `button/${index}`,
             {
               type: 'button',
-              ...(button as any)
+              ...(button as any),
+              className: ''
             },
             {
               isMenuItem: true,