Skip to content

✨ - feat: multi-select #200

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jun 5, 2025
Merged

✨ - feat: multi-select #200

merged 1 commit into from
Jun 5, 2025

Conversation

Xaohs
Copy link
Contributor

@Xaohs Xaohs commented May 8, 2025

🚧 Still in construction

  • A multi select that allows the user to select multiple options of a select at once, providing a clean UI
  • Regular select should work exactly as before (still need to rigorously test)
  • Multi select should be accessible (still need to rigorously test)

&__pill {
display: inline-flex;
align-items: center;
padding: 0 0.5em; // TODO: spacing-h and spacing-v are too big for this. Add more tokens or hardcode?
Copy link
Collaborator

Choose a reason for hiding this comment

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

Hardcode is OK for now.

hidden={true}
aria-label="" // Intentionally left blank
multiple={multiple}
value={selectValue}
Copy link
Collaborator

Choose a reason for hiding this comment

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

If there are multiple values, is the resulting (fake) select spec wise equivalant to a native multiple select? What will the value/options look like?

Copy link
Collaborator

@svenvandescheur svenvandescheur left a comment

Choose a reason for hiding this comment

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

Looks like a nice start, todo:

  • Update the story sample data to be more sensible.
  • Add stories for the complete form flow.
  • Adjust to the latest design from @ZoeReijinga , note: theme colors differences may be ignored.
  • Add remove buttons to selected options.

@Xaohs Xaohs changed the title 🚧 - feat: multi-select initial setup 🚧 - feat: multi-select Jun 4, 2025
@Xaohs Xaohs changed the title 🚧 - feat: multi-select ✨ - feat: multi-select Jun 4, 2025
@Xaohs Xaohs requested a review from svenvandescheur June 4, 2025 17:20
@Xaohs Xaohs marked this pull request as ready for review June 4, 2025 17:20
@Xaohs Xaohs force-pushed the issue/multi-select branch from dc00ac0 to 6e15247 Compare June 5, 2025 11:45
@svenvandescheur svenvandescheur merged commit 50c11e2 into main Jun 5, 2025
5 of 7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants