fix(client/demos): gird x-initializer

This commit is contained in:
chenos 2022-12-22 20:01:28 +08:00
parent 5ec50d32bb
commit d2275455be

View File

@ -1,18 +1,60 @@
import { ISchema, observer, useFieldSchema } from '@formily/react'; import { ISchema, observer, useFieldSchema } from '@formily/react';
import { uid } from '@formily/shared'; import { uid } from '@formily/shared';
import { import {
BlockItem,
CardItem, CardItem,
DragHandler, DragHandler,
Form,
Grid, Grid,
Markdown, Markdown,
SchemaComponent, SchemaComponent,
SchemaComponentProvider, SchemaComponentProvider,
SchemaInitializer,
SchemaInitializerProvider SchemaInitializerProvider
} from '@nocobase/client'; } from '@nocobase/client';
import React from 'react'; import React from 'react';
const gridRowColWrap = (schema) => {
return {
type: 'void',
'x-component': 'Grid.Row',
properties: {
[uid()]: {
type: 'void',
'x-component': 'Grid.Col',
properties: {
[schema.name || uid()]: schema,
},
},
},
};
};
export const AddBlockButton = (props: any) => {
const { insertPosition, component } = props;
return (
<SchemaInitializer.Button
insertPosition={insertPosition}
wrap={gridRowColWrap}
items={[
{
key: 'media',
type: 'itemGroup',
title: 'Other blocks',
children: [
{
key: 'markdown',
type: 'item',
title: 'Markdown',
component: 'MarkdownBlockInitializer',
},
],
},
]}
component={component}
title={component ? undefined : 'Add block'}
/>
);
};
const Block = observer((props) => { const Block = observer((props) => {
const fieldSchema = useFieldSchema(); const fieldSchema = useFieldSchema();
return ( return (
@ -29,7 +71,7 @@ const schema: ISchema = {
grid: { grid: {
type: 'void', type: 'void',
'x-component': 'Grid', 'x-component': 'Grid',
'x-item-initializer': 'AddBlockItem', 'x-initializer': 'AddBlockButton',
'x-uid': uid(), 'x-uid': uid(),
properties: {}, properties: {},
}, },
@ -38,8 +80,8 @@ const schema: ISchema = {
export default function App() { export default function App() {
return ( return (
<SchemaComponentProvider components={{ BlockItem, Block, Grid, CardItem, Markdown, Form }}> <SchemaComponentProvider components={{ Grid, CardItem, Markdown }}>
<SchemaInitializerProvider> <SchemaInitializerProvider initializers={{ AddBlockButton }}>
<SchemaComponent schema={schema} /> <SchemaComponent schema={schema} />
</SchemaInitializerProvider> </SchemaInitializerProvider>
</SchemaComponentProvider> </SchemaComponentProvider>