diff --git a/packages/table-generator/ui-src/components/TableControl.tsx b/packages/table-generator/ui-src/components/TableControl.tsx
index a494d16..2137831 100644
--- a/packages/table-generator/ui-src/components/TableControl.tsx
+++ b/packages/table-generator/ui-src/components/TableControl.tsx
@@ -61,6 +61,8 @@ const TableCell = React.memo(function TableCell({
{
dispatch({
@@ -84,7 +86,20 @@ const TableCell = React.memo(function TableCell({
selectStart,
selectEnd,
});
- event.preventDefault(); // To support pasting into multi-range cells
+ event.preventDefault(); // Stop default pasting bahaviour, reducer updates multiple cell values directly
+ }}
+ onKeyUp={(event) => {
+ if (event.code === "Enter") {
+ const inputEle = document
+ .querySelector(".table-control-table")
+ ?.querySelector(
+ `.table-control-table-input[data-row="${
+ row + (event.shiftKey ? -1 : 1)
+ }"][data-column="${column}"] input`
+ ) as HTMLInputElement | null;
+ inputEle?.focus();
+ inputEle?.select(); // "Tab" does this as well
+ }
}}
/>
|
@@ -140,9 +155,13 @@ const TableHeaderCell = React.memo(
columnIndex: number;
}) => {
if (editable) {
+ const row = -1;
return (
{
dispatch({
@@ -151,6 +170,19 @@ const TableHeaderCell = React.memo(
newValue: value,
});
}}
+ onKeyUp={(event) => {
+ if (event.code === "Enter") {
+ const inputEle = document
+ .querySelector(".table-control-table")
+ ?.querySelector(
+ `.table-control-table-input[data-row="${
+ row + (event.shiftKey ? -1 : 1)
+ }"][data-column="${columnIndex}"] input`
+ ) as HTMLInputElement | null;
+ inputEle?.focus();
+ inputEle?.select(); // "Tab" does this as well
+ }
+ }}
/>
|
);
@@ -177,9 +209,13 @@ const TableGroupHeaderCell = React.memo(
columnIndex: number;
}) => {
if (editable) {
+ const row = -2;
return (
{
dispatch({
@@ -188,6 +224,19 @@ const TableGroupHeaderCell = React.memo(
newValue: value,
});
}}
+ onKeyUp={(event) => {
+ if (event.code === "Enter") {
+ const inputEle = document
+ .querySelector(".table-control-table")
+ ?.querySelector(
+ `.table-control-table-input[data-row="${
+ row + (event.shiftKey ? -1 : 1)
+ }"][data-column="${columnIndex}"] input`
+ ) as HTMLInputElement | null;
+ inputEle?.focus();
+ inputEle?.select(); // "Tab" does this as well
+ }
+ }}
/>
|
);