diff --git a/packages/app/client/tsconfig.json b/packages/app/client/tsconfig.json index c1f4a369b..f5e95caa1 100644 --- a/packages/app/client/tsconfig.json +++ b/packages/app/client/tsconfig.json @@ -11,7 +11,7 @@ "baseUrl": "./", "strict": true, "paths": { - "@nocobase/plugin-*-sample/client": ["../../samples/*/src/client"], + "@nocobase/plugin-sample-*/client": ["../../samples/*/src/client"], "@nocobase/plugin-*/client": ["../../plugins/*/src/client"], "@nocobase/utils/client": ["../../core/utils/src/client"], "@nocobase/*": ["../../core/*/src/"], diff --git a/packages/samples/custom-block/README.md b/packages/samples/custom-block/README.md new file mode 100644 index 000000000..986d90d78 --- /dev/null +++ b/packages/samples/custom-block/README.md @@ -0,0 +1,28 @@ +# Hello sample + +## Register + +```ts +yarn pm add sample-custom-block +``` + +## Activate + +```bash +yarn pm enable sample-custom-block +``` + +## Launch the app + +```bash +# for development +yarn dev + +# for production +yarn build +yarn start +``` + +## Demo + +[gif] diff --git a/packages/samples/custom-block/client.d.ts b/packages/samples/custom-block/client.d.ts new file mode 100755 index 000000000..765db9222 --- /dev/null +++ b/packages/samples/custom-block/client.d.ts @@ -0,0 +1,4 @@ +// @ts-nocheck +export * from './lib/client'; +export { default } from './lib/client'; + diff --git a/packages/samples/custom-block/client.js b/packages/samples/custom-block/client.js new file mode 100755 index 000000000..238820257 --- /dev/null +++ b/packages/samples/custom-block/client.js @@ -0,0 +1,30 @@ +"use strict"; + +function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } + +function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +var _index = _interopRequireWildcard(require("./lib/client")); + +Object.defineProperty(exports, "__esModule", { + value: true +}); +var _exportNames = {}; +Object.defineProperty(exports, "default", { + enumerable: true, + get: function get() { + return _index.default; + } +}); + +Object.keys(_index).forEach(function (key) { + if (key === "default" || key === "__esModule") return; + if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return; + if (key in exports && exports[key] === _index[key]) return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _index[key]; + } + }); +}); diff --git a/packages/samples/custom-block/package.json b/packages/samples/custom-block/package.json new file mode 100644 index 000000000..902188ffb --- /dev/null +++ b/packages/samples/custom-block/package.json @@ -0,0 +1,11 @@ +{ + "name": "@nocobase/plugin-sample-custom-block", + "version": "0.7.4-alpha.7", + "main": "lib/server/index.js", + "dependencies": {}, + "devDependencies": { + "@nocobase/client": "0.7.4-alpha.7", + "@nocobase/server": "0.7.4-alpha.7", + "@nocobase/test": "0.7.4-alpha.7" + } +} diff --git a/packages/samples/custom-block/server.d.ts b/packages/samples/custom-block/server.d.ts new file mode 100755 index 000000000..e70edb928 --- /dev/null +++ b/packages/samples/custom-block/server.d.ts @@ -0,0 +1,4 @@ +// @ts-nocheck +export * from './lib/server'; +export { default } from './lib/server'; + diff --git a/packages/samples/custom-block/server.js b/packages/samples/custom-block/server.js new file mode 100755 index 000000000..d06a7eb92 --- /dev/null +++ b/packages/samples/custom-block/server.js @@ -0,0 +1,30 @@ +"use strict"; + +function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } + +function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } + +var _index = _interopRequireWildcard(require("./lib/server")); + +Object.defineProperty(exports, "__esModule", { + value: true +}); +var _exportNames = {}; +Object.defineProperty(exports, "default", { + enumerable: true, + get: function get() { + return _index.default; + } +}); + +Object.keys(_index).forEach(function (key) { + if (key === "default" || key === "__esModule") return; + if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return; + if (key in exports && exports[key] === _index[key]) return; + Object.defineProperty(exports, key, { + enumerable: true, + get: function get() { + return _index[key]; + } + }); +}); diff --git a/packages/samples/custom-block/src/client/HelloDesigner.tsx b/packages/samples/custom-block/src/client/HelloDesigner.tsx new file mode 100644 index 000000000..d1afc02da --- /dev/null +++ b/packages/samples/custom-block/src/client/HelloDesigner.tsx @@ -0,0 +1,18 @@ +import { useFieldSchema } from '@formily/react'; +import { GeneralSchemaDesigner, SchemaSettings, useCollection } from '@nocobase/client'; +import React from 'react'; + +export const HelloDesigner = () => { + const { name, title } = useCollection(); + const fieldSchema = useFieldSchema(); + return ( + + + + ); +}; diff --git a/packages/samples/custom-block/src/client/index.tsx b/packages/samples/custom-block/src/client/index.tsx new file mode 100644 index 000000000..776c681a8 --- /dev/null +++ b/packages/samples/custom-block/src/client/index.tsx @@ -0,0 +1,47 @@ +import { TableOutlined } from '@ant-design/icons'; +import { SchemaComponentOptions, SchemaInitializer, SchemaInitializerContext } from '@nocobase/client'; +import React, { useContext } from 'react'; +import { useTranslation } from 'react-i18next'; +import { HelloDesigner } from './HelloDesigner'; + +export const HelloBlockInitializer = (props) => { + const { insert } = props; + const { t } = useTranslation(); + return ( + } + onClick={() => { + insert({ + type: 'void', + 'x-component': 'CardItem', + 'x-designer': 'HelloDesigner', + properties: { + hello: { + type: 'void', + 'x-component': 'div', + 'x-content': 'Hello World', + }, + }, + }); + }} + title={t('Hello block')} + /> + ); +}; + +export default React.memo((props) => { + const items = useContext(SchemaInitializerContext); + const children = items.BlockInitializers.items[2].children; + children.push({ + key: 'customBlock', + type: 'item', + title: '{{t("Hello block")}}', + component: 'HelloBlockInitializer', + }); + return ( + + {props.children} + + ); +}); diff --git a/packages/samples/custom-block/src/index.ts b/packages/samples/custom-block/src/index.ts new file mode 100644 index 000000000..7ddad5814 --- /dev/null +++ b/packages/samples/custom-block/src/index.ts @@ -0,0 +1 @@ +export { default } from './server'; diff --git a/packages/samples/custom-block/src/server/index.ts b/packages/samples/custom-block/src/server/index.ts new file mode 100644 index 000000000..af5edec85 --- /dev/null +++ b/packages/samples/custom-block/src/server/index.ts @@ -0,0 +1,19 @@ +import { InstallOptions, Plugin } from '@nocobase/server'; + +export class CustomBlockPlugin extends Plugin { + getName(): string { + return this.getPackageName(__dirname); + } + + beforeLoad() { + // TODO + } + + async load() {} + + async install(options: InstallOptions) { + // TODO + } +} + +export default CustomBlockPlugin; diff --git a/packages/samples/hello/src/client/index.tsx b/packages/samples/hello/src/client/index.tsx index 712bafc36..aa2b45d59 100644 --- a/packages/samples/hello/src/client/index.tsx +++ b/packages/samples/hello/src/client/index.tsx @@ -1,11 +1,5 @@ import { TableOutlined } from '@ant-design/icons'; -import { - SchemaComponentOptions, - SchemaInitializer, - SchemaInitializerContext, - SettingsCenterProvider -} from '@nocobase/client'; -import { Card } from 'antd'; +import { SchemaComponentOptions, SchemaInitializer, SchemaInitializerContext } from '@nocobase/client'; import React, { useContext } from 'react'; import { useTranslation } from 'react-i18next'; import { HelloDesigner } from './HelloDesigner'; @@ -46,23 +40,8 @@ export default React.memo((props) => { component: 'HelloBlockInitializer', }); return ( - Hello Settings, - }, - }, - }, - }} - > - - {props.children} - - + + {props.children} + ); });