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

feat(tab-nav): adds optional closable functionality to individual tab-titles #6740

Merged
merged 104 commits into from
May 22, 2023

Conversation

Elijbet
Copy link
Contributor

@Elijbet Elijbet commented Apr 6, 2023

Related Issue: #2620

Summary

handleTabTitleClose sequence is as follows:

if closed item is selected, fall back on the next
unless it's the last item, which falls back on previous
closing non-selected items doesn't affect the selected tab
last remaining item becomes disabled, if closable

  • Added closed property
  • Added closable property
  • Added calciteInternalTabsClose event
  • Added calciteTabsClose event
  • Added t9n messages for Close text.
  • Updated styling per new Figma specs
  • Added tests

handleTabTitleClose keeps track of visibleTabTitlesIndices instead of having Dom queries filter out hidden. This helps to sync tabs with tab-titles using their corresponding ids set on the original render. visibleTabIndeces is an array of ids of the non-hidden tab-titles. When tab-title is closed this id is used to navigate to the next visible item. This makes figuring out what the next item should be when closing out of order is now more straightforward.

Tests coverage for

  • simple closing behavior
  • closing sequence behavior:
  • when closing tab-titles in sequence 1 (first selected) through 4, tab-title and corresponding tab become hidden, and selection fallback is the next tab
  • reverse fallback: when closing tab-titles in sequence 4 (last selected) through 1, tab-title and corresponding tab become hidden, and selection fallback is the previous tab
  • closing an unselected tab-title does not deselect the current selection
  • 2 additional cases: works with a randomized closing sequence with mixed selected and not

@github-actions github-actions bot added the enhancement Issues tied to a new feature or request. label Apr 6, 2023
@github-actions github-actions bot added the Stale Issues or pull requests that have not had recent activity. label Apr 29, 2023
@Elijbet Elijbet removed the Stale Issues or pull requests that have not had recent activity. label May 2, 2023
@jcfranco jcfranco added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels May 20, 2023
@jcfranco jcfranco added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels May 20, 2023
@jcfranco jcfranco added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels May 20, 2023
@jcfranco jcfranco added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels May 20, 2023
Elijbet and others added 9 commits May 22, 2023 11:07
**Related Issue:** #N/A

## Summary
This PR will add t9n message bundles for  the following  components:

- calcite-card
- calcite-combobox
- calcite-handle (updates)
- calcite-input-date-picker
- calcite-input-time-picker
- calcite-input-time-zone
- calcite-list-item (updates)
- calcite-menu-item
- calcite-menu

---------

Co-authored-by: jona7150 <[email protected]>
**Related Issue:** n/a

## Summary
Adds in the latest Calcite UI icons, `3.22.6` for this week's `1.4.0`
release.
@Elijbet Elijbet added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels May 22, 2023
@Elijbet Elijbet merged commit d30792d into master May 22, 2023
@Elijbet Elijbet deleted the elijbet/2620-closable-tabs branch May 22, 2023 19:53
@github-actions github-actions bot added this to the 2023 May Priorities milestone May 22, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement Issues tied to a new feature or request. pr ready for visual snapshots Adding this label will run visual snapshot testing.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants