From 60d669bd24570be39e26c705fc66212af0e72044 Mon Sep 17 00:00:00 2001
From: chenos <chenlinxh@gmail.com>
Date: Mon, 26 Dec 2022 13:45:04 +0800
Subject: [PATCH] feat(demos): action bar Initializer example

---
 .../antd/action/demos/demo6.tsx               | 86 +++++++++++++++++++
 .../src/schema-component/antd/action/index.md |  4 +
 2 files changed, 90 insertions(+)
 create mode 100644 packages/core/client/src/schema-component/antd/action/demos/demo6.tsx

diff --git a/packages/core/client/src/schema-component/antd/action/demos/demo6.tsx b/packages/core/client/src/schema-component/antd/action/demos/demo6.tsx
new file mode 100644
index 000000000..d6e5ac3a3
--- /dev/null
+++ b/packages/core/client/src/schema-component/antd/action/demos/demo6.tsx
@@ -0,0 +1,86 @@
+import { ISchema } from '@formily/react';
+import { uid } from '@formily/shared';
+import {
+  Action,
+  ActionBar,
+  SchemaComponent,
+  SchemaComponentProvider,
+  SchemaInitializer,
+  SchemaInitializerProvider
+} from '@nocobase/client';
+import React from 'react';
+
+export const AddActionButton = (props: any) => {
+  const { insertPosition, component } = props;
+  return (
+    <SchemaInitializer.Button
+      insertPosition={insertPosition}
+      style={{
+        marginLeft: 8
+      }}
+      items={[
+        {
+          key: 'media',
+          type: 'itemGroup',
+          title: 'Enable actions',
+          children: [
+            {
+              type: 'item',
+              title: '{{t("Action 1")}}',
+              component: 'ActionInitializer',
+              schema: {
+                title: 'Action 1',
+                'x-component': 'Action',
+                'x-action': 'action1', // x-action，按钮的唯一标识（在 action bar 里）
+                'x-align': 'left', // 左边、右边
+              },
+            },
+            {
+              type: 'item',
+              title: '{{t("Action 2")}}',
+              component: 'ActionInitializer',
+              schema: {
+                title: 'Action 2',
+                'x-component': 'Action',
+                'x-action': 'action2',
+                'x-align': 'right',
+              },
+            },
+          ],
+        },
+      ]}
+      component={component}
+      title={component ? undefined : 'Configure actions'}
+    />
+  );
+};
+
+const schema: ISchema = {
+  type: 'object',
+  properties: {
+    actions: {
+      type: 'void',
+      'x-component': 'ActionBar',
+      'x-initializer': 'AddActionButton',
+      'x-uid': uid(),
+      properties: {
+        a1: {
+          title: 'Action 1',
+          'x-component': 'Action',
+          'x-action': 'action1',
+          'x-align': 'left',
+        },
+      },
+    },
+  },
+};
+
+export default function App() {
+  return (
+    <SchemaComponentProvider designable components={{ ActionBar, Action }}>
+      <SchemaInitializerProvider initializers={{ AddActionButton }}>
+        <SchemaComponent schema={schema} />
+      </SchemaInitializerProvider>
+    </SchemaComponentProvider>
+  );
+}
diff --git a/packages/core/client/src/schema-component/antd/action/index.md b/packages/core/client/src/schema-component/antd/action/index.md
index 539e33fe0..29d8079a4 100644
--- a/packages/core/client/src/schema-component/antd/action/index.md
+++ b/packages/core/client/src/schema-component/antd/action/index.md
@@ -42,3 +42,7 @@ group:
 <code src="./demos/demo4.tsx"/>
 
 <code src="./demos/demo5.tsx"/>
+
+### ActionBar
+
+<code src="./demos/demo6.tsx"/>