mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2025-01-11 21:07:28 -08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: change rename node keyboard shortcut to space

Browse source
This commit is contained in:
Alex Grozav 2024-11-25 15:28:32 +02:00
parent 91d1bd8d33
commit 01248b8585
3 changed files with 27 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
packages/editor-ui/src/components/ContextMenu/ContextMenu.vue
View file

@ -1,13 +1,19 @@
<script lang="ts" setup> <script lang="ts" setup>
import { type ContextMenuAction, useContextMenu } from '@/composables/useContextMenu'; import type { ContextMenuOptions, ContextMenuAction } from '@/composables/useContextMenu';
import { useContextMenu } from '@/composables/useContextMenu';
import { N8nActionDropdown } from 'n8n-design-system'; import { N8nActionDropdown } from 'n8n-design-system';
import { watch, ref } from 'vue'; import { watch, ref } from 'vue';
import { onClickOutside } from '@vueuse/core'; import { onClickOutside } from '@vueuse/core';
const contextMenu = useContextMenu(); const emit = defineEmits<{ action: [action: ContextMenuAction, nodeIds: string[]] }>();
const props = defineProps<{
shortcuts?: ContextMenuOptions['shortcuts'];
}>();
const contextMenu = useContextMenu(() => {}, props);
const { position, isOpen, actions, target } = contextMenu; const { position, isOpen, actions, target } = contextMenu;
const dropdown = ref<InstanceType<typeof N8nActionDropdown>>(); const dropdown = ref<InstanceType<typeof N8nActionDropdown>>();
const emit = defineEmits<{ action: [action: ContextMenuAction, nodeIds: string[]] }>();
const container = ref<HTMLDivElement>(); const container = ref<HTMLDivElement>();
watch( watch(

13
packages/editor-ui/src/components/canvas/Canvas.vue
View file

@ -146,7 +146,7 @@ const disableKeyBindings = computed(() => !props.keyBindings);
/** /**
* @see https://developer.mozilla.org/en-US/docs/Web/API/UI_Events/Keyboard_event_key_values#whitespace_keys * @see https://developer.mozilla.org/en-US/docs/Web/API/UI_Events/Keyboard_event_key_values#whitespace_keys
*/ */
const panningKeyCode = ref<string[]>([' ', controlKeyCode]); const panningKeyCode = ref<string[]>([controlKeyCode]);
const panningMouseButton = ref<number[]>([1]); const panningMouseButton = ref<number[]>([1]);
const selectionKeyCode = ref<true | null>(true); const selectionKeyCode = ref<true | null>(true);
@ -230,7 +230,8 @@ const keyMap = computed(() => ({
ctrl_d: emitWithSelectedNodes((ids) => emit('duplicate:nodes', ids)), ctrl_d: emitWithSelectedNodes((ids) => emit('duplicate:nodes', ids)),
d: emitWithSelectedNodes((ids) => emit('update:nodes:enabled', ids)), d: emitWithSelectedNodes((ids) => emit('update:nodes:enabled', ids)),
p: emitWithSelectedNodes((ids) => emit('update:nodes:pin', ids, 'keyboard-shortcut')), p: emitWithSelectedNodes((ids) => emit('update:nodes:pin', ids, 'keyboard-shortcut')),
f2: emitWithLastSelectedNode((id) => emit('update:node:name', id)), o: emitWithLastSelectedNode((id) => onSetNodeActive(id)),
' |f2': emitWithLastSelectedNode((id) => emit('update:node:name', id)),
tab: () => emit('create:node', 'tab'), tab: () => emit('create:node', 'tab'),
shift_s: () => emit('create:sticky'), shift_s: () => emit('create:sticky'),
ctrl_alt_n: () => emit('create:workflow'), ctrl_alt_n: () => emit('create:workflow'),
@ -486,7 +487,11 @@ function onPaneMoveEnd() {
* Context menu * Context menu
*/ */
const contextMenu = useContextMenu(); const contextMenuShortcuts = {
rename: { keys: ['⎵'] },
};
const contextMenu = useContextMenu(() => {}, { shortcuts: contextMenuShortcuts });
function onOpenContextMenu(event: MouseEvent) { function onOpenContextMenu(event: MouseEvent) {
contextMenu.open(event, { contextMenu.open(event, {
@ -720,7 +725,7 @@ provide(CanvasKey, {
/> />
<Suspense> <Suspense>
<ContextMenu @action="onContextMenuAction" /> <ContextMenu :shortcuts="contextMenuShortcuts" @action="onContextMenuAction" />
</Suspense> </Suspense>
</VueFlow> </VueFlow>
</template> </template>

11
packages/editor-ui/src/composables/useContextMenu.ts
View file

@ -33,13 +33,20 @@ export type ContextMenuAction =
| 'add_sticky' | 'add_sticky'
| 'change_color'; | 'change_color';
export type ContextMenuOptions = {
shortcuts?: Record<ContextMenuAction, { metaKey?: boolean; keys: string[] }>;
};
const position = ref<XYPosition>([0, 0]); const position = ref<XYPosition>([0, 0]);
const isOpen = ref(false); const isOpen = ref(false);
const target = ref<ContextMenuTarget>(); const target = ref<ContextMenuTarget>();
const actions = ref<ActionDropdownItem[]>([]); const actions = ref<ActionDropdownItem[]>([]);
const actionCallback = ref<ContextMenuActionCallback>(() => {}); const actionCallback = ref<ContextMenuActionCallback>(() => {});
export const useContextMenu = (onAction: ContextMenuActionCallback = () => {}) => { export const useContextMenu = (
onAction: ContextMenuActionCallback = () => {},
options: ContextMenuOptions = {},
) => {
const uiStore = useUIStore(); const uiStore = useUIStore();
const nodeTypesStore = useNodeTypesStore(); const nodeTypesStore = useNodeTypesStore();
const workflowsStore = useWorkflowsStore(); const workflowsStore = useWorkflowsStore();
@ -219,7 +226,7 @@ export const useContextMenu = (onAction: ContextMenuActionCallback = () => {}) =
{ {
id: 'rename', id: 'rename',
label: i18n.baseText('contextMenu.rename'), label: i18n.baseText('contextMenu.rename'),
shortcut: { keys: ['F2'] }, shortcut: options.shortcuts?.rename ?? { keys: ['F2'] },
disabled: isReadOnly.value, disabled: isReadOnly.value,
}, },
]; ];