Skip to content
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

fix(core/group): group selected style and actions & header correction #470

Merged
merged 13 commits into from
Apr 14, 2023

Conversation

goncalosard
Copy link
Contributor

Pull request checklist

Please check if your PR fulfills the following requirements:

  • Tests for the changes have been added (for bug fixes / features)
  • Docs have been reviewed and added / updated if needed (for bug fixes / features)
  • Build (yarn build) was run locally and any changes were pushed
  • Unit tests (yarn test) were run locally and passed
  • Visual Regression Tests (yarn visual-regression) were run locally and passed
  • Linting (npm lint) was run locally and passed

Pull request type

Please check the type of change your PR introduces:

  • Bug fix
  • Feature
  • Refactoring (no functional changes, no API changes)
  • Build related changes
  • Documentation content changes
  • Other (please describe):

What is the current behavior?

Old style:

image

Selected style is not correct according to Figma.
When item is selected, then dropdown is closed and reopened, item no longer shows clicked.
When item is selected and the dropdown is closed, it puts header selected.
Also GitHub Issue Number: #416

What is the new behavior?

  • Added new style for selected header and item
  • Item still shows as selected after dropdown is closed and reopened
  • After selecting item and closing dropdown, header no longer goes as selected
  • When header is selected, it no longer moves content alignment

New style:

image

Does this introduce a breaking change?

  • Yes
  • No

Testing

Other information

@goncalosard goncalosard linked an issue Mar 28, 2023 that may be closed by this pull request
Copy link
Collaborator

@nuke-ellington nuke-ellington left a comment

Choose a reason for hiding this comment

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

  • Click on header shoud deselect group items
  • Focus border was lost (@silviowolf will update to latest design spec)

@danielleroux danielleroux added the pull request affects patch version The pull request affects only patch version label Mar 30, 2023
@goncalosard
Copy link
Contributor Author

goncalosard commented Mar 30, 2023

@danielleroux @nuke-ellington
Latest commit has the following changes:

  • When header is selected, items are deselected.
  • Focus-visible fix
  • When there is no items, icon arrow is hidden. (MutationObserver added in case the user removes all items or it has no items and the user adds a item. The component needs to know if the lenght of items from the slot changed so it can update the hide or show of the icon if the slot size changed) (Empty Group component should not be expandable #330).

packages/core/src/components/group/group.scss Outdated Show resolved Hide resolved
packages/core/src/components/group/group.scss Outdated Show resolved Hide resolved
@danielleroux danielleroux added this to the 1.5.0 milestone Apr 12, 2023
Copy link
Collaborator

@nuke-ellington nuke-ellington left a comment

Choose a reason for hiding this comment

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

lgtm

@danielleroux danielleroux merged commit 21eead6 into main Apr 14, 2023
@danielleroux danielleroux deleted the fix/group-header-alignment branch April 14, 2023 05:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
pull request affects patch version The pull request affects only patch version
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Group header selection alignment
3 participants