mirror/sunmao-ui
2
0
Fork 0
mirror of https://github.com/smartxworks/sunmao-ui.git synced 2025-02-17 17:40:31 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(editor): prevent API and state form keyboard events to accidentally trigger operation shortcut

Browse Source
This commit is contained in:
MrWindlike 2022-02-21 11:22:56 +08:00
parent 42759fd157
commit b0eb0921e2
4 changed files with 18 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/editor/src/components/DataSource/ApiForm/ApiForm.tsx
View File

@ -95,6 +95,10 @@ export const ApiForm: React.FC<Props> = props => {
setTabIndex(0);
}
};
const onKeyDown = (e: React.KeyboardEvent) => {
// prevent form keyboard events to accidentally trigger operation shortcut
e.stopPropagation();
};
useEffect(() => {
formik.setValues({
@ -116,6 +120,7 @@ export const ApiForm: React.FC<Props> = props => {
paddingBottom="0"
align="stretch"
spacing="4"
onKeyDown={onKeyDown}
>
<HStack
alignItems="center"

3
packages/editor/src/components/DataSource/DataSource.tsx
View File

@ -36,15 +36,18 @@ export const DataSource: React.FC<Props> = props => {
const { apis, states } = editorStore.dataSources;
const onMenuItemClick = (type: DataSourceType) => {
editorStore.createDataSource(type);
editorStore.setSelectedComponentId('');
};
const onApiItemClick = (api: ComponentSchema) => {
editorStore.setActiveDataSource(api);
editorStore.setActiveDataSourceType(DataSourceType.API);
editorStore.setSelectedComponentId('');
};
const onStateItemClick = (state: ComponentSchema) => {
editorStore.setActiveDataSource(state);
editorStore.setActiveDataSourceType(DataSourceType.STATE);
editorStore.setToolMenuTab(ToolMenuTabs.INSPECT);
editorStore.setSelectedComponentId('');
};
const onApiItemRemove = (api: ComponentSchema) => {
editorStore.removeDataSource(api);

6
packages/editor/src/components/DataSource/StateForm/StateForm.tsx
View File

@ -47,6 +47,10 @@ export const StateForm: React.FC<Props> = props => {
}
}
};
const onKeyDown = (e: React.KeyboardEvent) => {
// prevent form keyboard events to accidentally trigger operation shortcut
e.stopPropagation();
};
useEffect(() => {
formik.setValues({
@ -61,7 +65,7 @@ export const StateForm: React.FC<Props> = props => {
}, [state.id]);
return (
<VStack p="2" spacing="2" background="gray.50">
<VStack p="2" spacing="2" background="gray.50" onKeyDown={onKeyDown}>
<FormControl>
<FormLabel>Name</FormLabel>
<Input

8
packages/editor/src/services/EditorStore.ts
View File

@ -89,9 +89,11 @@ export class EditorStore {
reaction(
() => this.selectedComponentId,
() => {
this.setToolMenuTab(ToolMenuTabs.INSPECT);
this.setActiveDataSource(null);
this.setActiveDataSourceType(null);
if (this.selectedComponentId) {
this.setToolMenuTab(ToolMenuTabs.INSPECT);
this.setActiveDataSource(null);
this.setActiveDataSourceType(null);
}
}
);