diff --git a/packages/react/src/patterns/OneDataCollection/actions.tsx b/packages/react/src/patterns/OneDataCollection/actions.tsx index 8604155ccb..7c80269615 100644 --- a/packages/react/src/patterns/OneDataCollection/actions.tsx +++ b/packages/react/src/patterns/OneDataCollection/actions.tsx @@ -56,6 +56,9 @@ export type SecondaryActionItem = Pick< disabled: boolean loading: boolean }) => string | undefined + /** A count shown to the right of the label, e.g. how many items the action + * concerns. Ignored while the action is collapsed into the overflow menu. */ + counterValue?: number } export type SecondaryActionGroup = { diff --git a/packages/react/src/patterns/OneDataCollection/components/CollectionActions/CollectionActions.tsx b/packages/react/src/patterns/OneDataCollection/components/CollectionActions/CollectionActions.tsx index e81db6400c..3841a28879 100644 --- a/packages/react/src/patterns/OneDataCollection/components/CollectionActions/CollectionActions.tsx +++ b/packages/react/src/patterns/OneDataCollection/components/CollectionActions/CollectionActions.tsx @@ -139,6 +139,7 @@ export const CollectionActions = ({ variant="outline" hideLabel={action.hideLabelWhenExpanded} label={action.label} + counterValue={action.counterValue} disabled={action.disabled} loading={action.loading} /> diff --git a/packages/react/src/patterns/OneDataCollection/components/CollectionActions/__tests__/CollectionActions.test.tsx b/packages/react/src/patterns/OneDataCollection/components/CollectionActions/__tests__/CollectionActions.test.tsx index becb231c7a..2eb877edff 100644 --- a/packages/react/src/patterns/OneDataCollection/components/CollectionActions/__tests__/CollectionActions.test.tsx +++ b/packages/react/src/patterns/OneDataCollection/components/CollectionActions/__tests__/CollectionActions.test.tsx @@ -401,6 +401,27 @@ describe("CollectionActions", () => { expect(screen.getByText("Export")).toBeInTheDocument() }) + it("forwards counterValue to the secondary action button", () => { + render( + + ) + + expect(screen.getByText("To review")).toBeInTheDocument() + expect(screen.getByTestId("f0-button")).toHaveAttribute( + "counterValue", + "3" + ) + }) + it("renders secondary action without Tooltip when tooltip is not provided", () => { render(