diff --git a/packages/nc-gui/components/cell/SingleSelect.vue b/packages/nc-gui/components/cell/SingleSelect.vue index cb9258505c..bdccb6a872 100644 --- a/packages/nc-gui/components/cell/SingleSelect.vue +++ b/packages/nc-gui/components/cell/SingleSelect.vue @@ -2,7 +2,17 @@ import tinycolor from 'tinycolor2' import type { Select as AntSelect } from 'ant-design-vue' import type { SelectOptionType } from 'nocodb-sdk' -import { ActiveCellInj, ColumnInj, IsKanbanInj, ReadonlyInj, computed, inject, ref, useEventListener, watch } from '#imports' +import { + ActiveCellInj, + ColumnInj, + IsKanbanInj, + ReadonlyInj, + computed, + inject, + ref, + useEventListener, + watch, +} from '#imports' interface Props { modelValue?: string | undefined @@ -34,7 +44,7 @@ const options = computed(() => { if (column?.value.colOptions) { const opts = column.value.colOptions ? // todo: fix colOptions type, options does not exist as a property - (column.value.colOptions as any).options.filter((el: SelectOptionType) => el.title !== '') || [] + (column.value.colOptions as any).options.filter((el: SelectOptionType) => el.title !== '') || [] : [] for (const op of opts.filter((el: any) => el.order === null)) { op.title = op.title.replace(/^'/, '').replace(/'$/, '') @@ -50,6 +60,11 @@ const handleKeys = (e: KeyboardEvent) => { e.preventDefault() isOpen.value = false break + case 'ArrowDown': + case 'ArrowUp': + case 'Enter': + e.stopPropagation() + break } } @@ -110,9 +125,11 @@ watch(isOpen, (n, _o) => { .rounded-tag { @apply py-0 px-[12px] rounded-[12px]; } + :deep(.ant-tag) { @apply "rounded-tag"; } + :deep(.ant-select-clear) { opacity: 1; }