diff --git a/CHANGELOG.md b/CHANGELOG.md
index 66abc25eb60d..6ffc85fbbb0e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,7 @@
## [`master`](https://github.com/elastic/eui/tree/master)
- Added a new `colorPalette` service for retrieving and generating color arrays for use in charts ([#1209](https://github.com/elastic/eui/pull/1209))
+- Added `1` as a valid value for the `columns` prop in `EuiFlexGrid` ([#1210](https://github.com/elastic/eui/pull/1210))
## [`4.2.0`](https://github.com/elastic/eui/tree/v4.2.0)
@@ -15,6 +16,7 @@
- Fixed issue with unselected tabs and aria-controls attribute in EuiTabbedContent
- Added `tag` icon ([#1188](https://github.com/elastic/eui/pull/1188))
- Replaced `logging` app icon ([#1194](https://github.com/elastic/eui/pull/1194))
+- Made `EuiBasicTable` rows keyboard-accessibile when they are clickable ([#1206](https://github.com/elastic/eui/pull/1206))
**Bug fixes**
diff --git a/src-docs/src/views/flex/flex_example.js b/src-docs/src/views/flex/flex_example.js
index 4ea7b44a29e2..d3930c5394d6 100644
--- a/src-docs/src/views/flex/flex_example.js
+++ b/src-docs/src/views/flex/flex_example.js
@@ -294,7 +294,7 @@ export const FlexExample = {
text: (
You can set a columns prop to specify
- anywhere between 2-4 columns. Any more would likely break on laptop screens.
+ anywhere between 1-4 columns. Any more would likely break on laptop screens.
),
demo:
,
diff --git a/src/components/basic_table/__snapshots__/basic_table.test.js.snap b/src/components/basic_table/__snapshots__/basic_table.test.js.snap
index 3a9fbbee5d4c..d016c0be2002 100644
--- a/src/components/basic_table/__snapshots__/basic_table.test.js.snap
+++ b/src/components/basic_table/__snapshots__/basic_table.test.js.snap
@@ -899,59 +899,65 @@ exports[`EuiBasicTable rowProps renders rows with custom props from a callback 1
-
-
+
- name1
-
-
+
+ name1
+
+
+
-
-
+
- name2
-
-
+
+ name2
+
+
+
-
-
+
- name3
-
-
+
+ name3
+
+
+
@@ -993,59 +999,65 @@ exports[`EuiBasicTable rowProps renders rows with custom props from an object 1`
-
-
+
- name1
-
-
+
+ name1
+
+
+
-
-
+
- name2
-
-
+
+ name2
+
+
+
-
-
+
- name3
-
-
+
+ name3
+
+
+
diff --git a/src/components/basic_table/basic_table.js b/src/components/basic_table/basic_table.js
index 5d787ecd7bd4..9d689090f868 100644
--- a/src/components/basic_table/basic_table.js
+++ b/src/components/basic_table/basic_table.js
@@ -32,7 +32,7 @@ import { LoadingTableBody } from './loading_table_body';
import { EuiTableHeaderMobile } from '../table/mobile/table_header_mobile';
import { EuiTableSortMobile } from '../table/mobile/table_sort_mobile';
import { withRequiredProp } from '../../utils/prop_types/with_required_prop';
-import { EuiScreenReaderOnly } from '../accessibility';
+import { EuiScreenReaderOnly, EuiKeyboardAccessible } from '../accessibility';
const dataTypesProfiles = {
auto: {
@@ -678,19 +678,25 @@ export class EuiBasicTable extends Component {
const { rowProps: rowPropsCallback } = this.props;
const rowProps = getRowProps(item, rowPropsCallback);
+ const row = (
+
+ {cells}
+
+ );
return (
-
- {cells}
-
+ {rowProps.onClick
+ ? {row}
+ : row
+ }
{expandedRow}
);
diff --git a/src/components/flex/__snapshots__/flex_grid.test.js.snap b/src/components/flex/__snapshots__/flex_grid.test.js.snap
index 9e07144d73b8..2cd971c11dac 100644
--- a/src/components/flex/__snapshots__/flex_grid.test.js.snap
+++ b/src/components/flex/__snapshots__/flex_grid.test.js.snap
@@ -18,6 +18,12 @@ exports[`EuiFlexGrid props columns 0 is rendered 1`] = `
/>
`;
+exports[`EuiFlexGrid props columns 1 is rendered 1`] = `
+
+`;
+
exports[`EuiFlexGrid props columns 2 is rendered 1`] = `
{
const classes = classNames('euiTableRow', className, {
@@ -18,11 +19,13 @@ export const EuiTableRow = ({
'euiTableRow-hasActions': hasActions,
'euiTableRow-isExpandedRow': isExpandedRow,
'euiTableRow-isExpandable': isExpandable,
+ 'euiTableRow-isClickable': onClick,
});
return (
{children}