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(tabs)!: tabscontroller refactor #2699

Merged
merged 17 commits into from
Mar 6, 2024
Merged

Conversation

bennypowers
Copy link
Member

@bennypowers bennypowers commented Mar 3, 2024

Closes #2695

What I did

Total separation between RTIC and tabs state. Disabled tabs are still able to be focused via RTIC, just that they can't change the Tab's active tab state.

Remove most of tabscontroller's logic in favour of context, rtic.

  • Rename TabsController > TabsAriaController. It still has some helper functions. WDYT, @zeroedin?
  • PfTabs(host) - context for active index, cascading stuff like variant, box etc
  • PfTab(host) - updates own template accd to context. to avoid breaking css selectors, maybe reflect those context props for now. at least investigate it before removing the attrs on the host.

Testing Instructions

  1. units, usability testing

let tabscontroller handle the aria stuff only, for the most part.
Total separation between RTIC and tabs state.
Disabled tabs are still able to be focused via RTIC,
just that they can't change the Tab's active tab state.
Use context instead of cascade
Use shadow classes instead of reflected attrs (but keep the attrs for now to avoid breaking changes)
@bennypowers bennypowers requested review from zeroedin and nikkimk March 3, 2024 13:01
Copy link

changeset-bot bot commented Mar 3, 2024

🦋 Changeset detected

Latest commit: 0d19f99

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions github-actions bot added demo Updating demo pages functionality Functionality, typically pertaining to the JavaScript. styles An issue or PR pertaining only to CSS/Sass tests Related to testing tools Development and build tools labels Mar 3, 2024
Copy link

netlify bot commented Mar 3, 2024

Deploy Preview for patternfly-elements ready!

Name Link
🔨 Latest commit d9bcbb8
😎 Deploy Preview https://deploy-preview-2699--patternfly-elements.netlify.app/

To edit notification comments on pull requests, go to your Netlify site settings.

@github-actions github-actions bot added the AT passed Automated testing has passed label Mar 3, 2024
elements/pf-tabs/pf-tab.ts Outdated Show resolved Hide resolved
@zeroedin
Copy link
Collaborator

zeroedin commented Mar 4, 2024

Should we now say that if <pf-tab aria-disabled="true"> is set that this has the same function as <pf-tab disabled> and update the component accordingly? /cc @nikkimk

Right now the component becomes selectable.

@bennypowers
Copy link
Member Author

The idea is that users should not set aria attrs on any tab elements. They should only and always use disabled when they need that feature

@github-actions github-actions bot added the doc label Mar 5, 2024
@bennypowers bennypowers requested a review from zeroedin March 5, 2024 11:21
@bennypowers bennypowers enabled auto-merge (squash) March 5, 2024 13:02
Copy link
Collaborator

@zeroedin zeroedin left a comment

Choose a reason for hiding this comment

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

Given resolution of last remaining open comment

Lifted Granite Tall Mountains

@bennypowers bennypowers merged commit d4e5411 into main Mar 6, 2024
17 of 18 checks passed
@bennypowers bennypowers deleted the fix/tabs/controller-refactor branch March 6, 2024 08:17
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
AT passed Automated testing has passed demo Updating demo pages doc functionality Functionality, typically pertaining to the JavaScript. styles An issue or PR pertaining only to CSS/Sass tests Related to testing tools Development and build tools
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

TabsController should not make assumptions about host's DOM
3 participants