diff --git a/packages/frontend-core/src/components/sheet/KeyboardManager.svelte b/packages/frontend-core/src/components/sheet/KeyboardManager.svelte index 684ce81fe0..2b90dfdd1c 100644 --- a/packages/frontend-core/src/components/sheet/KeyboardManager.svelte +++ b/packages/frontend-core/src/components/sheet/KeyboardManager.svelte @@ -12,22 +12,25 @@ } = getContext("sheet") const handleKeyDown = e => { - const api = get(selectedCellAPI) - if (!api) { + if (!get(selectedCellId)) { + if (e.key === "Tab") { + selectFirstCell() + } return } + const api = get(selectedCellAPI) // Always intercept certain key presses if (e.key === "Escape") { - api.blur() + api?.blur?.() } else if (e.key === "Tab") { - api.blur() + api?.blur?.() changeSelectedColumn(1) } // Pass the key event to the selected cell and let it decide whether to // capture it or not - const handled = api.onKeyDown?.(e) + const handled = api?.onKeyDown?.(e) if (handled) { return } @@ -56,6 +59,10 @@ } } + const selectFirstCell = () => { + console.log("select first") + } + const changeSelectedColumn = delta => { if (!$selectedCellId) { return @@ -100,7 +107,7 @@ } const focusSelectedCell = () => { - $selectedCellAPI?.focus() + $selectedCellAPI?.focus?.() } onMount(() => { diff --git a/packages/frontend-core/src/components/sheet/cells/BooleanCell.svelte b/packages/frontend-core/src/components/sheet/cells/BooleanCell.svelte new file mode 100644 index 0000000000..1b5ea6d606 --- /dev/null +++ b/packages/frontend-core/src/components/sheet/cells/BooleanCell.svelte @@ -0,0 +1,44 @@ + + +
+ +
+ + diff --git a/packages/frontend-core/src/components/sheet/renderers.js b/packages/frontend-core/src/components/sheet/renderers.js index dca114346c..a2f46923bc 100644 --- a/packages/frontend-core/src/components/sheet/renderers.js +++ b/packages/frontend-core/src/components/sheet/renderers.js @@ -6,16 +6,17 @@ import RelationshipCell from "./cells/RelationshipCell.svelte" import TextCell from "./cells/TextCell.svelte" import BlankCell from "./cells/BlankCell.svelte" import LongFormCell from "./cells/LongFormCell.svelte" +import BooleanCell from "./cells/BooleanCell.svelte" const TypeComponentMap = { text: TextCell, options: OptionsCell, datetime: DateCell, - barcodeqr: BlankCell, + barcodeqr: TextCell, longform: LongFormCell, array: MultiSelectCell, number: NumberCell, - boolean: BlankCell, + boolean: BooleanCell, attachment: BlankCell, link: RelationshipCell, formula: BlankCell,