[+] add formily widget

This commit is contained in:
王昆 2021-08-23 15:21:58 +08:00
parent f6a513a3b0
commit e39770eed4
23 changed files with 1272 additions and 8 deletions

View File

@ -32,10 +32,10 @@
"react/function-component-definition": "warn",
"react/jsx-boolean-value": "error",
"react/self-closing-comp": "error",
"react/jsx-sort-props": "error",
"react/jsx-sort-props": 0,
"react/jsx-fragments": "error",
"react/jsx-no-useless-fragment": "error",
"sort-destructure-keys/sort-destructure-keys": ["error", {"caseSensitive": false}],
"sort-destructure-keys/sort-destructure-keys": 0,
"prettier/prettier": [
"error",
{ "endOfLine": "auto" }

View File

@ -28,7 +28,7 @@ module.exports = {
options: {
lessLoaderOptions: {
lessOptions: {
modifyVars: { '@primary-color': '#ff0000' },
modifyVars: { '@primary-color': '#2CBBA6' },
javascriptEnabled: true,
},
},

View File

@ -15,8 +15,15 @@
"@blueprintjs/select": "^3.10.0",
"@blueprintjs/timezone": "^3.6.0",
"@craco/craco": "^5.7.0",
"@designable/core": "0.4.34",
"@designable/formily": "0.4.34",
"@designable/react": "0.4.34",
"@designable/react-settings-form": "0.4.34",
"@draft-js-plugins/editor": "^4.1.0",
"@draft-js-plugins/mention": "^4.5.1",
"@formily/antd": "2.0.0-beta.88",
"@formily/core": "2.0.0-beta.88",
"@formily/react": "2.0.0-beta.88",
"@fusioncharts/powercharts": "^3.16.0",
"@github/g-emoji-element": "^1.1.5",
"@manaflair/redux-batch": "^1.0.0",
@ -56,6 +63,7 @@
"axios": "^0.21.1",
"caniuse-lite": "^1.0.30001208",
"chance": "^1.1.3",
"classnames": "^2.3.1",
"codemirror": "^5.59.2",
"copy-to-clipboard": "^3.3.1",
"core-js": "^3.9.1",

View File

@ -0,0 +1,248 @@
import React, { useMemo, useEffect } from "react";
import { createForm } from "@formily/core";
import { createSchemaField } from "@formily/react";
import {
Form,
FormItem,
DatePicker,
Checkbox,
Cascader,
Editable,
Input,
NumberPicker,
Switch,
Password,
PreviewText,
Radio,
Reset,
Select,
Space,
Submit,
TimePicker,
Transfer,
TreeSelect,
Upload,
FormGrid,
FormLayout,
FormTab,
FormCollapse,
ArrayTable,
ArrayCards,
FormButtonGroup,
FormDrawer,
FormDialog,
} from "@formily/antd";
import { Card, Slider, Rate, Button } from "antd";
import { FormType } from "../../../widgets/FormilyWidget";
import styled from "styled-components";
import _ from "lodash";
interface FormilyComponentProps {
formType: FormType;
title?: string;
triggerLabel?: string;
submitLabel?: string;
showReset?: boolean;
resetLabel?: string;
schema: string;
onFormSubmit: (data: any) => void;
}
const EmptyForm = styled.div`
display: flex;
justify-content: center;
align-items: center;
font-size: 24px;
background: #eee;
min-height: 300px;
margin-bottom: 24px;
background-color: #fff;
border-radius: 6px;
opacity: 0.4;
border: 1px dashed #2cbba6;
background-image: repeating-radial-gradient(
circle at 0 0,
transparent 0,
#ffffff 10px
),
repeating-linear-gradient(#8af3c655, #8af3c6);
`;
const ScrollContainer = styled.div`
display: flex;
flex-direction: column;
height: calc(100% + 12px);
`;
const ScrollContent = styled.div`
flex: 1;
overflow: auto;
`;
const ScrollFooter = styled.div`
border-top: 1px solid #f0f0f0;
margin: 0 -24px;
padding: 12px 24px 0;
`;
const SchemaField = createSchemaField({
components: {
Space,
FormGrid,
FormLayout,
FormTab,
FormCollapse,
ArrayTable,
ArrayCards,
FormItem,
DatePicker,
Checkbox,
Cascader,
Editable,
Input,
NumberPicker,
Switch,
Password,
PreviewText,
Radio,
Reset,
Select,
Submit,
TimePicker,
Transfer,
TreeSelect,
Upload,
Card,
Slider,
Rate,
},
});
const FormilyComponent = (props: FormilyComponentProps) => {
const {
title,
formType,
triggerLabel,
submitLabel,
showReset,
resetLabel,
onFormSubmit,
} = props;
const schema: {
form?: any;
schema?: any;
} = useMemo(() => {
try {
return JSON.parse(props.schema);
} catch (e) {
console.log("schema json parse failed", e);
return {};
}
}, [props.schema]);
const form = useMemo(() => createForm(), [props.schema]);
const formProps = schema.form || {};
const isVertical = formProps.layout === "vertical";
const submitText = submitLabel || "提交";
const resetText = resetLabel || "重置";
const triggerText = triggerLabel || "打开表单";
const formContent = _.isUndefined(schema.schema) ? (
<EmptyForm> 😉</EmptyForm>
) : (
<SchemaField schema={schema.schema} />
);
const showDrawer = () => {
FormDrawer({ title }, () => {
return (
<FormLayout {...formProps}>
{formContent}
<FormDrawer.Footer>
<FormButtonGroup align="left">
<Submit
onSubmit={() => {
return Promise.resolve();
}}
>
{submitText}
</Submit>
{showReset ? <Reset>{resetText}</Reset> : null}
</FormButtonGroup>
</FormDrawer.Footer>
</FormLayout>
);
})
.open({
initialValues: {},
})
.then(onFormSubmit);
};
const showModal = () => {
FormDialog({ title, okText: submitText }, () => {
return (
<FormLayout {...formProps}>
{formContent}
<FormDialog.Footer>
{showReset ? <Reset>{resetText}</Reset> : null}
</FormDialog.Footer>
</FormLayout>
);
})
.open({
initialValues: {},
})
.then(onFormSubmit);
};
if (formType === "MODAL" || formType === "DRAWER") {
return (
<Button
type="primary"
block
onClick={formType === "DRAWER" ? showDrawer : showModal}
>
{triggerText}
</Button>
);
}
return (
<Card
title={title}
bodyStyle={{ height: title ? "calc(100% - 58px)" : "100%" }}
>
<Form
form={form}
{...formProps}
onAutoSubmit={onFormSubmit}
className="full-height-form"
>
<ScrollContainer>
<ScrollContent>{formContent}</ScrollContent>
<ScrollFooter>
{isVertical ? (
<>
<Submit block={!showReset}>{submitText}</Submit>
{showReset ? (
<Reset style={{ marginLeft: 8 }}>{resetText}</Reset>
) : null}
</>
) : showReset ? (
<FormButtonGroup.FormItem>
<Submit>{submitText}</Submit>
<Reset>{resetText}</Reset>
</FormButtonGroup.FormItem>
) : (
<FormButtonGroup.FormItem>
<Submit block>{submitText}</Submit>
</FormButtonGroup.FormItem>
)}
</ScrollFooter>
</ScrollContainer>
</Form>
</Card>
);
};
export default FormilyComponent;

View File

@ -0,0 +1,141 @@
import React, { useMemo, forwardRef, useImperativeHandle } from "react";
import { useEffect } from "react";
import {
Designer,
Workspace,
OutlineTreeWidget,
DragSourceWidget,
HistoryWidget,
MainPanel,
CompositePanel,
WorkspacePanel,
ViewportPanel,
ViewPanel,
SettingsPanel,
ComponentTreeWidget,
} from "@designable/react";
import { transformToSchema, transformToTreeNode } from "@designable/formily";
import { SettingsForm } from "@designable/react-settings-form";
import {
createDesigner,
GlobalRegistry,
WorkbenchTypes,
} from "@designable/core";
import {
createDesignableField,
createDesignableForm,
} from "@formily/designable-antd";
import PreviewWidget from "./PreviewWidget";
const CompositePanelItem: any = CompositePanel.Item;
GlobalRegistry.registerDesignerLocales({
"zh-CN": {
sources: {
Inputs: "输入控件",
Layouts: "布局组件",
Arrays: "自增组件",
},
},
"en-US": {
sources: {
Inputs: "Inputs",
Layouts: "Layouts",
Arrays: "Arrays",
},
},
});
const Root = createDesignableForm({
registryName: "Root",
});
const DesignableField = createDesignableField({
registryName: "DesignableField",
});
const FormilyDesigner = (props: any, ref: any) => {
const engine = useMemo(() => createDesigner(), []);
console.log("designer render");
useEffect(() => {
console.log("desginer init");
return () => {
console.log("desginer destory");
};
}, []);
useImperativeHandle(
ref,
() => ({
getSchema: () => {
return transformToSchema(engine.getCurrentTree(), {
designableFieldName: "DesignableField",
designableFormName: "Root",
});
},
setSchema: (schema: any) => {
engine.setCurrentTree(
transformToTreeNode(schema, {
designableFieldName: "DesignableField",
designableFormName: "Root",
}),
);
},
toggleWorkbench: (type: WorkbenchTypes) => {
engine.workbench.setWorkbenchType(type);
},
workbenchType: engine.workbench.type,
}),
[engine],
);
return (
<Designer engine={engine}>
<MainPanel>
<CompositePanel>
<CompositePanelItem title="panels.Component" icon="Component">
<DragSourceWidget title="sources.Inputs" name="inputs" />
<DragSourceWidget title="sources.Layouts" name="layouts" />
<DragSourceWidget title="sources.Arrays" name="arrays" />
</CompositePanelItem>
<CompositePanelItem title="panels.OutlinedTree" icon="Outline">
<OutlineTreeWidget />
</CompositePanelItem>
<CompositePanelItem title="panels.History" icon="History">
<HistoryWidget />
</CompositePanelItem>
</CompositePanel>
<Workspace id="form">
<WorkspacePanel>
<ViewportPanel>
<ViewPanel type="DESIGNABLE">
{() => {
console.log("DESIGNABLE show !");
return (
<ComponentTreeWidget
components={{
Root,
DesignableField,
}}
/>
);
}}
</ViewPanel>
<ViewPanel type="PREVIEW">
{(tree) => {
console.log("PREVIEW show !");
return <PreviewWidget tree={tree} />;
}}
</ViewPanel>
</ViewportPanel>
</WorkspacePanel>
</Workspace>
<SettingsPanel title="panels.PropertySettings">
<SettingsForm uploadAction="https://www.mocky.io/v2/5cc8019d300000980a055e76" />
</SettingsPanel>
</MainPanel>
</Designer>
);
};
export default forwardRef(FormilyDesigner);

View File

@ -0,0 +1,86 @@
import React, { useMemo } from "react";
import { createForm } from "@formily/core";
import { createSchemaField } from "@formily/react";
import {
Form,
FormItem,
DatePicker,
Checkbox,
Cascader,
Editable,
Input,
NumberPicker,
Switch,
Password,
PreviewText,
Radio,
Reset,
Select,
Space,
Submit,
TimePicker,
Transfer,
TreeSelect,
Upload,
FormGrid,
FormLayout,
FormTab,
FormCollapse,
ArrayTable,
ArrayCards,
} from "@formily/antd";
import { Card, Slider, Rate } from "antd";
import { TreeNode } from "@designable/core";
import { transformToSchema } from "@designable/formily";
const SchemaField = createSchemaField({
components: {
Space,
FormGrid,
FormLayout,
FormTab,
FormCollapse,
ArrayTable,
ArrayCards,
FormItem,
DatePicker,
Checkbox,
Cascader,
Editable,
Input,
NumberPicker,
Switch,
Password,
PreviewText,
Radio,
Reset,
Select,
Submit,
TimePicker,
Transfer,
TreeSelect,
Upload,
Card,
Slider,
Rate,
},
});
export interface IPreviewWidgetProps {
tree: TreeNode;
}
const PreviewWidget: React.FC<IPreviewWidgetProps> = (props) => {
const form = useMemo(() => createForm(), []);
const { form: formProps, schema }: any = transformToSchema(props.tree, {
designableFormName: "Root",
designableFieldName: "DesignableField",
});
return (
<Form {...formProps} form={form}>
<SchemaField schema={schema} />
</Form>
);
};
export default PreviewWidget;

View File

@ -0,0 +1,125 @@
import React from "react";
import BaseControl, { ControlProps } from "../BaseControl";
import { Drawer, Button } from "antd";
import { EyeOutlined, ToolOutlined } from "@ant-design/icons";
import styled from "styled-components";
import Designer from "./Designer";
const DrawerHeader = styled.div`
position: relative;
`;
const Center = styled.div`
position: absolute;
left: 0;
right: 0;
top: 0;
text-align: center;
`;
class FormilyControl extends BaseControl<ControlProps> {
designerRef: any = React.createRef();
state = {
showEditor: false,
workbenchType: "DESIGNABLE",
};
toggle = () => {
const { showEditor } = this.state;
this.setState({
showEditor: !showEditor,
workbenchType: "DESIGNABLE",
});
};
onVisibleChanged = (visible: boolean) => {
if (visible && this.designerRef.current) {
try {
const schema = JSON.parse(this.props.propertyValue);
this.designerRef.current.setSchema(schema);
} catch (e) {
console.log("schema string parse failed :<", e);
}
}
};
handleOk = () => {
const value =
this.designerRef.current && this.designerRef.current.getSchema();
this.updateProperty(this.props.propertyName, JSON.stringify(value));
this.toggle();
};
toggleDesignerMode = () => {
if (this.designerRef.current) {
const workbenchType = this.state.workbenchType;
const target = workbenchType === "DESIGNABLE" ? "PREVIEW" : "DESIGNABLE";
this.designerRef.current.toggleWorkbench(target);
this.setState({
workbenchType: target,
});
}
};
render() {
const { workbenchType, showEditor } = this.state;
return (
<div>
<Button block type="primary" onClick={this.toggle}>
</Button>
<Drawer
title={
<DrawerHeader>
<span></span>
<Center>
<Button
onClick={this.toggleDesignerMode}
type="primary"
shape="round"
size="small"
icon={
workbenchType === "DESIGNABLE" ? (
<EyeOutlined />
) : (
<ToolOutlined />
)
}
>
{workbenchType === "DESIGNABLE" ? "预览" : "编辑"}
</Button>
</Center>
</DrawerHeader>
}
visible={showEditor}
onClose={this.toggle}
afterVisibleChange={this.onVisibleChanged}
height="100%"
placement="bottom"
className="designable-drawer"
footer={
<div
style={{
textAlign: "center",
}}
>
<Button onClick={this.toggle} style={{ marginRight: 8 }}>
</Button>
<Button onClick={this.handleOk} type="primary">
</Button>
</div>
}
>
{showEditor ? <Designer ref={this.designerRef} /> : null}
</Drawer>
</div>
);
}
static getControlType() {
return "FORMILY_EDITOR";
}
}
export default FormilyControl;

View File

@ -46,6 +46,7 @@ import CustomFusionChartControl from "./CustomFusionChartControl";
import MenuItemsControl from "./MenuItemsControl";
import IconSelectControl from "./IconSelectControl";
import IconAlignControl from "./IconAlignControl";
import FormilyControl from "./FormilyControl";
export const PropertyControls = {
InputTextControl,
@ -71,6 +72,7 @@ export const PropertyControls = {
MenuItemsControl,
IconSelectControl,
IconAlignControl,
FormilyControl,
};
export type PropertyControlPropsType =

View File

@ -75,6 +75,7 @@ export enum EventType {
ON_RATE_CHANGED = "ON_RATE_CHANGED",
ON_IFRAME_URL_CHANGED = "ON_IFRAME_URL_CHANGED",
ON_IFRAME_MESSAGE_RECEIVED = "ON_IFRAME_MESSAGE_RECEIVED",
ON_FORM_SUBMIT = "ON_FORM_SUBMIT",
}
export type ActionType =

View File

@ -38,7 +38,7 @@ export const Colors: Record<string, string> = {
MAKO: "#464D53",
ALTO: "#DFDFDF",
GREEN: "#03B365",
GREEN: "#2CBBA6",
JUNGLE_GREEN: "#24BA91",
JUNGLE_GREEN_DARKER: "#30A481",
EUCALYPTUS: "#218358",

View File

@ -197,6 +197,10 @@ const FIELD_VALUES: Record<
isVisible: "boolean",
label: "string",
},
FORMILY_WIDGET: {
schema: "string",
onFormSubmit: "Function Call",
},
};
export default FIELD_VALUES;

View File

@ -131,6 +131,10 @@ export const HelpMap = {
path: "/widget-reference/menu-button",
searchKey: "Menu Button",
},
FORMILY_WIDGET: {
path: "/widget-reference/",
searchKey: "Formily",
},
};
export const HelpBaseURL = "https://docs.appsmith.com";

View File

@ -31,6 +31,7 @@ export enum WidgetTypes {
IFRAME_WIDGET = "IFRAME_WIDGET",
DIVIDER_WIDGET = "DIVIDER_WIDGET",
MENU_BUTTON_WIDGET = "MENU_BUTTON_WIDGET",
FORMILY_WIDGET = "FORMILY_WIDGET",
}
export type WidgetType = keyof typeof WidgetTypes;

View File

@ -167,6 +167,11 @@ export const WidgetIcons: {
<MenuButtonIcon />
</IconWrapper>
),
FORMILY_WIDGET: (props: IconProps) => (
<IconWrapper {...props}>
<FormIcon />
</IconWrapper>
),
};
export type WidgetIcon = typeof WidgetIcons[keyof typeof WidgetIcons];

View File

@ -23,6 +23,17 @@ code {
outline: none !important;
}
* ::-webkit-scrollbar {
width: 5px;
height: 5px;
}
* ::-webkit-scrollbar-thumb {
background-color: @primary-color;
border-radius: 0;
transition: all 0.25s ease-in-out;
}
div.bp3-select-popover .bp3-popover-content {
padding: 0;
}
@ -107,3 +118,128 @@ div.bp3-popover-arrow {
.bp3-modal-widget .bp3-portal {
z-index: 21 !important;
}
.full-height-form {
height: 100%;
& > form {
height: 100%;
}
}
.designable-drawer {
.dn-main-panel.root {
height: auto;
top: 55px;
bottom: 53px;
}
.dn-light {
--dn-aux-cover-rect-dragging-color: #55c7b730;
--dn-aux-cover-rect-dropping-color: #b2fbe833;
--dn-aux-free-selection-background-color: #2CBBA6;
--dn-aux-free-selection-border-color: #2CBBA6;
--dn-aux-insertion-color: #2CBBA6;
--dn-aux-dashed-box-color: rgba(68 100 255 / 80%);
--dn-aux-dashed-box-title-color: #333;
--dn-aux-selection-box-border-color: #2CBBA6;
--dn-aux-selection-box-color: #333;
--dn-ghost-color: #fff;
--dn-ghost-bg-color: #13797edd;
--dn-outline-tree-bg-color: #fff;
--dn-outline-tree-header-border-color: #eee;
--dn-outline-tree-color: #333;
--dn-outline-tree-insertion-bg-color: #2CBBA6;
--dn-outline-tree-node-selected-color: #f3f3f3;
--dn-outline-tree-node-header-color: #333;
--dn-outline-tree-node-hover-color: #2CBBA6;
--dn-toolbar-input-color: rgba(0, 0, 0, 0.85);
--dn-toolbar-input-bg-color: #fff;
--dn-toolbar-input-border-color: #d9d9d9;
--dn-toolbar-input-hover-border-color: #d9d9d9;
--dn-toolbar-input-handler-bg-color: #fff;
--dn-resize-handle-bg-color: #f0f0f0;
--dn-resize-handle-hover-bg-color: #fafafa;
--dn-resize-handle-color: #666;
--dn-resize-handle-hover-color: #aaa;
--dn-mobile-simulator-bg-color: #eee;
--dn-mobile-simulator-body-bg-color: #fff;
--dn-mobile-simulator-border-color: #222;
--dn-responsive-simulator-bg-color: #fff;
--dn-pc-simulator-bg-color: #fff;
--dn-aux-selector-btn-color: #fff;
--dn-aux-selector-btn-bg-color: #2CBBA6;
--dn-aux-selector-btn-border-color: #2CBBA6;
--dn-aux-selector-btn-hover-color: #fff;
--dn-aux-selector-btn-hover-bg-color: #50c7b1;
--dn-aux-selector-btn-hover-border-color: #50c7b1;
--dn-aux-selector-btn-active-color: #fff;
--dn-aux-selector-btn-active-bg-color: #1c9486;
--dn-aux-selector-btn-active-border-color: #1c9486;
--dn-composite-panel-tabs-bg-color: #fff;
--dn-composite-panel-tabs-active-bg-color: #fff;
--dn-composite-panel-highlight-bg-color: #f0f0f0;
--dn-composite-panel-tabs-color: #666;
--dn-composite-panel-tabs-hover-color: #2CBBA6;
--dn-composite-panel-tabs-content-border-color: #eee;
--dn-composite-panel-tabs-content-bg-color: #fff;
--dn-composite-panel-tabs-header-color: #666;
--dn-drag-source-header-border-color: #eee;
--dn-drag-source-header-color: #888;
--dn-drag-source-header-hover-color: #333;
--dn-drag-source-item-border-color: #aaa;
--dn-drag-source-item-color: #333;
--dn-drag-source-item-hover-border-color: #50c7b1;
--dn-drag-source-item-hover-color: #50c7b1;
--dn-main-panel-header-bg-color: #fff;
--dn-main-panel-header-border-color: #eee;
--dn-workspace-panel-bg-color: #eee;
--dn-scrollbar-color: rgba(0, 0, 0, 0.2);
--dn-scrollbar-hover-color: rgba(0, 0, 0, 0.3);
--dn-btn-color: rgba(0, 0, 0, 0.85);
--dn-btn-border-color: #d9d9d9;
--dn-btn-bg-color: #fff;
--dn-btn-hover-color: #50c7b1;
--dn-btn-hover-border-color: #50c7b1;
--dn-btn-hover-bg-color: #fff;
--dn-btn-active-color: #1c9486;
--dn-btn-active-bg-color: #fff;
--dn-btn-active-border-color: #1c9486;
--dn-btn-disabled-color: rgba(0, 0, 0, 0.25);
--dn-btn-disabled-bg-color: #f5f5f5;
--dn-btn-disabled-border-color: #d9d9d9;
--dn-btn-primary-color: #fff;
--dn-btn-primary-bg-color: #2CBBA6;
--dn-btn-primary-border-color: #2CBBA6;
--dn-btn-primary-hover-color: #fff;
--dn-btn-primary-hover-bg-color: #50c7b1;
--dn-btn-primary-hover-border-color: #50c7b1;
--dn-btn-primary-active-color: #fff;
--dn-btn-primary-active-bg-color: #1c9486;
--dn-btn-primary-active-border-color: #1c9486;
--dn-btn-primary-disabled-color: rgba(0, 0, 0, 0.25);
--dn-btn-primary-disabled-bg-color: #f5f5f5;
--dn-btn-primary-disabled-border-color: #d9d9d9;
--dn-btn-text-shadow-color: rgba(0, 0, 0, 0.12);
--dn-btn-box-shadow-color: rgba(0, 0, 0, 0.045);
--dn-empty-bg-color: #fff;
}
}

View File

@ -1196,6 +1196,18 @@ const WidgetConfigResponse: WidgetConfigReducerState = {
columns: 4 * GRID_DENSITY_MIGRATION_V1,
widgetName: "MenuButton",
},
[WidgetTypes.FORMILY_WIDGET]: {
widgetName: "复杂表单",
rows: 12 * GRID_DENSITY_MIGRATION_V1,
columns: 8 * GRID_DENSITY_MIGRATION_V1,
version: 1,
formType: "PLAIN",
triggerLabel: "打开表单",
title: "表单标题",
submitLabel: "提交",
showReset: true,
resetLabel: "重置",
},
},
configVersion: 1,
};

