Repository: alibaba/x-render Branch: master Commit: 8912e5141893 Files: 709 Total size: 1.3 MB Directory structure: gitextract_d43v9j5z/ ├── .dumi/ │ ├── loading.tsx │ ├── theme/ │ │ ├── builtins/ │ │ │ └── TypeSchema/ │ │ │ ├── index.less │ │ │ └── index.tsx │ │ ├── layouts/ │ │ │ └── GlobalLayout/ │ │ │ └── index.tsx │ │ └── slots/ │ │ └── Header/ │ │ ├── GithubLink.tsx │ │ ├── Navigation.tsx │ │ ├── ThemeSwitch.tsx │ │ ├── index.less │ │ └── index.tsx │ └── tmp-production/ │ ├── core/ │ │ ├── EmptyRoute.tsx │ │ ├── defineApp.ts │ │ ├── exportStaticRuntimePlugin.ts │ │ ├── helmet.ts │ │ ├── helmetContext.ts │ │ ├── history.ts │ │ ├── historyIntelli.ts │ │ ├── plugin.ts │ │ ├── pluginConfig.ts │ │ ├── pluginConfigJoi.d.ts │ │ ├── polyfill.ts │ │ ├── route.tsx │ │ └── terminal.ts │ ├── dumi/ │ │ ├── exportStaticRuntimePlugin.ts │ │ ├── exports.ts │ │ ├── locales/ │ │ │ ├── config.ts │ │ │ └── runtime.tsx │ │ ├── meta/ │ │ │ ├── atoms.ts │ │ │ ├── index.ts │ │ │ ├── runtime.ts │ │ │ └── tabs.ts │ │ └── theme/ │ │ ├── ContextWrapper.tsx │ │ ├── builtins/ │ │ │ ├── API.ts │ │ │ ├── Badge.ts │ │ │ ├── Container.ts │ │ │ ├── Previewer.ts │ │ │ ├── SourceCode.ts │ │ │ └── Table.ts │ │ ├── layouts/ │ │ │ └── DocLayout.ts │ │ └── slots/ │ │ ├── ColorSwitch.ts │ │ ├── Content.ts │ │ ├── ContentTabs.ts │ │ ├── Features.ts │ │ ├── Footer.ts │ │ ├── HeadeExtra.ts │ │ ├── Header.ts │ │ ├── Hero.ts │ │ ├── HeroTitle.ts │ │ ├── LangSwitch.ts │ │ ├── Logo.ts │ │ ├── Navbar.ts │ │ ├── NavbarExtra.ts │ │ ├── NotFound.ts │ │ ├── PreviewerActions.ts │ │ ├── PreviewerActionsExtra.ts │ │ ├── RtlSwitch.ts │ │ ├── SearchBar.ts │ │ ├── SearchResult.ts │ │ ├── Sidebar.ts │ │ ├── SocialIcon.ts │ │ └── Toc.ts │ ├── exports.ts │ ├── testBrowser.tsx │ └── umi.ts ├── .dumirc.ts ├── .editorconfig ├── .fatherrc.js ├── .github/ │ ├── ISSUE_TEMPLATE/ │ │ ├── bug-report.md │ │ └── feature_request.md │ └── workflows/ │ ├── ci.yml │ ├── coverage.yml │ ├── deploy.yml │ ├── emoji-helper.yml │ ├── issue-helper.yml │ └── mirror.yml ├── .gitignore ├── .npmrc ├── .prettierignore ├── .prettierrc ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── README.md ├── app.ts ├── docs/ │ ├── data-render/ │ │ ├── data/ │ │ │ └── basic.ts │ │ ├── index.md │ │ └── schema/ │ │ └── basic.ts │ ├── form-render/ │ │ ├── advaced-example.md │ │ ├── advanced-bind.md │ │ ├── advanced-layout.md │ │ ├── advanced-linkage.md │ │ ├── advanced-path.md │ │ ├── advanced-slimrender.md │ │ ├── advanced-validate.md │ │ ├── advanced-widget.md │ │ ├── api-props.md │ │ ├── api-schema.md │ │ ├── changelog.md │ │ ├── demo/ │ │ │ ├── FormRender.jsx │ │ │ ├── bind.tsx │ │ │ ├── defaultChange.tsx │ │ │ ├── dymic.tsx │ │ │ ├── form-slim/ │ │ │ │ ├── basic.tsx │ │ │ │ └── form-list.tsx │ │ │ ├── linkage/ │ │ │ │ └── list.tsx │ │ │ ├── outLabelCol.tsx │ │ │ ├── validateFields.tsx │ │ │ └── widget/ │ │ │ ├── basic.tsx │ │ │ ├── depend-linkage.tsx │ │ │ ├── desc-widget.tsx │ │ │ ├── label-widget.tsx │ │ │ ├── linkage.tsx │ │ │ └── readonly-widget.tsx │ │ ├── disaply-search.md │ │ ├── display-row.md │ │ ├── faq.md │ │ ├── index.md │ │ ├── migrate.md │ │ ├── schema/ │ │ │ ├── baseControl.ts │ │ │ ├── basic.ts │ │ │ ├── cellSpan.ts │ │ │ ├── schema.ts │ │ │ ├── simple.ts │ │ │ └── span.ts │ │ ├── test/ │ │ │ ├── bigJson.tsx │ │ │ ├── bind.tsx │ │ │ ├── dependencies.tsx │ │ │ ├── disaply-column.md │ │ │ ├── removeHidden.tsx │ │ │ └── test.md │ │ └── utils/ │ │ └── index.js │ ├── form-render-mobile/ │ │ ├── api.md │ │ ├── demo/ │ │ │ ├── allWidget.tsx │ │ │ ├── basic.tsx │ │ │ ├── card.tsx │ │ │ ├── collaspa.tsx │ │ │ ├── group.tsx │ │ │ ├── index.tsx │ │ │ └── list.tsx │ │ ├── disaply.md │ │ ├── index.md │ │ └── test/ │ │ ├── index.tsx │ │ └── test.md │ ├── index.en-US.md │ ├── index.zh-CN.md │ ├── playground/ │ │ ├── controller/ │ │ │ ├── index.css │ │ │ └── index.tsx │ │ ├── customized/ │ │ │ └── AsyncSelect.js │ │ ├── example/ │ │ │ └── expression.ts │ │ ├── index.less │ │ ├── index.md │ │ ├── index.tsx │ │ ├── json/ │ │ │ ├── basic.json │ │ │ ├── demo.json │ │ │ ├── dynamic-function.js │ │ │ ├── format.json │ │ │ ├── function.json │ │ │ ├── input.json │ │ │ ├── new-feature.json │ │ │ ├── select.json │ │ │ └── simplest.json │ │ └── serialize.js │ ├── schema-builder/ │ │ ├── api.md │ │ └── index.md │ ├── schema-builder-online/ │ │ └── index.md │ ├── table-render/ │ │ ├── .test/ │ │ │ └── test.md │ │ ├── api.md │ │ ├── basic.md │ │ ├── collapsed.md │ │ ├── custom-table.md │ │ ├── demo/ │ │ │ ├── basic/ │ │ │ │ └── index.tsx │ │ │ ├── display/ │ │ │ │ └── custom-table.tsx │ │ │ └── toolbar/ │ │ │ ├── basic.tsx │ │ │ └── selection-tool.tsx │ │ ├── index.md │ │ ├── migrate.md │ │ ├── noSearch.md │ │ ├── promptly-search.md │ │ ├── static/ │ │ │ ├── request.ts │ │ │ ├── search.ts │ │ │ └── table.tsx │ │ ├── tabs.md │ │ ├── toolbar.md │ │ └── valueType.md │ ├── tools/ │ │ ├── proptypes/ │ │ │ └── index.md │ │ └── vscode/ │ │ └── index.md │ └── xflow/ │ ├── FlowProvider.md │ ├── api.md │ ├── best-practices.md │ ├── custom-node-setting.md │ ├── custom-node-view.md │ ├── data/ │ │ └── basic.ts │ ├── demo/ │ │ ├── basic/ │ │ │ ├── index.tsx │ │ │ └── setting.tsx │ │ ├── best/ │ │ │ ├── basic/ │ │ │ │ ├── TextEllipsis/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── const.tsx │ │ │ │ ├── header.tsx │ │ │ │ ├── index.less │ │ │ │ ├── index.tsx │ │ │ │ ├── setting.tsx │ │ │ │ ├── showSwitchNode.tsx │ │ │ │ └── tools.tsx │ │ │ └── demo2/ │ │ │ ├── CustomSvg.tsx │ │ │ ├── TextEllipsis/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── const.tsx │ │ │ ├── header.tsx │ │ │ ├── index.less │ │ │ ├── index.tsx │ │ │ ├── setting.tsx │ │ │ ├── showSwitchNode.tsx │ │ │ └── tools.tsx │ │ ├── custom-flow/ │ │ │ ├── advancedLinkageCase/ │ │ │ │ ├── customWidget.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── setting.tsx │ │ │ ├── customWidget.tsx │ │ │ ├── fullCase/ │ │ │ │ ├── components/ │ │ │ │ │ ├── ReadOnlyPanel.tsx │ │ │ │ │ ├── TagWidget.tsx │ │ │ │ │ ├── customWidget.tsx │ │ │ │ │ └── secondTagWidget.tsx │ │ │ │ ├── const.ts │ │ │ │ ├── index.less │ │ │ │ ├── index.tsx │ │ │ │ └── setting.ts │ │ │ ├── index.tsx │ │ │ └── setting.tsx │ │ ├── flow-provider/ │ │ │ ├── edges.ts │ │ │ ├── index.tsx │ │ │ ├── nodes.ts │ │ │ └── setting.tsx │ │ ├── layout/ │ │ │ ├── LR/ │ │ │ │ ├── index.tsx │ │ │ │ └── setting.tsx │ │ │ └── TB/ │ │ │ ├── index.tsx │ │ │ └── setting.tsx │ │ ├── log/ │ │ │ ├── buildIn-log/ │ │ │ │ ├── CustomGroupTittle.tsx │ │ │ │ ├── DetailLogWidget.tsx │ │ │ │ ├── index.tsx │ │ │ │ ├── setting.tsx │ │ │ │ └── utils.tsx │ │ │ ├── custom-log/ │ │ │ │ ├── index.tsx │ │ │ │ ├── setting.tsx │ │ │ │ └── utils.tsx │ │ │ ├── index.tsx │ │ │ ├── runNode/ │ │ │ │ ├── index.tsx │ │ │ │ ├── setting.tsx │ │ │ │ └── utils.tsx │ │ │ ├── setting.tsx │ │ │ └── utils.tsx │ │ ├── nodeSetting/ │ │ │ ├── data.tsx │ │ │ ├── fullDemo/ │ │ │ │ ├── CustomImg.tsx │ │ │ │ ├── CustomSvg.tsx │ │ │ │ ├── index.tsx │ │ │ │ └── settings.ts │ │ │ ├── index.tsx │ │ │ └── setting.tsx │ │ ├── nodeWidget/ │ │ │ ├── index.less │ │ │ ├── index.tsx │ │ │ └── setting.ts │ │ ├── parallelNode/ │ │ │ ├── custome/ │ │ │ │ ├── index.tsx │ │ │ │ └── setting.tsx │ │ │ ├── index.tsx │ │ │ └── setting.tsx │ │ ├── quickStart/ │ │ │ └── index.tsx │ │ └── switchNode/ │ │ ├── customSwitchNode/ │ │ │ ├── index.tsx │ │ │ └── setting.tsx │ │ ├── index.tsx │ │ └── setting.tsx │ ├── index.md │ ├── layout.md │ ├── log.md │ ├── nodeBuildIn.md │ ├── nodeSetting.md │ ├── question.md │ ├── quickStart.md │ ├── schema/ │ │ ├── basic.ts │ │ ├── custom-settings.ts │ │ └── settings.ts │ ├── singlePointDebug.md │ └── updateLog.md ├── lerna.json ├── package.json ├── packages/ │ ├── chart-render/ │ │ ├── .fatherrc.ts │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ ├── src/ │ │ │ ├── components/ │ │ │ │ ├── ChartContainer/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── ChartProvider/ │ │ │ │ │ └── index.tsx │ │ │ │ └── Search/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── index.ts │ │ │ ├── utils/ │ │ │ │ ├── index.ts │ │ │ │ ├── store.ts │ │ │ │ └── type.ts │ │ │ └── widgets/ │ │ │ ├── Column/ │ │ │ │ └── index.tsx │ │ │ └── Pie/ │ │ │ └── index.tsx │ │ └── tsconfig.json │ ├── data-render/ │ │ ├── .fatherrc.js │ │ ├── CHANGELOG.md │ │ ├── CONTRIBUTING.md │ │ ├── LICENSE │ │ ├── README.md │ │ ├── package.json │ │ ├── src/ │ │ │ ├── core/ │ │ │ │ ├── index.less │ │ │ │ ├── index.tsx │ │ │ │ └── renderer.tsx │ │ │ ├── index.ts │ │ │ ├── models/ │ │ │ │ ├── context.ts │ │ │ │ ├── expression.ts │ │ │ │ ├── isHidden.ts │ │ │ │ ├── resolver.tsx │ │ │ │ └── store.ts │ │ │ ├── type.ts │ │ │ ├── utils/ │ │ │ │ └── common.ts │ │ │ ├── widgets/ │ │ │ │ ├── FButton/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FButtonFold/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FCard/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FCollapse/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FDescriptions/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FEncryption/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FIconLabel/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FImage/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FLabel/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FPanel/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FProgress/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FProgressBar/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FRadioGroup/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FRow/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FSpace/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FStatistic/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FSteps/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FSuckNav/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FTable/ │ │ │ │ │ ├── detalColumn.tsx │ │ │ │ │ └── index.tsx │ │ │ │ ├── FTabs/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FTags/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FText/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FTextEllipsis/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FTimeline/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── FTitle/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── FTooltip/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── components/ │ │ │ │ │ ├── BaseCollapse/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── BaseTable/ │ │ │ │ │ │ ├── basic.ts │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── CopyLabel/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── Encryption/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── IconLabel/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── IconView/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── InnerHtml/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── ReactNode/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── RequestTable/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── SuckTabs/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── TextEllipsis/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ └── TextView/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── index.ts │ │ │ │ └── utils/ │ │ │ │ ├── common.ts │ │ │ │ ├── createIconFont.ts │ │ │ │ └── hooks.ts │ │ │ └── withProvider.tsx │ │ └── tsconfig.json │ ├── form-render/ │ │ ├── .fatherrc.js │ │ ├── CHANGELOG.md │ │ ├── CONTRIBUTING.md │ │ ├── LICENSE │ │ ├── README.md │ │ ├── __tests__/ │ │ │ ├── core-utils.spec.ts │ │ │ ├── demo.tsx │ │ │ ├── form-demo.tsx │ │ │ ├── form-fields.spec.tsx │ │ │ ├── form.spec.tsx │ │ │ ├── get-descriptor.spec.ts │ │ │ ├── schema.ts │ │ │ └── utils.spec.ts │ │ ├── package.json │ │ ├── src/ │ │ │ ├── derivative/ │ │ │ │ ├── SearchForm/ │ │ │ │ │ ├── ActionView.tsx │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ └── SlimRender/ │ │ │ │ └── index.tsx │ │ │ ├── form-core/ │ │ │ │ ├── connectForm.tsx │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── index.ts │ │ │ ├── locales/ │ │ │ │ ├── en_US.ts │ │ │ │ ├── index.ts │ │ │ │ └── zh_CN.ts │ │ │ ├── models/ │ │ │ │ ├── bindValues.ts │ │ │ │ ├── context.ts │ │ │ │ ├── expression.ts │ │ │ │ ├── fieldShouldUpdate.ts │ │ │ │ ├── filterValuesHidden.ts │ │ │ │ ├── filterValuesUndefined.ts │ │ │ │ ├── flattenSchema.ts │ │ │ │ ├── formCoreUtils.ts │ │ │ │ ├── formDataSkeleton.ts │ │ │ │ ├── layout.ts │ │ │ │ ├── mapping.tsx │ │ │ │ ├── sortProperties.ts │ │ │ │ ├── store.ts │ │ │ │ ├── transformProps.ts │ │ │ │ ├── useForm.ts │ │ │ │ ├── validateMessage.ts │ │ │ │ └── validates.ts │ │ │ ├── render-core/ │ │ │ │ ├── FieldItem/ │ │ │ │ │ ├── field.tsx │ │ │ │ │ ├── index.tsx │ │ │ │ │ ├── main.tsx │ │ │ │ │ └── module.tsx │ │ │ │ ├── FieldList/ │ │ │ │ │ ├── field.tsx │ │ │ │ │ ├── index.tsx │ │ │ │ │ ├── main.tsx │ │ │ │ │ └── modules.tsx │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── type.ts │ │ │ ├── utils/ │ │ │ │ └── index.ts │ │ │ ├── widgets/ │ │ │ │ ├── ErrorSchema/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── boxCollapse/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── boxLineTitle/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── boxSubInline/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── boxcard/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── components/ │ │ │ │ │ ├── DatePicker/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── FButton/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── HeaderTitle/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── PanelView/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ └── TimePicker/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── fields/ │ │ │ │ │ ├── checkbox/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── checkboxes/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── color/ │ │ │ │ │ │ ├── alphahexMap.ts │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── date/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── dateRange/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── html/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── imageInput/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── input/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── number/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── percentSlider/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── radio/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── rate/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── select/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── slider/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── switch/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── textArea/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── time/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── timeRange/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── treeSelect/ │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── upload/ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ └── index.tsx │ │ │ │ │ └── urlInput/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── index.ts │ │ │ │ ├── listCard/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── listDrawer/ │ │ │ │ │ ├── drawerForm.tsx │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── listSimple/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── listTab/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── listTable/ │ │ │ │ │ ├── index.less │ │ │ │ │ ├── index.tsx │ │ │ │ │ └── tableCell.tsx │ │ │ │ ├── listVirtual/ │ │ │ │ │ ├── index.less │ │ │ │ │ ├── index.tsx │ │ │ │ │ └── virtualCell.tsx │ │ │ │ ├── utils/ │ │ │ │ │ ├── hooks.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ └── withFieldWrap.tsx │ │ │ │ └── voidTitle/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ └── withProvider.tsx │ │ └── tsconfig.json │ ├── form-render-mobile/ │ │ ├── .fatherrc.js │ │ ├── CHANGELOG.md │ │ ├── CONTRIBUTING.md │ │ ├── LICENSE │ │ ├── README.md │ │ ├── package.json │ │ ├── src/ │ │ │ ├── form-core/ │ │ │ │ ├── connectForm.tsx │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── index.tsx │ │ │ ├── locales/ │ │ │ │ ├── en_US.ts │ │ │ │ ├── index.ts │ │ │ │ └── zh_CN.ts │ │ │ ├── models/ │ │ │ │ ├── context.ts │ │ │ │ ├── store.ts │ │ │ │ ├── transformProps.ts │ │ │ │ └── useForm.ts │ │ │ ├── render-core/ │ │ │ │ ├── FieldItem/ │ │ │ │ │ ├── field.tsx │ │ │ │ │ ├── index.tsx │ │ │ │ │ ├── main.tsx │ │ │ │ │ └── module.tsx │ │ │ │ ├── FieldList/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ └── index.tsx │ │ │ ├── type.ts │ │ │ ├── utils/ │ │ │ │ └── index.ts │ │ │ ├── widgets/ │ │ │ │ ├── Card/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── Cascader/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── Collapse/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── DatePicker/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── Group/ │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── Html/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── Picker/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── Radio/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── index.less │ │ │ │ ├── index.tsx │ │ │ │ └── utils.ts │ │ │ └── withProvider.tsx │ │ └── tsconfig.json │ ├── table-render/ │ │ ├── .fatherrc.ts │ │ ├── CHANGELOG.md │ │ ├── CONTRIBUTION.md │ │ ├── LICENSE │ │ ├── README.md │ │ ├── __tests__/ │ │ │ └── utils.spec.ts │ │ ├── package.json │ │ ├── src/ │ │ │ ├── core/ │ │ │ │ ├── ErrorBoundary/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── SearchView/ │ │ │ │ │ └── index.tsx │ │ │ │ ├── TableView/ │ │ │ │ │ ├── copy.tsx │ │ │ │ │ ├── field.tsx │ │ │ │ │ ├── index.tsx │ │ │ │ │ └── widgets.tsx │ │ │ │ ├── ToolbarView/ │ │ │ │ │ ├── InteriorTool/ │ │ │ │ │ │ ├── ColumnSetting/ │ │ │ │ │ │ │ ├── index.less │ │ │ │ │ │ │ ├── index.tsx │ │ │ │ │ │ │ ├── item.tsx │ │ │ │ │ │ │ └── utils.ts │ │ │ │ │ │ ├── DensityIcon.tsx │ │ │ │ │ │ ├── FullScreenIcon.tsx │ │ │ │ │ │ ├── ReloadIcon.tsx │ │ │ │ │ │ └── index.tsx │ │ │ │ │ ├── TitleView.tsx │ │ │ │ │ ├── index.less │ │ │ │ │ └── index.tsx │ │ │ │ ├── index.less │ │ │ │ ├── index.tsx │ │ │ │ └── store.ts │ │ │ ├── index.tsx │ │ │ ├── locales/ │ │ │ │ ├── en_US.ts │ │ │ │ ├── index.ts │ │ │ │ └── zh_CN.ts │ │ │ ├── types.ts │ │ │ └── utils/ │ │ │ └── index.ts │ │ ├── tsconfig.json │ │ └── 开发文档.md │ └── x-flow/ │ ├── .fatherrc.js │ ├── CHANGELOG.md │ ├── CONTRIBUTING.md │ ├── LICENSE │ ├── README.md │ ├── package.json │ ├── src/ │ │ ├── XFlow.tsx │ │ ├── components/ │ │ │ ├── CandidateNode/ │ │ │ │ └── index.tsx │ │ │ ├── CustomEdge/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── CustomNode/ │ │ │ │ ├── index.less │ │ │ │ ├── index.tsx │ │ │ │ └── sourceHandle.tsx │ │ │ ├── FAutoComplete/ │ │ │ │ └── index.tsx │ │ │ ├── FlowProvider/ │ │ │ │ └── index.tsx │ │ │ ├── IconView/ │ │ │ │ └── index.tsx │ │ │ ├── NodeContainer/ │ │ │ │ ├── TitleMenuTooltip.tsx │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── NodeEditor/ │ │ │ │ └── index.tsx │ │ │ ├── NodeLogPanel/ │ │ │ │ ├── components/ │ │ │ │ │ ├── CodePanel.tsx │ │ │ │ │ ├── DetailPanel.tsx │ │ │ │ │ ├── StatusPanel.tsx │ │ │ │ │ ├── TrackNodeItem.tsx │ │ │ │ │ └── TrackPanel.tsx │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── NodesMenu/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── NodesPopover/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── PanelContainer/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── PanelStatusLogContainer/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ └── TextEllipsis/ │ │ │ ├── index.less │ │ │ └── index.tsx │ │ ├── hooks/ │ │ │ ├── useEdges.ts │ │ │ ├── useFlow.ts │ │ │ ├── useNodes.ts │ │ │ ├── useStore.ts │ │ │ └── useTemporalStore.ts │ │ ├── index.less │ │ ├── index.ts │ │ ├── models/ │ │ │ ├── context.ts │ │ │ ├── event-emitter.tsx │ │ │ └── store.ts │ │ ├── nodes/ │ │ │ ├── index.less │ │ │ ├── index.tsx │ │ │ ├── node-common/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── node-end/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── node-note/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── node-parallel/ │ │ │ │ ├── ParallelBuildInNodeWidget.tsx │ │ │ │ ├── index.less │ │ │ │ ├── index.tsx │ │ │ │ └── setting/ │ │ │ │ └── index.tsx │ │ │ ├── node-start/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ └── node-switch/ │ │ │ ├── SwitchBuildInNodeWidget.tsx │ │ │ ├── index.less │ │ │ ├── index.tsx │ │ │ └── setting/ │ │ │ └── index.tsx │ │ ├── operator/ │ │ │ ├── Control/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── UndoRedo/ │ │ │ │ ├── index.less │ │ │ │ └── index.tsx │ │ │ ├── ZoomInOut/ │ │ │ │ ├── index.less │ │ │ │ ├── index.tsx │ │ │ │ └── shortcuts-name.tsx │ │ │ ├── index.less │ │ │ └── index.tsx │ │ ├── types.ts │ │ ├── utils/ │ │ │ ├── autoLayoutNodes.ts │ │ │ ├── createIconFont.ts │ │ │ ├── flow.ts │ │ │ ├── hooks.ts │ │ │ └── index.ts │ │ └── withProvider.tsx │ └── tsconfig.json ├── scripts/ │ ├── dumi-plugin/ │ │ ├── publicPath.ts │ │ └── redirect.ts │ └── prettier-plugin/ │ └── index.js ├── tools/ │ └── schema-builder/ │ ├── .fatherrc.js │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.md │ ├── package.json │ ├── src/ │ │ ├── createIframe.ts │ │ ├── index.ts │ │ ├── main.tsx │ │ ├── settings/ │ │ │ ├── index.ts │ │ │ ├── meta/ │ │ │ │ ├── card.ts │ │ │ │ ├── cardList.ts │ │ │ │ ├── checkbox.ts │ │ │ │ ├── checkboxes.ts │ │ │ │ ├── color.ts │ │ │ │ ├── date.ts │ │ │ │ ├── dateRange.ts │ │ │ │ ├── form.ts │ │ │ │ ├── imageInput.ts │ │ │ │ ├── input.ts │ │ │ │ ├── number.ts │ │ │ │ ├── radio.ts │ │ │ │ ├── rate.ts │ │ │ │ ├── select.ts │ │ │ │ ├── slider.ts │ │ │ │ ├── switch.ts │ │ │ │ ├── textarea.ts │ │ │ │ ├── time.ts │ │ │ │ ├── timeRange.ts │ │ │ │ ├── treeSelect.ts │ │ │ │ └── urlInput.ts │ │ │ └── utils.ts │ │ └── type.ts │ └── tsconfig.json ├── tsconfig.jest.json ├── turbo.json ├── typing.d.ts ├── vitest.config.ts └── widgets/ ├── AsyncOptions/ │ ├── .fatherrc.js │ ├── README.md │ ├── package.json │ └── src/ │ └── index.js ├── RichText/ │ ├── .fatherrc.js │ ├── README.md │ ├── package.json │ └── src/ │ └── index.js └── template/ ├── .fatherrc.js ├── README.md ├── package.json └── src/ └── index.js ================================================ FILE CONTENTS ================================================ ================================================ FILE: .dumi/loading.tsx ================================================ import React from 'react'; import { Spin } from 'antd'; export default () => { return (
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## Star 趋势
[](https://star-history.com/#alibaba/x-render&Date)
================================================
FILE: app.ts
================================================
window.publicPath = '/';
if (location.origin.includes('gitee')) {
location.href = 'https://xrender.fun/';
}
if (location.origin.includes('alibaba')) {
window.publicPath = '/x-render/';
}
================================================
FILE: docs/data-render/data/basic.ts
================================================
export default {
"creator": "清风徐来",
"relevanceCode": "421421",
"desc": "浙江省杭州市工专路",
"create-time": "2019-10-10",
"effective-date": "2019-10-10 ~ 2020-10-31",
"safety": {
"name": "Test demo 001",
"app": "中后台详情页面",
"mode": "代码包",
"yum": "592342323904823489",
"fore": "23"
},
"operLog": [{
"type": "创建测试",
"creator": "清风徐来",
"time": "2019-10-30 12:23:45",
"result": "1",
"desc": "这是备注"
}, {
"type": "创建测试",
"creator": "清风徐来",
"time": "2019-10-30 12:23:45",
"result": "1",
"desc": "这是备注"
}, {
"type": "创建测试",
"creator": "清风徐来",
"time": "2019-10-30 12:23:45",
"result": "1",
"desc": "这是备注"
}, {
"type": "创建测试",
"creator": "清风徐来",
"time": "2019-10-30 12:23:45",
"result": "1",
"desc": "这是备注"
}, {
"type": "创建测试",
"creator": "清风徐来",
"time": "2019-10-30 12:23:45",
"result": "1",
"desc": "这是备注"
}, {
"type": "创建测试",
"creator": "清风徐来",
"time": "2019-10-30 12:23:45",
"result": "1",
"desc": "这是备注"
}]
}
================================================
FILE: docs/data-render/index.md
================================================
---
order: 0
title: 开始使用
mobile: false
---
DataView
================================================
FILE: docs/form-render/advanced-path.md
================================================
---
order: 3
toc: content
mobile: false
group:
title: 高级用法
order: 1
---
# path 书写
调用 setSchemaByPath 时,需要根据 path 改动表单元素的 schema。如果元素结构很深,如何正确书写 path 呢?
## 基础型:path
设置选项:form.setSchemaByPath('radio', { enum: [1, 2, 3] });
```jsx
import { Button } from 'antd';
import FormRender, { useForm } from 'form-render';
import React from 'react';
const Demo = () => {
const form = useForm();
const onMount = () => {
setTimeout(() => {
form.setSchemaByPath('radio', { enum: [1, 2, 3] });
}, 1000);
};
const schema = {
type: 'object',
displayType: 'row',
properties: {
radio : {
title: '选择框',
type: 'string',
widget: 'radio',
enum: []
}
}
};
return (
## 列表组件
对于列表组件的按需使用,除了引入列表本身,还需引入列表嵌套组件,否则不能正常渲染。
默认的嵌套组件为 `Collapse`,如需使用其他嵌套组件,需要在 schema 中指定 widget 属性。
```js
const schema = {
type: 'object',
displayType: 'row',
properties: {
list: {
title: '列表按需',
type: 'array',
widget: 'simpleList',
items: {
type: 'object',
widget: 'Card', // 自定义嵌套组件
properties: {
input1: {
title: '输入框',
type: 'string',
},
},
},
},
},
};
```
## 内置的组件
```js
// 基础控件
Input,
Number,
TextArea,
Select,
MultiSelect,
Switch,
Radio,
CheckBox,
Checkboxes,
Date,
DateRange,
Time,
TimeRange,
Color,
Rate,
TreeSelect,
ImageInput,
UrlInput,
Slider,
Upload,
Html,
PercentSlider,
// 嵌套控件
Card,
Collapse,
SubInline,
LineTitle,
// 列表控件
SimpleList,
CardList,
TableList,
DrawerList,
VirtualList,
TabList,
```
================================================
FILE: docs/form-render/advanced-validate.md
================================================
---
order: 2
toc: content
mobile: false
group:
title: 高级用法
order: 1
---
# 表单校验
- 通过内置校验字段配置,实现简单校验逻辑
- 通过 rules 配置,实现复杂校验逻辑
- 通过 validateMessages 实现校验提示模版定制
### 一、内置校验
- required:必填
- max:最大长度 | 最大值
- min:最小长度 | 最小值
- format:url | email | image | color
```jsx
import React from 'react';
import FormRender, { useForm } from 'form-render';
const schema = {
type: 'object',
displayType: 'row',
properties: {
input1: {
title: '必填',
type: 'string',
required: true,
},
input2: {
title: '数字最大值',
type: 'number',
max: 2,
required: true
},
input3: {
title: '数字最小值',
type: 'number',
min: 10,
required: true,
},
input4: {
title: '字符最大长度',
type: 'string',
max: 2,
required: true,
},
input5: {
title: '字符最小长度',
type: 'string',
min: 10,
required: true,
},
input6: {
title: 'url 校验',
type: 'string',
required: true,
format: 'url',
},
input7: {
title: 'email 校验',
type: 'string',
required: true,
format: 'email',
},
input8: {
title: '图片格式校验',
type: 'string',
required: true,
format: 'image',
}
}
};
export default () => {
const form = useForm();
return (
## Widget 接收到的 props
默认情况下 Widget 会接收到如下的 props:
### id
- 类型:`string`
- 描述:当前 item 在表单中的唯一 key,一般用不到
### schema
- 类型:`Schema`
- 描述:当前 item 的 schema
### value
- 类型:`any`
- 描述:当前 item 的值,用于 widget 的受控
### onChange
- 类型:`(value: any) => void`
- 描述:当前 item 的值变化时的回调用于 widget 的受控
### disabled
- 类型:`boolean`
- 描述:当前 item 是否为禁用状态,如果没有单独为这个 item 指定,那么就继承全局的 `disabled` 属性
### readOnly
- 类型:`boolean`
- 描述:当前 item 是否为只读状态,如果没有单独为这个 item 指定,那么就继承全局的 `readOnly` 属性
### addons
addons 包含了全部的表单实例方法,详见 [FormInstance](/form-render/api-props#forminstance),这里不再赘述。除此之外 addons 还包含了如下一些额外属性。
#### addons.globalProps
- 类型:`Record
## 使用 dependencies 联动
除了使用表达式联动,widget 还可以使用 `dependencies` 属性进行联动。首先在 schema 中定义好 `dependencies`,比如:
```js
const shcema = {
type: 'object',
properties: {
age: {
title: '年龄',
type: 'string',
},
name: {
title: '姓名',
type: 'string',
widget: 'MyInput',
// 指定依赖的字段
dependencies: ['age']
},
}
}
```
之后在 widget 的 `props.addons.dependValues` 中可以拿到依赖的值。
```js
const MyInput = (props) => {
const { addons } = props;
console.log('dependValues:', addons.dependValues);
// dependValues: ['xxxx']
return (
// ...
)
}
```
与上面同样的例子,使用 `dependencies` 的代码如下:
:::info
`dependencies` 除了触自动更新之外,还能触发校验,详见 [表单联动](/form-render/advanced-linkage#dependencies-依赖字段)
:::
## 其他 Widget
除了输入控件可以自定义 widget 之外,Form Render 还提供了自定义一个表单项其他部分的能力。
### readOnlyWidget
只读模式下,默认会渲染内置的 html 组件,但有时 html 组件并不能满足一个自定义组件在只读模式下需要的展示,此时可使用`readOnlyWidget`字段来指定只读模式下的展示。
```js
const schema = {
type: 'object',
properties: {
string: {
title: 'ReadOnly widget',
type: 'string',
widget: 'SiteInput',
readOnlyWidget: 'ReadOnlySiteInput',
},
},
};
```
如果你打算在一个自定义组件里通过 readOnly 参数判断条件展示,既是说,site 组件已经写了只读和非只读情况下的渲染
```js
const SiteInput = ({ readOnly, value, ...rest }: WidgetProps) => {
if (readOnly) return {`https://${value || ''}.com`};
return (
);
};
```
此时可以指定 `readOnlyWidget` 和 `widget` 为同一个组件:
```js
const schema = {
type: 'object',
properties: {
string: {
title: 'ReadOnly widget',
type: 'string',
widget: 'SiteInput',
readOnlyWidget: 'SiteInput',
},
},
};
```
完整代码如下:
### labelWidget
使用 `labelWidget` 自定义 label 组件,此时 widget 接收到的 props 只有 `schema`。
### descWidget
使用 `descWidget` 自定义 description 组件,此时 widget 接收到的 props 只有 `schema`。
## 统一管理 Widget
同一个项目下不同的 form 里,使用到的自定义组件可能大致相同,但也有可能互相不同,我们建议是中心化一个 Form 组件,并一次性将所有需要的自定义组件注入其中。在项目的各处引入对应组件:
```js
// /Component/FormRender.js
import Form from 'form-render';
import Cascade from './Cascade';
import Percentage from './Percentage';
import MyCheckBox from './MyCheckBox';
import ExcelUploader from './ExcelUploader';
export default props => (
);
```
然后在每个 form 页面统一引入使用
```js
import { useForm } from 'form-render';
import FormRender from './Component/FormRender';
const Demo = props => {
const form = useForm();
return