{"_id":"@digiforce-cloud/dvd-plugin-datasource-pane","_rev":"1-71eafe13f5a9abed217149cb1baec4e6","name":"@digiforce-cloud/dvd-plugin-datasource-pane","dist-tags":{"latest":"1.0.6"},"versions":{"1.0.6":{"name":"@digiforce-cloud/dvd-plugin-datasource-pane","version":"1.0.6","description":"低代码引擎数据源面板","main":"lib/index.js","scripts":{"start":"build-scripts start","build":"build-scripts build","test":"ava","test:snapshot":"ava --update-snapshots"},"ava":{"compileEnhancements":false,"snapshotDir":"test/fixtures/__snapshots__","extensions":["ts"],"require":["ts-node/register"]},"license":"MIT","devDependencies":{"@alib/build-scripts":"^0.1.32","@alifd/theme-lowcode-light":"^0.2.1","@alilc/build-plugin-alt":"^1.0.0","@digiforce-cloud/dvd-engine":"^1.0.14","@digiforce-cloud/dvd-shell":"^1.0.0","@digiforce-cloud/dvd-types":"beta","@types/babel-types":"^7.0.9","@types/babel__preset-env":"^7.9.2","@types/react":"^16.9.13","@types/react-dom":"^16.9.4","@types/traverse":"^0.6.32","build-plugin-fusion":"^0.1.9","build-plugin-moment-locales":"^0.1.3","monaco-editor":"^0.21.0"},"peerDependencies":{"@alifd/next":"^1.20.28","moment":"^2.29.1"},"dependencies":{"@alifd/next":"^1.25.13","@babel/core":"^7.15.8","@babel/parser":"^7.15.8","@babel/preset-env":"^7.15.8","@babel/preset-react":"^7.14.5","@babel/standalone":"^7.15.8","@babel/traverse":"^7.15.4","@babel/types":"^7.15.6","babel-plugin-transform-remove-strict-mode":"^0.0.2","classnames":"^2.3.1","js-beautify":"^1.14.0","react":"^16.8.1","react-dom":"^16.8.1","@digiforce-cloud/dvd-plugin-base-monaco-editor":"^1.0.0","@digiforce-cloud/dvd-types":"^1.0.0-beta.3","@formily/core":"^2.1.12","@formily/next":"^2.1.12","@formily/react":"^2.1.12","@types/lodash":"^4.14.178","@xstate/react":"^1.6.1","ajv":"^6.12.4","lodash":"^4.17.20","react-copy-to-clipboard":"^5.0.4","react-dnd":"^14.0.4","react-dnd-html5-backend":"^14.0.2","react-error-boundary":"^3.1.4","svgo":"2.x","traverse":"^0.6.6","xstate":"^4.26.0"},"homepage":"https://unpkg.com/@digiforce-cloud/dvd-plugin-datasource-pane@1.0.6/build/index.html","types":"./lib/index.d.ts","gitHead":"6d9681da088b877ddc02bf95fd7de86a5ea9b943","_id":"@digiforce-cloud/dvd-plugin-datasource-pane@1.0.6","_nodeVersion":"16.17.0","_npmVersion":"8.15.0","dist":{"integrity":"sha512-kUheNaDN+7NvWVk3Eg194cwLa/owHCohnAht4h6UCRuX/Rtxk+GPA2tNtDtRCXkGQ7CrZqjFetVq1aZloxmkbQ==","shasum":"31133e39405022452d8922507f1317b87c4ef475","tarball":"https://registry.npmjs.org/@digiforce-cloud/dvd-plugin-datasource-pane/-/dvd-plugin-datasource-pane-1.0.6.tgz","fileCount":109,"unpackedSize":227678,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEvfWuehjnnk3EA+qKRlMWxRgJDADIf/R/PWnP8doQlqAiB1BcVbwanQbGYWrPWuyR2gt4mzLjd3geTKqdtYAOZ2Wg=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjIiVJACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqt6w//a0ae1fxYaTfviB8twKS3qRpffIo1RCJRofbtorHw1gT5UfDX\r\nWlVaVz9mteceiTy/J9cO6XjGXIZZBlYhRG8AaXiAAUdnDlsIjbkds9pE2OMv\r\npNzqICcsBUIsa7SDjcEbJE6HzqgKbxpFZ8liEmYlHix+fNmOBCW8vZSB7pM6\r\ngMozuNfn9p/afugLt3WvTzJPcwv3S6rgbH7CCzVD5CPy2pAvDCxt4k1ZQ9fW\r\nTlQ7gNgFSQFvqyx74co/nkVo1/VHZ2lzC5HvRbzxiZAiQb12ZwKQ6VtsphuQ\r\nMyf14Vj7xot5B4Kn4UtfudZYMw/CdAJ6Lvaztzp87RG1ocZz3E1TsRxbSb1E\r\ntltKEvbGPR1tILQXWN9g1KNPHu5UFNvthxTNptZdQxyBriWaxKehVAQj4fmn\r\nrCphjB6Lg/gay/sodESXZcgenQq0cOXKOEgbfOLnsWsewqWKKb+jzCkXt9KX\r\nBOfkNupeMmPIHplQB8z0zdFMhWaFcho5zjHn8sNktICMsJ1qymzPnTGEauXW\r\njo7be6/3qiGFDm3fIzZYBpMuprMVjtECLK32g5lnID0Cz+dvM24NEg3HSjsW\r\n7+bw2NevC1p/pXpDI6Tz8UgsWxF9DczpTnhFSWYysnUvPKo75WaKPsTUotew\r\n3IH/bUAhOrv3Ex2Pp18KuN+6Mqhkb8uF5d8=\r\n=acR2\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"},"directories":{},"maintainers":[{"name":"thodinh.sg","email":"d.tr.tho@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/dvd-plugin-datasource-pane_1.0.6_1663182152956_0.7346356983957907"},"_hasShrinkwrap":false}},"time":{"created":"2022-09-14T19:02:32.839Z","1.0.6":"2022-09-14T19:02:33.530Z","modified":"2022-09-26T03:14:08.985Z"},"maintainers":[{"email":"locngo@innoria.com","name":"locngo-innoria"},{"email":"d.tr.tho@gmail.com","name":"thodinh.sg"}],"description":"低代码引擎数据源面板","homepage":"https://unpkg.com/@digiforce-cloud/dvd-plugin-datasource-pane@1.0.6/build/index.html","license":"MIT","readme":"## 低代码引擎 - 数据源面板插件\n\n配置页面的数据源。\n\n一个 pluginProps 的例子\n\n```\n{\n  importPlugins: [],\n  exportPlugins: [],\n  formComponents: {},\n  tagSelector: () => {},\n  dataSourceTypes: [\n    {\n      type: 'mopen',\n      schema: {\n        type: 'object',\n        properties: {\n          options: {\n            type: 'object',\n            properties: {\n              uri: {\n                title: 'api',\n              },\n              v: {\n                title: 'v',\n                type: 'string',\n              },\n              appKey: {\n                title: 'appKey',\n                type: 'string',\n              },\n            },\n          },\n        },\n      },\n    },\n  ],\n}\n```\n\n使用预置的数据源类型\n\n```\nimport {\n  DataSourceTypeFetch,\n  DataSourceTypeJsonp,\n  DataSourceTypeMtop,\n} from '@digiforce-cloud/dvd-plugin-datasource-pane';\n```\n\n## 如何定制\n\n## 定制数据源类型\n\n### 类型定义\n\n内置 fetch，mtop，jsonp 类型，支持传入自定义类型。\n\n```\ntype DataSourceType = {\n  type: string;\n  optionsSchema: JSONSchema6\n};\n```\n\n数据源类型需要在集团规范约束下扩展。目前只允许在 options 下添加扩展字段。\n\n比如 mtop 类型，需要添加 options.v （版本）字段。\n\n### formily 组件\n\n### 下钻\n\n## 定制数据源信息展示标签\n\n通过 renderDataSourceInfoTags 方法控制数据源的信息展示\n\n```\n(dataSourceConfig) => {\n  if (dataSourceConfig.type = 'fetch') {\n    return [{\n      type: 'primary',\n      content: dataSourceConfig.type\n    }];\n  }\n}\n```\n\n## 定制导入插件\n\n### 导入组件示例\n\n导入组件引入方式参考 pluginProps \n```\nimport { DataSourceImportPluginTest } from './DataSourceImportPluginTest';\n\n{\n  ...\n    importPlugins: [\n        {\n            name: '这里可以导入',\n            title: '这里可以导入',\n            component: DataSourceImportPluginTest,\n            componentProps: {\n                onImport: (res) => {\n                    console.log('ceshi ')\n\n                },\n                onCancel: () => {\n                    console.log('ceshi2 ')\n\n                }\n            }\n        }\n    ],\n        exportPlugins: [],\n            formComponents: { },\n  ...\n}\n\n// DataSourceImportPluginTest.jsx\n\n/**\n * 源码导入插件\n * @todo editor 关联 types，并提供详细的出错信息\n */\nimport React, { PureComponent } from 'react';\nimport { Button } from '@alifd/next';\nimport _noop from 'lodash/noop';\nimport _isArray from 'lodash/isArray';\nimport _last from 'lodash/last';\nimport _isPlainObject from 'lodash/isPlainObject';\nimport { RuntimeDataSourceConfig as DataSourceConfig } from '@digiforce-cloud/dvd-datasource-types';\nimport { JSONSchema6 } from 'json-schema';\nimport type { ComponentType } from 'react';\nexport interface DataSourceType {\n    type: string;\n    schema: JSONSchema6;\n    plugin?: ComponentType;\n}\nexport interface DataSourcePaneImportPluginComponentProps {\n    dataSourceTypes: DataSourceType[];\n    onImport?: (dataSourceList: DataSourceConfig[]) => void;\n    onCancel?: () => void;\n}\nexport interface DataSourceImportPluginCodeProps\n    extends DataSourcePaneImportPluginComponentProps {\n    defaultValue?: DataSourceConfig[];\n}\nexport interface DataSourceImportPluginCodeState {\n    code: string;\n    isCodeValid: boolean;\n}\nexport class DataSourceImportPluginCode extends PureComponent<\n    DataSourceImportPluginCodeProps,\n    DataSourceImportPluginCodeState\n> {\n    handleComplete = () => {\n        console.log('确认')\n    };\n    onCancel = () => {\n        console.log('取消')\n    };\n    render() {\n        return (\n            <div className=\"lowcode-plugin-datasource-import-plugin-code\">\n                此处代码可以自定义\n                <p className=\"btns\">\n                    <Button onClick={this.onCancel}>取消</Button>\n                    <Button type=\"primary\" onClick={this.handleComplete}>\n                        确认\n                    </Button>\n                </p>\n            </div>\n        );\n    }\n}\n\n```\n\n具体的 component 可参考 DataSourceImportPluginCode\n [查看](https://github.com/alibaba/lowcode-plugins/blob/main/packages/plugin-datasource-pane/src/components/DataSourceImportPluginCode/DataSourceImportPluginCode.tsx)\n\n demo 截图\n ![Alt](https://user-images.githubusercontent.com/14235113/186659341-dff511e8-f032-423c-8be7-e0cc281f3964.png)\n\n\n\n\n## 定制导出插件\n\nWIP\n\n# 事件钩子\n\n# 依赖\n\n* formily v2\n* xstate\n* manaco\n* react-dnd\n\n\n# 和之前版本的区别\n\n* 支持导出并自定义导出插件\n* 支持排序\n* 支持信息标签\n* 体验更好的对象参数编辑\n* 支持字段配置表达式\n\n# 贡献代码\n\n欢迎提 MR\n\n# 未来计划\n\n* 详情页下钻\n* 支持多语言处理\n* 单元测试\n\n\n# 参考\n\n* [搭建协议规范](https://lowcode-engine.cn/lowcode)","readmeFilename":"README.md"}