View File

@ -125,6 +125,11 @@ const WidgetSidebarResponse: WidgetCardProps[] = [
widgetCardName: "Menu Button",
key: generateReactKey(),
},
{
type: "FORMILY_WIDGET",
widgetCardName: "复杂表单",
key: generateReactKey(),
},
];
export default WidgetSidebarResponse;

View File

@ -33,6 +33,7 @@ import { DividerWidgetProps } from "../../widgets/DividerWidget";
import { RateWidgetProps } from "../../widgets/RateWidget";
import { IframeWidgetProps } from "widgets/IframeWidget";
import { MenuButtonWidgetProps } from "widgets/MenuButtonWidget";
import { FormilyWidgetProps } from "widgets/FormilyWidget";
const initialState: WidgetConfigReducerState = WidgetConfigResponse;
@ -90,6 +91,7 @@ export interface WidgetConfigReducerState {
RATE_WIDGET: Partial<RateWidgetProps> & WidgetConfigProps;
IFRAME_WIDGET: Partial<IframeWidgetProps> & WidgetConfigProps;
MENU_BUTTON_WIDGET: Partial<MenuButtonWidgetProps> & WidgetConfigProps;
FORMILY_WIDGET: Partial<FormilyWidgetProps> & WidgetConfigProps;
};
configVersion: number;
}

