Skip to content

feat(multi-select): add collapseSelectionAfter prop#1735

Merged
eirikhaugstulen merged 2 commits intomasterfrom
feat/multi-select-collapse-selection-after
Apr 16, 2026
Merged

feat(multi-select): add collapseSelectionAfter prop#1735
eirikhaugstulen merged 2 commits intomasterfrom
feat/multi-select-collapse-selection-after

Conversation

@eirikhaugstulen
Copy link
Copy Markdown
Contributor

@eirikhaugstulen eirikhaugstulen commented Apr 12, 2026

Summary

  • Add a collapseSelectionAfter prop to MultiSelect that replaces individual chips with "X selected" text once the selection count exceeds the given threshold
demo_threshold3.mp4

When the number of selected items exceeds the given threshold,
individual chips are replaced with "X selected" text.
@dhis2-bot
Copy link
Copy Markdown
Contributor

dhis2-bot commented Apr 12, 2026

🚀 Deployed on https://pr-1735--dhis2-ui.netlify.app

@dhis2-bot dhis2-bot temporarily deployed to netlify April 12, 2026 14:02 Inactive
@cooper-joe
Copy link
Copy Markdown
Member

Nice suggestion @eirikhaugstulen, I think this is a helpful addition to the component.

I do think it is important to frame this as a robustness or resilience feature, rather than an endorsement of using this component for very large selections. If a field often ends up with many selected items, a Transfer or an always-open SelectPanel might be a better fit. But this feature does help prevent an awkward UI when a multiselect occasionally has many selections. This can be explained in the component documentation, I'm happy to add that as a follow up to this.

Copy link
Copy Markdown
Contributor

@KaiVandivier KaiVandivier left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please add the new prop to /components/select/types/index.d.ts -- otherwise, looks good

@eirikhaugstulen eirikhaugstulen marked this pull request as ready for review April 16, 2026 09:31
@eirikhaugstulen eirikhaugstulen requested a review from a team as a code owner April 16, 2026 09:31
@sonarqubecloud
Copy link
Copy Markdown

@eirikhaugstulen eirikhaugstulen merged commit fab1525 into master Apr 16, 2026
19 checks passed
@eirikhaugstulen eirikhaugstulen deleted the feat/multi-select-collapse-selection-after branch April 16, 2026 10:39
dhis2-bot added a commit that referenced this pull request Apr 16, 2026
# [10.13.0](v10.12.13...v10.13.0) (2026-04-16)

### Features

* **multi-select:** add collapseSelectionAfter prop ([#1735](#1735)) ([fab1525](fab1525))
@dhis2-bot
Copy link
Copy Markdown
Contributor

🎉 This PR is included in version 10.13.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants