diff --git a/CHANGELOG.md b/CHANGELOG.md
index 654377fd560..8c9be4e6973 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,7 +5,6 @@
- Removed `src/test` and `@types/enzyme` references from `eui.d.ts` ([#3715](https://github.com/elastic/eui/pull/3715))
- Added `index.d.ts` file to `lib/test` and `es/test` ([#3715](https://github.com/elastic/eui/pull/3715))
- Added `descriptionFlexItemProps` and `fieldFlexItemProps` props to `EuiDescribedFormGroup` ([#3717](https://github.com/elastic/eui/pull/3717))
-- Expanded `EuiBasicTable`'s default action's name configuration to accept a function that returns a React node ([#3739](https://github.com/elastic/eui/pull/3739))
## [`27.0.0`](https://github.com/elastic/eui/tree/v27.0.0)
- Added `paddingSize` prop to `EuiCard` ([#3638](https://github.com/elastic/eui/pull/3638))
diff --git a/src-docs/src/views/tables/actions/actions.js b/src-docs/src/views/tables/actions/actions.js
index 6545e5cc5b5..967b86c48a1 100644
--- a/src-docs/src/views/tables/actions/actions.js
+++ b/src-docs/src/views/tables/actions/actions.js
@@ -141,7 +141,7 @@ export const Table = () => {
'data-test-subj': 'action-clone',
},
{
- name: item => (item.id ? 'Delete' : 'Remove'),
+ name: 'Delete',
description: 'Delete this user',
icon: 'trash',
color: 'danger',
diff --git a/src-docs/src/views/tables/basic/props_info.js b/src-docs/src/views/tables/basic/props_info.js
index 2533d355b70..838ae1ab060 100644
--- a/src-docs/src/views/tables/basic/props_info.js
+++ b/src-docs/src/views/tables/basic/props_info.js
@@ -395,7 +395,7 @@ export const propsInfo = {
description:
'The display name of the action (will be the button caption)',
required: true,
- type: { name: 'PropTypes.node | (item) => PropTypes.node' },
+ type: { name: 'PropTypes.node' },
},
description: {
description: 'Describes the action (will be the button title)',
diff --git a/src/components/basic_table/__snapshots__/default_item_action.test.tsx.snap b/src/components/basic_table/__snapshots__/default_item_action.test.tsx.snap
index 34f82252ca5..22b39650e76 100644
--- a/src/components/basic_table/__snapshots__/default_item_action.test.tsx.snap
+++ b/src/components/basic_table/__snapshots__/default_item_action.test.tsx.snap
@@ -60,23 +60,3 @@ exports[`DefaultItemAction render - icon 1`] = `
`;
-
-exports[`DefaultItemAction render - name 1`] = `
-
-
-
- xyz
-
-
-
-`;
diff --git a/src/components/basic_table/action_types.ts b/src/components/basic_table/action_types.ts
index 1057e7b9c9c..1f9a1d9a746 100644
--- a/src/components/basic_table/action_types.ts
+++ b/src/components/basic_table/action_types.ts
@@ -28,7 +28,7 @@ type ButtonColor = EuiButtonIconColor | EuiButtonEmptyColor;
type EuiButtonIconColorFunction = (item: T) => ButtonColor;
interface DefaultItemActionBase {
- name: ReactNode | ((item: T) => ReactNode);
+ name: ReactNode;
description: string;
onClick?: (item: T) => void;
href?: string;
diff --git a/src/components/basic_table/collapsed_item_actions.test.tsx b/src/components/basic_table/collapsed_item_actions.test.tsx
index 1c22d421c09..337ec34a935 100644
--- a/src/components/basic_table/collapsed_item_actions.test.tsx
+++ b/src/components/basic_table/collapsed_item_actions.test.tsx
@@ -27,7 +27,7 @@ describe('CollapsedItemActions', () => {
const props = {
actions: [
{
- name: (item: { id: string }) => `default${item.id}`,
+ name: 'default1',
description: 'default 1',
onClick: () => {},
},
@@ -38,7 +38,7 @@ describe('CollapsedItemActions', () => {
},
],
itemId: 'id',
- item: { id: '1' },
+ item: { id: 'xyz' },
actionEnabled: (_: Action<{ id: string }>) => true,
onFocus: (_: FocusEvent) => {},
onBlur: () => {},
diff --git a/src/components/basic_table/collapsed_item_actions.tsx b/src/components/basic_table/collapsed_item_actions.tsx
index d33c9cb919f..d9a1cbcdc47 100644
--- a/src/components/basic_table/collapsed_item_actions.tsx
+++ b/src/components/basic_table/collapsed_item_actions.tsx
@@ -152,7 +152,6 @@ export class CollapsedItemActions extends Component<
if (buttonIcon) {
icon = isString(buttonIcon) ? buttonIcon : buttonIcon(item);
}
- const buttonContent = typeof name === 'function' ? name(item) : name;
controls.push(
extends Component<
onClick={() =>
this.onClickItem(onClick ? () => onClick(item) : undefined)
}>
- {buttonContent}
+ {name}
);
}
diff --git a/src/components/basic_table/default_item_action.test.tsx b/src/components/basic_table/default_item_action.test.tsx
index 6cce1dae8fd..fb9239d59e5 100644
--- a/src/components/basic_table/default_item_action.test.tsx
+++ b/src/components/basic_table/default_item_action.test.tsx
@@ -72,24 +72,6 @@ describe('DefaultItemAction', () => {
expect(component).toMatchSnapshot();
});
- test('render - name', () => {
- const action: EmptyButtonAction- = {
- name: item => {item.id},
- description: 'action 1',
- type: 'button',
- onClick: () => {},
- };
- const props = {
- action,
- enabled: true,
- item: { id: 'xyz' },
- };
-
- const component = shallow();
-
- expect(component).toMatchSnapshot();
- });
-
test('render - icon', () => {
const action: IconButtonAction
- = {
name: action1,
diff --git a/src/components/basic_table/default_item_action.tsx b/src/components/basic_table/default_item_action.tsx
index ddf64608003..6bdd646c3aa 100644
--- a/src/components/basic_table/default_item_action.tsx
+++ b/src/components/basic_table/default_item_action.tsx
@@ -68,8 +68,6 @@ export const DefaultItemAction = ({
}
let button;
- const actionContent =
- typeof action.name === 'function' ? action.name(item) : action.name;
if (action.type === 'icon') {
if (!icon) {
throw new Error(`Cannot render item action [${
@@ -91,9 +89,9 @@ export const DefaultItemAction = ({
target={action.target}
data-test-subj={action['data-test-subj']}
/>
- {/* actionContent (action.name) is a ReactNode and must be rendered to an element and referenced by ID for screen readers */}
+ {/* action.name is a ReactNode and must be rendered to an element and referenced by ID for screen readers */}
- {actionContent}
+ {action.name}
>
);
@@ -110,7 +108,7 @@ export const DefaultItemAction = ({
target={action.target}
data-test-subj={action['data-test-subj']}
flush="right">
- {actionContent}
+ {action.name}
);
}