View File

@ -119,6 +119,10 @@ import MenuButtonWidget, {
MenuButtonWidgetProps,
ProfiledMenuButtonWidget,
} from "widgets/MenuButtonWidget";
import FormilyWidget, {
FormilyWidgetProps,
ProfiledFormilyWidget,
} from "widgets/FormilyWidget";
export default class WidgetBuilderRegistry {
static registerWidgetBuilders() {
@ -523,5 +527,18 @@ export default class WidgetBuilderRegistry {
MenuButtonWidget.getMetaPropertiesMap(),
MenuButtonWidget.getPropertyPaneConfig(),
);
WidgetFactory.registerWidgetBuilder(
WidgetTypes.FORMILY_WIDGET,
{
buildWidget(widgetData: FormilyWidgetProps): JSX.Element {
return <ProfiledFormilyWidget {...widgetData} />;
},
},
FormilyWidget.getDerivedPropertiesMap(),
FormilyWidget.getDefaultPropertiesMap(),
FormilyWidget.getMetaPropertiesMap(),
FormilyWidget.getPropertyPaneConfig(),
);
}
}

View File

@ -268,6 +268,12 @@ export const entityDefinitions = {
isVisible: isVisible,
label: "string",
},
FORMILY_WIDGET: {
"!doc": "复杂表单解决方案",
"!url": "https://docs.appsmith.com/widget-reference/input",
isVisible: isVisible,
formData: "any",
},
};
export const GLOBAL_DEFS = {

View File

@ -0,0 +1,175 @@
import React from "react";
import BaseWidget, { WidgetProps, WidgetState } from "./BaseWidget";
import { WidgetType, WidgetTypes } from "constants/WidgetConstants";
import FormilyComponent from "components/designSystems/appsmith/FormilyComponent";
import { VALIDATION_TYPES } from "constants/WidgetValidation";
import { EventType } from "constants/AppsmithActionConstants/ActionConstants";
import * as Sentry from "@sentry/react";
import withMeta, { WithMeta } from "./MetaHOC";
class FormilyWidget extends BaseWidget<FormilyWidgetProps, WidgetState> {
static getPropertyPaneConfig() {
return [
{
sectionName: "属性",
children: [
{
propertyName: "schema",
label: "",
controlType: "FORMILY_EDITOR",
isJSConvertible: false,
isBindProperty: true,
isTriggerProperty: false,
validation: VALIDATION_TYPES.TEXT,
},
{
helpText: "表单展示形式,支持平铺、弹窗、侧边抽屉三种形式",
propertyName: "formType",
label: "表单交互",
controlType: "DROP_DOWN",
options: [
{
label: "平铺",
value: "PLAIN",
},
{
label: "弹窗",
value: "MODAL",
},
{
label: "侧边抽屉",
value: "DRAWER",
},
],
isBindProperty: false,
isTriggerProperty: false,
},
{
propertyName: "triggerLabel",
label: "打开表单按钮文字",
controlType: "INPUT_TEXT",
isBindProperty: true,
isTriggerProperty: false,
validation: VALIDATION_TYPES.TEXT,
hidden: (props: FormilyWidgetProps) => {
return props.formType === "PLAIN";
},
},
{
propertyName: "title",
label: "表单标题",
controlType: "INPUT_TEXT",
isBindProperty: true,
isTriggerProperty: false,
validation: VALIDATION_TYPES.TEXT,
},
{
propertyName: "submitLabel",
label: "提交按钮文字",
controlType: "INPUT_TEXT",
isBindProperty: true,
isTriggerProperty: false,
validation: VALIDATION_TYPES.TEXT,
},
{
propertyName: "showReset",
label: "允许重置",
controlType: "SWITCH",
isBindProperty: true,
isTriggerProperty: false,
validation: VALIDATION_TYPES.BOOLEAN,
},
{
propertyName: "resetLabel",
label: "重置按钮文字",
controlType: "INPUT_TEXT",
isBindProperty: true,
isTriggerProperty: false,
validation: VALIDATION_TYPES.TEXT,
hidden: (props: FormilyWidgetProps) => {
return !props.showReset;
},
},
],
},
{
sectionName: "动作",
children: [
{
propertyName: "onFormSubmit",
label: "提交表单数据",
controlType: "ACTION_SELECTOR",
isJSConvertible: true,
isBindProperty: true,
isTriggerProperty: true,
},
],
},
];
}
static getMetaPropertiesMap(): Record<string, undefined> {
return {
formData: undefined,
};
}
onFormSubmit = (data: any) => {
this.props.updateWidgetMetaProperty("formData", data, {
triggerPropertyName: "onFormSubmit",
dynamicString: this.props.onFormSubmit,
event: {
type: EventType.ON_FORM_SUBMIT,
},
});
};
getPageView() {
console.log("----widget--props--", this.props);
const {
title,
formType,
triggerLabel,
submitLabel,
showReset,
resetLabel,
schema,
} = this.props;
return (
<FormilyComponent
onFormSubmit={this.onFormSubmit}
{...{
title,
formType,
triggerLabel,
submitLabel,
showReset,
resetLabel,
schema,
}}
/>
);
}
getWidgetType(): WidgetType {
return WidgetTypes.FORMILY_WIDGET;
}
}
export interface FormilyWidgetProps extends WidgetProps, WithMeta {
formType: FormType;
title?: string;
triggerLabel?: string;
submitLabel?: string;
showReset?: boolean;
resetLabel?: string;
formData: any;
schema: string;
onFormSubmit?: string;
}
export type FormType = "PLAIN" | "MODAL" | "DRAWER";
export default FormilyWidget;
export const ProfiledFormilyWidget = Sentry.withProfiler(
withMeta(FormilyWidget),
);

View File

@ -331,6 +331,10 @@ export default class DataTreeEvaluator {
if (dynamicBindingPathList.length) {
dynamicBindingPathList.forEach((dynamicPath) => {
const propertyPath = dynamicPath.key;
// [[ quincy hack ]] skip all "schema" path binding
if (propertyPath === "schema") {
return;
}
const unevalPropValue = _.get(entity, propertyPath);
const { jsSnippets } = getDynamicBindings(unevalPropValue);
const existingDeps =

View File

@ -104,7 +104,7 @@
resolved "https://registry.nlark.com/@ant-design/icons-svg/download/@ant-design/icons-svg-4.1.0.tgz#480b025f4b20ef7fe8f47d4a4846e4fee84ea06c"
integrity sha1-SAsCX0sg73/o9H1KSEbk/uhOoGw=
"@ant-design/icons@^4.6.2":
"@ant-design/icons@^4.0.0", "@ant-design/icons@^4.6.2":
version "4.6.2"
resolved "https://registry.nlark.com/@ant-design/icons/download/@ant-design/icons-4.6.2.tgz#290f2e8cde505ab081fda63e511e82d3c48be982"
integrity sha1-KQ8ujN5QWrCB/aY+UR6C08SL6YI=
@ -515,6 +515,11 @@
version "7.12.3"
resolved "https://registry.npmjs.org/@babel/parser/-/parser-7.12.3.tgz"
"@babel/parser@^7.14.7":
version "7.15.2"
resolved "https://registry.nlark.com/@babel/parser/download/@babel/parser-7.15.2.tgz#08d4ffcf90d211bf77e7cc7154c6f02d468d2b1d"
integrity sha1-CNT/z5DSEb9358xxVMbwLUaNKx0=
"@babel/plugin-proposal-async-generator-functions@^7.10.4":
version "7.10.5"
resolved "https://registry.npmjs.org/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.10.5.tgz"
@ -1664,6 +1669,13 @@
dependencies:
regenerator-runtime "^0.13.4"
"@babel/runtime@^7.1.5", "@babel/runtime@^7.2.0":
version "7.14.8"
resolved "https://registry.nlark.com/@babel/runtime/download/@babel/runtime-7.14.8.tgz#7119a56f421018852694290b9f9148097391b446"
integrity sha1-cRmlb0IQGIUmlCkLn5FICXORtEY=
dependencies:
regenerator-runtime "^0.13.4"
"@babel/runtime@^7.10.1", "@babel/runtime@^7.12.5":
version "7.13.10"
resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.13.10.tgz"
@ -1922,6 +1934,67 @@
debug "^3.1.0"
lodash.once "^4.1.1"
"@designable/core@0.4.34":
version "0.4.34"
resolved "https://registry.nlark.com/@designable/core/download/@designable/core-0.4.34.tgz#47a7b6251f17c6034f4972d71af13747d8a14dd3"
integrity sha1-R6e2JR8XxgNPSXLXGvE3R9ihTdM=
dependencies:
"@designable/shared" "0.4.34"
"@formily/json-schema" "^2.0.0-beta.84"
"@formily/path" "^2.0.0-beta.84"
"@formily/reactive" "^2.0.0-beta.84"
"@juggle/resize-observer" "^3.3.1"
"@designable/formily@0.4.34":
version "0.4.34"
resolved "https://registry.nlark.com/@designable/formily/download/@designable/formily-0.4.34.tgz#d73c34c925d6c40d9438130d2482e3bcc2e217a1"
integrity sha1-1zw0ySXWxA2UOBMNJILjvMLiF6E=
dependencies:
"@designable/core" "0.4.34"
"@designable/shared" "0.4.34"
"@formily/core" "^2.0.0-beta.84"
"@formily/json-schema" "^2.0.0-beta.84"
"@designable/react-settings-form@0.4.34":
version "0.4.34"
resolved "https://registry.nlark.com/@designable/react-settings-form/download/@designable/react-settings-form-0.4.34.tgz#a05b04d500348c36d09680eda9a1d7c9d25d4dac"
integrity sha1-oFsE1QA0jDbQloDtqaHXydJdTaw=
dependencies:
"@babel/parser" "^7.14.7"
"@designable/core" "0.4.34"
"@designable/react" "0.4.34"
"@designable/shared" "0.4.34"
"@formily/antd" "^2.0.0-beta.84"
"@formily/core" "^2.0.0-beta.84"
"@formily/react" "^2.0.0-beta.84"
"@formily/reactive" "^2.0.0-beta.84"
"@formily/reactive-react" "^2.0.0-beta.84"
"@formily/shared" "^2.0.0-beta.84"
"@monaco-editor/react" "^4.2.1"
monaco-editor "^0.25.2"
prettier "^2.3.2"
react-color "^2.19.3"
react-tiny-popover "^6.0.5"
"@designable/react@0.4.34":
version "0.4.34"
resolved "https://registry.nlark.com/@designable/react/download/@designable/react-0.4.34.tgz#9970a390c92c216cadbd42b5ff778e1306e6b733"
integrity sha1-mXCjkMksIWytvUK1/3eOEwbmtzM=
dependencies:
"@designable/core" "0.4.34"
"@designable/shared" "0.4.34"
"@formily/reactive" "^2.0.0-beta.84"
"@formily/reactive-react" "^2.0.0-beta.84"
"@juggle/resize-observer" "^3.3.1"
dateformat "^4.5.1"
"@designable/shared@0.4.34":
version "0.4.34"
resolved "https://registry.nlark.com/@designable/shared/download/@designable/shared-0.4.34.tgz#5ca190f32905719751e4a33422b8c4332b1ffc37"
integrity sha1-XKGQ8ykFcZdR5KM0IrjEMysf/Dc=
dependencies:
requestidlecallback "^0.3.0"
"@draft-js-plugins/editor@^4.1.0":
version "4.1.0"
resolved "https://registry.npmjs.org/@draft-js-plugins/editor/-/editor-4.1.0.tgz"
@ -2107,6 +2180,92 @@
intl-messageformat "9.7.0"
tslib "^2.1.0"
"@formily/antd@2.0.0-beta.88", "@formily/antd@^2.0.0-beta.84":
version "2.0.0-beta.88"
resolved "https://registry.nlark.com/@formily/antd/download/@formily/antd-2.0.0-beta.88.tgz#636f3e64907f510c41764a87b97ea9ac44e6e093"
integrity sha1-Y28+ZJB/UQxBdkqHuX6prETm4JM=
dependencies:
"@ant-design/icons" "^4.0.0"
"@formily/core" "2.0.0-beta.88"
"@formily/json-schema" "2.0.0-beta.88"
"@formily/react" "2.0.0-beta.88"
"@formily/reactive" "2.0.0-beta.88"
"@formily/reactive-react" "2.0.0-beta.88"
"@formily/shared" "2.0.0-beta.88"
"@juggle/resize-observer" "^3.3.1"
classnames "^2.2.6"
react-sortable-hoc "^1.11.0"
react-sticky-box "^0.9.3"
"@formily/core@2.0.0-beta.88", "@formily/core@^2.0.0-beta.84":
version "2.0.0-beta.88"
resolved "https://registry.nlark.com/@formily/core/download/@formily/core-2.0.0-beta.88.tgz?cache=0&sync_timestamp=1628480324723&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40formily%2Fcore%2Fdownload%2F%40formily%2Fcore-2.0.0-beta.88.tgz#b9264896ad91ee9114f4dd86ac466b41c8715529"
integrity sha1-uSZIlq2R7pEU9N2GrEZrQchxVSk=
dependencies:
"@formily/reactive" "2.0.0-beta.88"
"@formily/shared" "2.0.0-beta.88"
"@formily/validator" "2.0.0-beta.88"
"@formily/json-schema@2.0.0-beta.88", "@formily/json-schema@^2.0.0-beta.84":
version "2.0.0-beta.88"
resolved "https://registry.nlark.com/@formily/json-schema/download/@formily/json-schema-2.0.0-beta.88.tgz?cache=0&sync_timestamp=1628480324779&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40formily%2Fjson-schema%2Fdownload%2F%40formily%2Fjson-schema-2.0.0-beta.88.tgz#abd9c831a622b04558c98dbaf1bfa3656c6c334c"
integrity sha1-q9nIMaYisEVYyY268b+jZWxsM0w=
dependencies:
"@formily/core" "2.0.0-beta.88"
"@formily/reactive" "2.0.0-beta.88"
"@formily/shared" "2.0.0-beta.88"
"@formily/path@2.0.0-beta.88", "@formily/path@^2.0.0-beta.84":
version "2.0.0-beta.88"
resolved "https://registry.nlark.com/@formily/path/download/@formily/path-2.0.0-beta.88.tgz?cache=0&sync_timestamp=1628480324662&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40formily%2Fpath%2Fdownload%2F%40formily%2Fpath-2.0.0-beta.88.tgz#ebc8cb09f0659d4a0bb880535406bb9ae1e1fcf6"
integrity sha1-68jLCfBlnUoLuIBTVAa7muHh/PY=
"@formily/react@2.0.0-beta.88", "@formily/react@^2.0.0-beta.84":
version "2.0.0-beta.88"
resolved "https://registry.nlark.com/@formily/react/download/@formily/react-2.0.0-beta.88.tgz#c6110c32abe5f3279728d25fc5767872ce194308"
integrity sha1-xhEMMqvl8yeXKNJfxXZ4cs4ZQwg=
dependencies:
"@formily/core" "2.0.0-beta.88"
"@formily/json-schema" "2.0.0-beta.88"
"@formily/reactive" "2.0.0-beta.88"
"@formily/reactive-react" "2.0.0-beta.88"
"@formily/shared" "2.0.0-beta.88"
"@formily/validator" "2.0.0-beta.88"
hoist-non-react-statics "^3.3.2"
"@formily/reactive-react@2.0.0-beta.88", "@formily/reactive-react@^2.0.0-beta.84":
version "2.0.0-beta.88"
resolved "https://registry.nlark.com/@formily/reactive-react/download/@formily/reactive-react-2.0.0-beta.88.tgz?cache=0&sync_timestamp=1628480324067&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40formily%2Freactive-react%2Fdownload%2F%40formily%2Freactive-react-2.0.0-beta.88.tgz#2eb87e3d1a1ce811841d6cfdbea7d94f68c5a657"
integrity sha1-Lrh+PRoc6BGEHWz9vqfZT2jFplc=
dependencies:
"@formily/reactive" "2.0.0-beta.88"
hoist-non-react-statics "^3.3.2"
"@formily/reactive@2.0.0-beta.88", "@formily/reactive@^2.0.0-beta.84":
version "2.0.0-beta.88"
resolved "https://registry.nlark.com/@formily/reactive/download/@formily/reactive-2.0.0-beta.88.tgz?cache=0&sync_timestamp=1628480323614&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40formily%2Freactive%2Fdownload%2F%40formily%2Freactive-2.0.0-beta.88.tgz#97f5277e050b895b98944382fc0236f31473232a"
integrity sha1-l/UnfgULiVuYlEOC/AI28xRzIyo=
"@formily/shared@2.0.0-beta.88", "@formily/shared@^2.0.0-beta.84":
version "2.0.0-beta.88"
resolved "https://registry.nlark.com/@formily/shared/download/@formily/shared-2.0.0-beta.88.tgz?cache=0&sync_timestamp=1628480325706&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40formily%2Fshared%2Fdownload%2F%40formily%2Fshared-2.0.0-beta.88.tgz#c1afebc0f5a6328737bf25e7983643246411dc31"
integrity sha1-wa/rwPWmMoc3vyXnmDZDJGQR3DE=
dependencies:
"@formily/path" "2.0.0-beta.88"
camel-case "^4.1.1"
lower-case "^2.0.1"
no-case "^3.0.4"
param-case "^3.0.4"
pascal-case "^3.1.1"
upper-case "^2.0.1"
"@formily/validator@2.0.0-beta.88":
version "2.0.0-beta.88"
resolved "https://registry.nlark.com/@formily/validator/download/@formily/validator-2.0.0-beta.88.tgz?cache=0&sync_timestamp=1628480323886&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40formily%2Fvalidator%2Fdownload%2F%40formily%2Fvalidator-2.0.0-beta.88.tgz#33027b3adb75eab64ccd4137869ac152511464eb"
integrity sha1-MwJ7Ott16rZMzUE3hprBUlEUZOs=
dependencies:
"@formily/shared" "2.0.0-beta.88"
"@fusioncharts/charts@^3.16.0":
version "3.16.0"
resolved "https://registry.npmjs.org/@fusioncharts/charts/-/charts-3.16.0.tgz"
@ -2484,6 +2643,11 @@
"@types/yargs" "^15.0.0"
chalk "^4.0.0"
"@juggle/resize-observer@^3.3.1":
version "3.3.1"
resolved "https://registry.nlark.com/@juggle/resize-observer/download/@juggle/resize-observer-3.3.1.tgz#b50a781709c81e10701004214340f25475a171a0"
integrity sha1-tQp4FwnIHhBwEAQhQ0DyVHWhcaA=
"@manaflair/redux-batch@^1.0.0":
version "1.0.0"
resolved "https://registry.npmjs.org/@manaflair/redux-batch/-/redux-batch-1.0.0.tgz"
@ -2528,6 +2692,21 @@
version "1.6.18"
resolved "https://registry.npmjs.org/@mdx-js/util/-/util-1.6.18.tgz"
"@monaco-editor/loader@^1.1.1":
version "1.1.1"
resolved "https://registry.nlark.com/@monaco-editor/loader/download/@monaco-editor/loader-1.1.1.tgz?cache=0&sync_timestamp=1624254052274&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40monaco-editor%2Floader%2Fdownload%2F%40monaco-editor%2Floader-1.1.1.tgz#37db648c81a86946d0febd391de00df9c28a0a3d"
integrity sha1-N9tkjIGoaUbQ/r05HeAN+cKKCj0=
dependencies:
state-local "^1.0.6"
"@monaco-editor/react@^4.2.1":
version "4.2.2"
resolved "https://registry.nlark.com/@monaco-editor/react/download/@monaco-editor/react-4.2.2.tgz?cache=0&sync_timestamp=1628497722423&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40monaco-editor%2Freact%2Fdownload%2F%40monaco-editor%2Freact-4.2.2.tgz#636e5b8eb9519ef62f475f9a4a50f62ee0c493a8"
integrity sha1-Y25bjrlRnvYvR1+aSlD2LuDEk6g=
dependencies:
"@monaco-editor/loader" "^1.1.1"
prop-types "^15.7.2"
"@mrmlnc/readdir-enhanced@^2.2.1":
version "2.2.1"
resolved "https://registry.npmjs.org/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz"
@ -6389,7 +6568,7 @@ class-utils@^0.3.5:
isobject "^3.0.0"
static-extend "^0.1.1"
classnames@2.x, classnames@^2.2.3:
classnames@2.x, classnames@^2.2.3, classnames@^2.3.1:
version "2.3.1"
resolved "https://registry.npm.taobao.org/classnames/download/classnames-2.3.1.tgz?cache=0&sync_timestamp=1617400318265&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fclassnames%2Fdownload%2Fclassnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
integrity sha1-38+jiR4wbsHa0QXQ6I9EF7hTXo4=
@ -7334,6 +7513,11 @@ dateformat@^3.0.2:
version "3.0.3"
resolved "https://registry.npmjs.org/dateformat/-/dateformat-3.0.3.tgz"
dateformat@^4.5.1:
version "4.5.1"
resolved "https://registry.nlark.com/dateformat/download/dateformat-4.5.1.tgz#c20e7a9ca77d147906b6dc2261a8be0a5bd2173c"
integrity sha1-wg56nKd9FHkGttwiYai+ClvSFzw=
debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.0, debug@^2.6.9:
version "2.6.9"
resolved "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz"
@ -7723,6 +7907,14 @@ dot-case@^3.0.3:
no-case "^3.0.3"
tslib "^1.10.0"
dot-case@^3.0.4:
version "3.0.4"
resolved "https://registry.npm.taobao.org/dot-case/download/dot-case-3.0.4.tgz?cache=0&sync_timestamp=1606867327042&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fdot-case%2Fdownload%2Fdot-case-3.0.4.tgz#9b2b670d00a431667a8a75ba29cd1b98809ce751"
integrity sha1-mytnDQCkMWZ6inW6Kc0bmICc51E=
dependencies:
no-case "^3.0.4"
tslib "^2.0.3"
dot-prop@^5.2.0:
version "5.3.0"
resolved "https://registry.npmjs.org/dot-prop/-/dot-prop-5.3.0.tgz"
@ -11638,7 +11830,7 @@ lodash-es@4.17.14:
version "4.17.14"
resolved "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.14.tgz"
lodash-es@^4.17.21:
lodash-es@^4.17.15, lodash-es@^4.17.21:
version "4.17.21"
resolved "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz"
@ -11788,6 +11980,13 @@ lower-case@^2.0.1:
dependencies:
tslib "^1.10.0"
lower-case@^2.0.2:
version "2.0.2"
resolved "https://registry.npm.taobao.org/lower-case/download/lower-case-2.0.2.tgz#6fa237c63dbdc4a82ca0fd882e4722dc5e634e28"
integrity sha1-b6I3xj29xKgsoP2ILkci3F5jTig=
dependencies:
tslib "^2.0.3"
lowlight@~1.11.0:
version "1.11.0"
resolved "https://registry.npmjs.org/lowlight/-/lowlight-1.11.0.tgz"
@ -12350,6 +12549,11 @@ moment-timezone@*, moment-timezone@^0.5.27, moment-timezone@^0.5.31:
version "2.29.1"
resolved "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz"
monaco-editor@^0.25.2:
version "0.25.2"
resolved "https://registry.nlark.com/monaco-editor/download/monaco-editor-0.25.2.tgz#119e2b15bbd968a1a99c03cac9c329316d7c37e9"
integrity sha1-EZ4rFbvZaKGpnAPKycMpMW18N+k=
moo-color@^1.0.2:
version "1.0.2"
resolved "https://registry.npmjs.org/moo-color/-/moo-color-1.0.2.tgz"
@ -12503,6 +12707,14 @@ no-case@^3.0.3:
lower-case "^2.0.1"
tslib "^1.10.0"
no-case@^3.0.4:
version "3.0.4"
resolved "https://registry.npm.taobao.org/no-case/download/no-case-3.0.4.tgz#d361fd5c9800f558551a8369fc0dcd4662b6124d"
integrity sha1-02H9XJgA9VhVGoNp/A3NRmK2Ek0=
dependencies:
lower-case "^2.0.2"
tslib "^2.0.3"
node-dir@^0.1.10, node-dir@^0.1.17:
version "0.1.17"
resolved "https://registry.npmjs.org/node-dir/-/node-dir-0.1.17.tgz"
@ -13051,6 +13263,14 @@ param-case@^3.0.3:
dot-case "^3.0.3"
tslib "^1.10.0"
param-case@^3.0.4:
version "3.0.4"
resolved "https://registry.nlark.com/param-case/download/param-case-3.0.4.tgz#7d17fe4aa12bde34d4a77d91acfb6219caad01c5"
integrity sha1-fRf+SqEr3jTUp32RrPtiGcqtAcU=
dependencies:
dot-case "^3.0.4"
tslib "^2.0.3"
parent-module@^1.0.0:
version "1.0.1"
resolved "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz"
@ -14001,6 +14221,11 @@ prettier@^1.16.4, prettier@^1.18.2:
version "1.19.1"
resolved "https://registry.npmjs.org/prettier/-/prettier-1.19.1.tgz"
prettier@^2.3.2:
version "2.3.2"
resolved "https://registry.nlark.com/prettier/download/prettier-2.3.2.tgz?cache=0&sync_timestamp=1624696193562&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fprettier%2Fdownload%2Fprettier-2.3.2.tgz#ef280a05ec253712e486233db5c6f23441e7342d"
integrity sha1-7ygKBewlNxLkhiM9tcbyNEHnNC0=
pretty-bytes@^5.3.0:
version "5.4.1"
resolved "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-5.4.1.tgz"
@ -14134,7 +14359,7 @@ prompts@^2.0.1:
kleur "^3.0.3"
sisteransi "^1.0.4"
prop-types@^15.5.0, prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.0, prop-types@^15.7.2:
prop-types@^15.5.0, prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.7, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.0, prop-types@^15.7.2:
version "15.7.2"
resolved "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz"
dependencies:
@ -14847,6 +15072,19 @@ react-color@^2.17.0:
reactcss "^1.2.0"
tinycolor2 "^1.4.1"
react-color@^2.19.3:
version "2.19.3"
resolved "https://registry.npm.taobao.org/react-color/download/react-color-2.19.3.tgz#ec6c6b4568312a3c6a18420ab0472e146aa5683d"
integrity sha1-7GxrRWgxKjxqGEIKsEcuFGqlaD0=
dependencies:
"@icons/material" "^0.2.4"
lodash "^4.17.15"
lodash-es "^4.17.15"
material-colors "^1.2.1"
prop-types "^15.5.10"
reactcss "^1.2.0"
tinycolor2 "^1.4.1"
react-custom-scrollbars@^4.2.1:
version "4.2.1"
resolved "https://registry.npmjs.org/react-custom-scrollbars/-/react-custom-scrollbars-4.2.1.tgz"
@ -15368,6 +15606,15 @@ react-sizeme@^2.6.7:
shallowequal "^1.1.0"
throttle-debounce "^2.1.0"
react-sortable-hoc@^1.11.0:
version "1.11.0"
resolved "https://registry.nlark.com/react-sortable-hoc/download/react-sortable-hoc-1.11.0.tgz#fe4022362bbafc4b836f5104b9676608a40a278f"
integrity sha1-/kAiNiu6/EuDb1EEuWdmCKQKJ48=
dependencies:
"@babel/runtime" "^7.2.0"
invariant "^2.2.4"
prop-types "^15.5.7"
react-spring@^8.0.27:
version "8.0.27"
resolved "https://registry.npmjs.org/react-spring/-/react-spring-8.0.27.tgz"
@ -15375,6 +15622,14 @@ react-spring@^8.0.27:
"@babel/runtime" "^7.3.1"
prop-types "^15.5.8"
react-sticky-box@^0.9.3:
version "0.9.3"
resolved "https://registry.npm.taobao.org/react-sticky-box/download/react-sticky-box-0.9.3.tgz#8450d4cef8e4fdd7b0351520365bc98c97da11af"
integrity sha1-hFDUzvjk/dewNRUgNlvJjJfaEa8=
dependencies:
"@babel/runtime" "^7.1.5"
resize-observer-polyfill "^1.5.1"
react-syntax-highlighter@^11.0.2:
version "11.0.2"
resolved "https://registry.npmjs.org/react-syntax-highlighter/-/react-syntax-highlighter-11.0.2.tgz"
@ -15418,6 +15673,11 @@ react-textarea-autosize@^7.1.0:
"@babel/runtime" "^7.1.2"
prop-types "^15.6.0"
react-tiny-popover@^6.0.5:
version "6.0.10"
resolved "https://registry.nlark.com/react-tiny-popover/download/react-tiny-popover-6.0.10.tgz#6167a1b4a1ae6cf847d2909057defd00d95d726c"
integrity sha1-YWehtKGubPhH0pCQV979ANldcmw=
react-toastify@^5.5.0:
version "5.5.0"
resolved "https://registry.npmjs.org/react-toastify/-/react-toastify-5.5.0.tgz"
@ -15907,6 +16167,11 @@ request@^2.88.0, request@^2.88.2:
tunnel-agent "^0.6.0"
uuid "^3.3.2"
requestidlecallback@^0.3.0:
version "0.3.0"
resolved "https://registry.nlark.com/requestidlecallback/download/requestidlecallback-0.3.0.tgz#6fb74e0733f90df3faa4838f9f6a2a5f9b742ac5"
integrity sha1-b7dOBzP5DfP6pIOPn2oqX5t0KsU=
require-directory@^2.1.1:
version "2.1.1"
resolved "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz"
@ -16799,6 +17064,11 @@ stackframe@^1.1.1:
version "1.2.0"
resolved "https://registry.npmjs.org/stackframe/-/stackframe-1.2.0.tgz"
state-local@^1.0.6:
version "1.0.7"
resolved "https://registry.nlark.com/state-local/download/state-local-1.0.7.tgz#da50211d07f05748d53009bee46307a37db386d5"
integrity sha1-2lAhHQfwV0jVMAm+5GMHo32zhtU=
state-toggle@^1.0.0:
version "1.0.3"
resolved "https://registry.npmjs.org/state-toggle/-/state-toggle-1.0.3.tgz"
@ -17613,6 +17883,11 @@ tslib@^2.0.0, tslib@^2.0.1:
version "2.0.3"
resolved "https://registry.npmjs.org/tslib/-/tslib-2.0.3.tgz"
tslib@^2.0.3:
version "2.3.0"
resolved "https://registry.nlark.com/tslib/download/tslib-2.3.0.tgz#803b8cdab3e12ba581a4ca41c8839bbb0dacb09e"
integrity sha1-gDuM2rPhK6WBpMpByIObuw2ssJ4=
tslib@^2.1.0:
version "2.1.0"
resolved "https://registry.npmjs.org/tslib/-/tslib-2.1.0.tgz"
@ -17908,6 +18183,13 @@ upath@^1.1.1, upath@^1.1.2, upath@^1.2.0:
version "1.2.0"
resolved "https://registry.npmjs.org/upath/-/upath-1.2.0.tgz"
upper-case@^2.0.1:
version "2.0.2"
resolved "https://registry.nlark.com/upper-case/download/upper-case-2.0.2.tgz#d89810823faab1df1549b7d97a76f8662bae6f7a"
integrity sha1-2JgQgj+qsd8VSbfZenb4Ziuub3o=
dependencies:
tslib "^2.0.3"
uri-js@^4.2.2:
version "4.4.0"
resolved "https://registry.npmjs.org/uri-js/-/uri-js-4.4.0.tgz"