fix(Card): indicate card selectivity and status if using a screen reader #7144

wise-king-sullyman · 2022-03-29T17:44:17Z

What: Closes #6798

Additional issues:
See PR #7091 for the previous attempt to resolve this issue and the issues identified with that approach.

This draft PR demonstrates a potential approach to improving Card accessibility by including hidden inputs for the purpose of screen reader navigation, this approach is similar to the one used for our switch component.

I believe this approach has been done in such a way that it is opt-in only and doesn't require a breaking change. The new structure is only rendered when a 'hasHiddenInput' prop is passed.

Currently, the checkboxes are all positioned at the top left corner of the page and there is no visual indication that the actual card is focused when its associated checkbox is focused. If this is identified as the best path forward for this issue I will create a core issue for those changes.

Convenience links:
Card/selectable
Card/legacy selectable
Card view demo
Tabs/modal tabs demo
Primary-detail card view demo

patternfly-build · 2022-03-29T19:00:23Z

Preview: https://patternfly-react-pr-7144.surge.sh

A11y report: https://patternfly-react-pr-7144-a11y.surge.sh

thatblindgeye · 2022-03-30T13:06:35Z

So I think the result is comparable to the current implementation introduced in your original PR, with the added pro of being able to navigate to those inner interactive elements in the card view demo via VO. Overall I think this could be a really good alternative to using a listbox and option roles.

Some comments/things I'd like others' input on if this is the route we decide to go down:

To get more of the same result as the original PR, at least for the demos/examples, we could wrap the set of cards in a <section> element with an aria-label to mimic VO announcing the listbo before the first option as it does in the Card view demo from your other PR.
If possible it may be worth removing that visible checkbox from the cards in the Card view demo, but that could be a separate discussion to hash out after this issue is resolved. Mainly I'm not sure about having a visible and hidden checkbox that would both get announced to assistive technologies.
The Tabs/modal I'm not sure would need the selectable Card variant

wise-king-sullyman · 2022-03-30T21:57:38Z

@thatblindgeye

To get more of the same result as the original PR, at least for the demos/examples, we could wrap the set of cards in a <section> element with an aria-label to mimic VO announcing the listbo before the first option as it does in the Card view demo from your other PR.

Yeah I feel like that would be a really good change, at least for the demos. Probably not really needed on the examples I don't think, but if you disagree with that I'm open to discussing it.

If possible it may be worth removing that visible checkbox from the cards in the Card view demo, but that could be a separate discussion to hash out after this issue is resolved. Mainly I'm not sure about having a visible and hidden checkbox that would both get announced to assistive technologies.

Agree, having two checkboxes doesn't feel like optimal UX to me either. I defer to people with more knowledge than I have on this topic though.

The Tabs/modal I'm not sure would need the selectable Card variant

Agree again, since the cards are never really selected this feels like an odd use of a selectable card. I don't think changing it would be in scope of this issue, but I could totally see us leaving it alone for now.

seanforyou23

Nice work @wise-king-sullyman! The hidden inputs can work, but they might be a bit heavy handed in terms of implementation cost (requiring core changes) - I think some of the existing plumbing may be sufficient to pull this off and maybe we just need a nice and realistic demo/example to showcase.. I'll throw some ideas out.

Curious what you and others think about these two implementations, I'll mention the highlights of each - happy to demo it for anyone that wants

~~1) Actual switch semantics strategy. This communicates on/off states and is easy to implement. Probably makes sense if selecting the card actually toggles something on/off (like a light, or a server), but probably less useful if it's just a selection action that's needed. The AX is straight forward, and not customizable.

https://selectable-cards-a11y-demo.surge.sh/switch-role-semantics~~

Region role semantics. This has the flexibility of being able to customize exactly what the label says, but on its own you lose the built in announcement effect that comes with changes to state in other native roles. This can easily added back, optionally, via a live region.

https://selectable-cards-a11y-demo.surge.sh/region-role-semantics

I think either of these approaches could work great, really just depends on what's actually supposed to happen when users select the card. I think most of the time it's just gonna be "context setting" which fits the second scenario better. I bet if we can think up a good use case for each, it would end up being a really nice showcase both approaches so people can see the impacts of doing it one way vs another. If you have a list of servers, and one strategy communicates them to be on/off vs selected/unselected - it's a very big difference in perception!

Hope it makes sense, lemme know what you think :)

edit: first method doesn't cut it - throws axe errors

nicolethoen · 2022-04-06T14:09:53Z

@seanforyou23 these are compelling ideas we had not considered yet. I'm not sure if they buy us more than we already have?

Actual switch semantics strategy. This communicates on/off states and is easy to implement. Probably makes sense if selecting the card actually toggles something on/off (like a light, or a server), but probably less useful if it's just a selection action that's needed. The AX is straight forward, and not customizable.

This first example is slick to use the switch, I do like what the screen reader communicates, but I cannot get into the kabob in the first card because of the nested focusable element. The in-browser axe test is also throwing a serious level warning about it... so it's still not quite right...

2. Generic role semantics. This has the flexibility of being able to customize exactly what the label says, but on its own you lose the built in announcement effect that comes with changes to state in other native roles.

This second suggestion seems less than ideal because the screen reader does not say anything when I first put focus on a selectable card about it being selectable or interactable - it only tells me I am on a group. Also, relying on aria-labels to communicate everything about the state and features of an element seems like something most product devs will have a very hard time doing.

@wise-king-sullyman I think the hidden input is pretty powerful. I'll note for @mcoker and @mcarrano in case it's interesting, that the checkbox on the selectable cards in the carbon selectable card variant is not a real checkbox. It's a non-interactable svg that just looks like a checkbox to reflect the selected state of the card. Clicking on the checkbox does the same as clicking anywhere else in the card.

The major limitation I see to carbon's component is that they do not allow for interactable controls in the card as we often have in patternfly - such as an action dropdown. Using Austin's hidden input solution does allow for the other interactable elements in the card. But it may be worth sharing a slight concern that we are diverging from industry standards a bit it seems by allowing the whole card to be selectable while also including interactable elements within the card...

seanforyou23 · 2022-04-06T14:46:15Z

Thx @nicolethoen - I will see if those issues are fixable, what I sent was quick implementation for viability.. lemme see if I can take it a little further in case it helps :)

seanforyou23 · 2022-04-06T18:31:20Z

Ok pushed some updates, good recommendations - that definitely cleared things up a bit.

Region ends up being an even better role for the card container in case of selectability. These cards are exposed in both Form Controls and landmark rotor menus.

cannot get into the kabob in the first card because of the nested focusable element

I think it's accessible, but the current selectable card implementation seems to have an issue, can we open a dedicated issue for that? If the fix for that will impact markup for card, maybe we consider those changes before deciding anything final on how we can name in, in case a better/easier approach opens up.

I fixed all the axe issues except the one you mentioned about nested interactive element, yea I guess that's pretty much a deal breaker for the switch role approach - I'll remove that from the demo and edit my comment above so it's clear that approach doesn't cut it. Hope it helps, lemme know what you think or if there's anything else I can do.

thatblindgeye

With the latest updates, I think this feels like it's getting closer to the goal. Some thoughts while testing the links in the first comment on this PR:

I like the container for the cards in the Card view demo announcing that the container is for a group of cards. I think this would be worth implementing on other examples/demos for cards, though not strictly related to this issue.
For the single selectable card examples (Card/selectable and Card/legacy-selectable), a radio input might work better than a checkbox
When navigating via VO, I am noticing that when VO places focus on the input for a card, it causes the card content to shift a bit, then when focus is placed on the article element that makes up the card, the content shifts back to its normal position (video below). This could be something that gets fixed with the core issue you mentioned opening since this is using that temporary CSS.
For the Tabs and Primary detail card demos, I'm still unsure if these ones would benefit from having the input added onto them. The Tabs demo I'm mainly unsure if a user would actually have any way of knowing that the tab they clicked was "checked" or not, since the modal should prevent them from navigating to anything outside the modal. For the Primary detail demo I think it may just more depend on whether the intent is for users to be able to access other content on the page even when a cards' detail is expanded.

Video for the third bullet point:

Selectable.Card.VO.Focus.mov

wise-king-sullyman · 2022-05-04T20:58:07Z

@thatblindgeye to update this PR based on our conversations from slack:

I like the container for the cards in the Card view demo announcing that the container is for a group of cards. I think this would be worth implementing on other examples/demos for cards, though not strictly related to this issue.

I don't think we currently apply aria labels to the example containers from what I've seen looking for examples of that, but if I'm wrong I'd be more than update to address this.

For the single selectable card examples (Card/selectable and Card/legacy-selectable), a radio input might work better than a checkbox

I agree, but I think adding the ability to have the input type be customizable would take a lot of thought and would be better done under a separate issue. If nobody opposes I'll spin up a new issue for that.

When navigating via VO, I am noticing that when VO places focus on the input for a card, it causes the card content to shift a bit, then when focus is placed on the article element that makes up the card, the content shifts back to its normal position (video below). This could be something that gets fixed with the core issue you mentioned opening since this is using that temporary CSS.

I think this was just because of the temporary demo styling, it shouldn't happen now that I've removed that styling. If it is still happening please let me know as that means I misunderstood the issue.

For the Tabs and Primary detail card demos, I'm still unsure if these ones would benefit from having the input added onto them. The Tabs demo I'm mainly unsure if a user would actually have any way of knowing that the tab they clicked was "checked" or not, since the modal should prevent them from navigating to anything outside the modal. For the Primary detail demo I think it may just more depend on whether the intent is for users to be able to access other content on the page even when a cards' detail is expanded.

I agree. But I also don't love the idea of leaving those cards as selectable but not applying the hidden input to them. I think that those demos really need a major rethink from an a11y perspective.

thatblindgeye

Agreed on your responses above. Specifically:

Adding aria-label to card containers (or creating a card container component? this route may be advantageous in regards to the whole single selectable vs multi selectable card thing) could definitely be a separate discussion and/or issue
Figuring out a radio vs checkbox implementation I'd agree can also be a separate issue and may be able to be lumped in with the above bullet point

Otherwise I do think this is definitely an improvement overall! A separate Core issue to resolve styling when the card's input receives focus will definitely be needed, and I am noticing in the Card view demo that clicking a card's kebab toggle selects the card (as you pointed out this occurs in the current implementation as well). I'm not willing to really block over those things, though.

Awesome job on all of this, by the way 💪🏼

thatblindgeye · 2022-05-05T16:08:57Z

packages/react-core/src/components/Card/Card.tsx

+  /** Flag indicating that the card should render a hidden input for a11y reasons */
+  hasHiddenInput?: boolean;
+  /** Aria label to apply to the hidden input if one is rendered */
+  hiddenInputAriaLabel?: string;
+  /** Callback that executes when the hidden input is changed */
+  onHiddenInputChange?: (labelledBy: string, event: React.FormEvent<HTMLInputElement>) => void;


Only other nit at this point might be the prop names/descriptions. For now maybe tweaking the hasHiddenInput prop description to, "Flag indicating that the card should render a hidden input to make it selectable" ? Any further change may depend on further implementation of selectable cards/may be better for a breaking change release.

I'm also not in love with the prop names at all, if you have any suggestions for better ones please let them fly.

And I like your prop description suggestion, I'll incorporate that.

Also I really like the idea of a potential card container component, and I think that could improve a11y a lot while being easy for consumers to implement.

It's a bit tougher since there's already the isSelectable and isSelectableRaised props, which if anything maybe those could be used to determine whether the hidden input is rendered with some tweaking of those prop descriptions. If those are strictly meant to determine the styling only, though, maybe selectableInput or hasSelectableInput?

selectableInputAriaLabel and onSelectableInputChange might also work.

I do think we should have isSelectable automatically render the hidden input, but I don't think we can make that happen until the next breaking change. Changing hiddenInput -> selectableInput sounds good to me though!

jessiehuff

I had the same concerns as Eric, especially because I can imagine products not understanding what hasHiddenInput means and thinking it doesn't apply to them. I really like the prop suggestions though!

In testing it sounds awesome. 😎

wise-king-sullyman · 2022-05-05T19:37:46Z

Realized that I didn't add tests for this new functionality, I've addressed that now.

tlabaj

I understand the difficulty with naming the props here. I however think that it is not intuitive. We may at least need some text to explain the example and highlight the intention of the props.

wise-king-sullyman · 2022-05-06T18:38:25Z

@tlabaj do you think that this explanation text would be best:

added to the selectable card example
added to a new example specifically for demonstrating this
added to the a11y tab for card or
added to the code directly using comments

tlabaj · 2022-05-06T19:24:29Z

@tlabaj do you think that this explanation text would be best:

added to the selectable card example

added to a new example specifically for demonstrating this

added to the a11y tab for card or

added to the code directly using comments

Option 2.

wise-king-sullyman · 2022-05-06T21:00:33Z

@tlabaj I've added an example to try and better explain things. Please let me know your thoughts, I'm happy to change it significantly if needed 🙂

nicolethoen

awesome work with all this, @wise-king-sullyman!!!!

tlabaj · 2022-05-09T18:52:34Z

packages/react-core/src/components/Card/examples/Card.md


+### Selectable accessibility highlight
+
+This example demonstrates how the `hasSelectableInput` and `onSelectableInputChange` props enable improved accessibility for selectable cards.


@wolfeallison can you please review the copy here from lines 76-86.

I think we could say "props improves accessibility for selectable cards." in line 76 and take out the "enable improved"

For line 78, I had a little trouble understanding what it was saying the first time and would switch the last sentence to " This input communicates to assistive technology users that a card is selectable, and if so, lists the current selection state." Not sure if "lists" is the right verb here or how the selection state is presented

For line 80, add a comma after "If you don't use the card title component in your selectable card,"

@wolfeallison for line 78, thoughts on: "This input communicates to assistive technology users that a card is selectable, and if so, it communicates the current selection state as well."?

@wise-king-sullyman I like that!

seanforyou23

hasSelectableInput prop name ties it all together for me, very intuitive :)

Nice work @wise-king-sullyman!

jessiehuff

LGTM! Great job on all the work on this!

mcarrano

Looks great @wise-king-sullyman ! I think that in the future we should revisit the interaction in the card view as selectable cards with checkboxes feels redundant, but I can open a separate issue for that. Looks like it was that was before this PR.

patternfly-build · 2022-05-10T17:26:51Z

Your changes have been released in:

eslint-plugin-patternfly-react@4.52.3
@patternfly/react-catalog-view-extension@4.64.3
@patternfly/react-charts@6.66.3
@patternfly/react-code-editor@4.54.3
@patternfly/react-console@4.64.3
@patternfly/react-core@4.213.3
@patternfly/react-docs@5.74.3
@patternfly/react-icons@4.64.3
@patternfly/react-inline-edit-extension@4.58.3
demo-app-ts@4.173.3
@patternfly/react-integration@4.175.3
@patternfly/react-log-viewer@4.58.3
@patternfly/react-styles@4.63.3
@patternfly/react-table@4.82.3
@patternfly/react-tokens@4.65.3
@patternfly/react-topology@4.60.3
@patternfly/react-virtualized-extension@4.60.3
transformer-cjs-imports@4.51.3

Thanks for your contribution! 🎉

chore(deps): update dependency theme-patternfly-org to v0.11.31 (patternfly#7265) Co-authored-by: Renovate Bot <bot@renovateapp.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.45.5 - @patternfly/react-catalog-view-extension@4.57.5 - @patternfly/react-charts@6.59.5 - @patternfly/react-code-editor@4.47.5 - @patternfly/react-console@4.57.5 - @patternfly/react-core@4.206.5 - @patternfly/react-docs@5.67.5 - @patternfly/react-icons@4.57.5 - @patternfly/react-inline-edit-extension@4.51.5 - demo-app-ts@4.166.5 - @patternfly/react-integration@4.168.5 - @patternfly/react-log-viewer@4.51.5 - @patternfly/react-styles@4.56.5 - @patternfly/react-table@4.75.5 - @patternfly/react-tokens@4.58.5 - @patternfly/react-topology@4.53.5 - @patternfly/react-virtualized-extension@4.53.5 - transformer-cjs-imports@4.44.5 Catalog extension: Add a little bit spacing between title and items (patternfly#7060) * Run sass build and copy commands in row * Add spacing between catalog title and items chore: Add setup to always include jest-dom extended matchers, cleanup (patternfly#7240) * chore: Add setup to always include jest-dom extended matchers, cleanup * rename DropdownToggle 'describe' title, remove unnecessary data-testid's remove unused imports and functions (patternfly#7279) chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.45.6 - @patternfly/react-catalog-view-extension@4.57.6 - @patternfly/react-charts@6.59.6 - @patternfly/react-code-editor@4.47.6 - @patternfly/react-console@4.57.6 - @patternfly/react-core@4.206.6 - @patternfly/react-docs@5.67.6 - @patternfly/react-icons@4.57.6 - @patternfly/react-inline-edit-extension@4.51.6 - demo-app-ts@4.166.6 - @patternfly/react-integration@4.168.6 - @patternfly/react-log-viewer@4.51.6 - @patternfly/react-styles@4.56.6 - @patternfly/react-table@4.75.6 - @patternfly/react-tokens@4.58.6 - @patternfly/react-topology@4.53.6 - @patternfly/react-virtualized-extension@4.53.6 - transformer-cjs-imports@4.44.6 chore(DateTimePicker): convert demo to typescript (patternfly#7268) feat(CodeBlock): add class to code component (patternfly#7281) chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.46.0 - @patternfly/react-catalog-view-extension@4.58.0 - @patternfly/react-charts@6.60.0 - @patternfly/react-code-editor@4.48.0 - @patternfly/react-console@4.58.0 - @patternfly/react-core@4.207.0 - @patternfly/react-docs@5.68.0 - @patternfly/react-icons@4.58.0 - @patternfly/react-inline-edit-extension@4.52.0 - demo-app-ts@4.167.0 - @patternfly/react-integration@4.169.0 - @patternfly/react-log-viewer@4.52.0 - @patternfly/react-styles@4.57.0 - @patternfly/react-table@4.76.0 - @patternfly/react-tokens@4.59.0 - @patternfly/react-topology@4.54.0 - @patternfly/react-virtualized-extension@4.54.0 - transformer-cjs-imports@4.45.0 chore(deps): update dependency @patternfly/patternfly to v4.192.2 (patternfly#7324) Co-authored-by: Renovate Bot <bot@renovateapp.com> chore(deps): update dependency theme-patternfly-org to v0.11.32 (patternfly#7306) Co-authored-by: Renovate Bot <bot@renovateapp.com> Fix error when a group has no visible children (patternfly#7304) Also small fix for flickering cursor on edge drag. chore(deps): update dependency theme-patternfly-org to v0.11.33 (patternfly#7326) Co-authored-by: Renovate Bot <bot@renovateapp.com> update paths chore(deps): update dependency @patternfly/patternfly to v4.192.4 (patternfly#7327) Co-authored-by: Renovate Bot <bot@renovateapp.com> chore(deps): update dependency theme-patternfly-org to v0.11.34 (patternfly#7336) Co-authored-by: Renovate Bot <bot@renovateapp.com> chore(Page): update centered example to match Core (patternfly#7269) feat(divider): add support for switching orientation at various breakpoints (patternfly#7285) * add support for switching orientation at various breakpoints * deprecate isVertical, update demos and prop descriptions * PR feedback from mcoker * PR feedback from mcoker chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.0 - @patternfly/react-catalog-view-extension@4.59.0 - @patternfly/react-charts@6.61.0 - @patternfly/react-code-editor@4.49.0 - @patternfly/react-console@4.59.0 - @patternfly/react-core@4.208.0 - @patternfly/react-docs@5.69.0 - @patternfly/react-icons@4.59.0 - @patternfly/react-inline-edit-extension@4.53.0 - demo-app-ts@4.168.0 - @patternfly/react-integration@4.170.0 - @patternfly/react-log-viewer@4.53.0 - @patternfly/react-styles@4.58.0 - @patternfly/react-table@4.77.0 - @patternfly/react-tokens@4.60.0 - @patternfly/react-topology@4.55.0 - @patternfly/react-virtualized-extension@4.55.0 - transformer-cjs-imports@4.46.0 Topology dark theme (patternfly#7294) * feature(topology): style dark theme * feature(topology): node and label colors all states * feature(topology): groups * feature(topology): rebase * feature(topology): before scrubthrough * feature(topology): replace empty selector * feature(topology): remove extra stroke-width * Add labelIcon setting to topology demo * feature(topology): fix node label icon color * feature(topology): fix selected state labels Co-authored-by: Jeffrey Phillips <jephilli@redhat.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.1 - @patternfly/react-catalog-view-extension@4.59.1 - @patternfly/react-charts@6.61.1 - @patternfly/react-code-editor@4.49.1 - @patternfly/react-console@4.59.1 - @patternfly/react-core@4.208.1 - @patternfly/react-docs@5.69.1 - @patternfly/react-icons@4.59.1 - @patternfly/react-inline-edit-extension@4.53.1 - demo-app-ts@4.168.1 - @patternfly/react-integration@4.170.1 - @patternfly/react-log-viewer@4.53.1 - @patternfly/react-styles@4.58.1 - @patternfly/react-table@4.77.1 - @patternfly/react-tokens@4.60.1 - @patternfly/react-topology@4.55.1 - @patternfly/react-virtualized-extension@4.55.1 - transformer-cjs-imports@4.46.1 chore(DragAndDrop): convert examples to TS (patternfly#7244) * convert DnD to TS * make param required * PR feedback from Titani * remove extra space chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.2 - @patternfly/react-catalog-view-extension@4.59.2 - @patternfly/react-charts@6.61.2 - @patternfly/react-code-editor@4.49.2 - @patternfly/react-console@4.59.2 - @patternfly/react-core@4.208.2 - @patternfly/react-docs@5.69.2 - @patternfly/react-icons@4.59.2 - @patternfly/react-inline-edit-extension@4.53.2 - demo-app-ts@4.168.2 - @patternfly/react-integration@4.170.2 - @patternfly/react-log-viewer@4.53.2 - @patternfly/react-styles@4.58.2 - @patternfly/react-table@4.77.2 - @patternfly/react-tokens@4.60.2 - @patternfly/react-topology@4.55.2 - @patternfly/react-virtualized-extension@4.55.2 - transformer-cjs-imports@4.46.2 docs(Wizard): Added WizardStep interface to documentation (patternfly#7299) Co-authored-by: Titani <tlabaj@redaht.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.3 - @patternfly/react-catalog-view-extension@4.59.3 - @patternfly/react-charts@6.61.3 - @patternfly/react-code-editor@4.49.3 - @patternfly/react-console@4.59.3 - @patternfly/react-core@4.208.3 - @patternfly/react-docs@5.69.3 - @patternfly/react-icons@4.59.3 - @patternfly/react-inline-edit-extension@4.53.3 - demo-app-ts@4.168.3 - @patternfly/react-integration@4.170.3 - @patternfly/react-log-viewer@4.53.3 - @patternfly/react-styles@4.58.3 - @patternfly/react-table@4.77.3 - @patternfly/react-tokens@4.60.3 - @patternfly/react-topology@4.55.3 - @patternfly/react-virtualized-extension@4.55.3 - transformer-cjs-imports@4.46.3 chore(docs):cleanup dead link (patternfly#7270) * chore(docs):cleanup dead link * hardcode path Co-authored-by: Titani <tlabaj@redaht.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.4 - @patternfly/react-catalog-view-extension@4.59.4 - @patternfly/react-charts@6.61.4 - @patternfly/react-code-editor@4.49.4 - @patternfly/react-console@4.59.4 - @patternfly/react-core@4.208.4 - @patternfly/react-docs@5.69.4 - @patternfly/react-icons@4.59.4 - @patternfly/react-inline-edit-extension@4.53.4 - demo-app-ts@4.168.4 - @patternfly/react-integration@4.170.4 - @patternfly/react-log-viewer@4.53.4 - @patternfly/react-styles@4.58.4 - @patternfly/react-table@4.77.4 - @patternfly/react-tokens@4.60.4 - @patternfly/react-topology@4.55.4 - @patternfly/react-virtualized-extension@4.55.4 - transformer-cjs-imports@4.46.4 fix(Tabs): update key to not use index (patternfly#7276) chore(ClipboardCopy): update types used for tooltip positioning (patternfly#7295) chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.5 - @patternfly/react-catalog-view-extension@4.59.5 - @patternfly/react-charts@6.61.5 - @patternfly/react-code-editor@4.49.5 - @patternfly/react-console@4.59.5 - @patternfly/react-core@4.208.5 - @patternfly/react-docs@5.69.5 - @patternfly/react-icons@4.59.5 - @patternfly/react-inline-edit-extension@4.53.5 - demo-app-ts@4.168.5 - @patternfly/react-integration@4.170.5 - @patternfly/react-log-viewer@4.53.5 - @patternfly/react-styles@4.58.5 - @patternfly/react-table@4.77.5 - @patternfly/react-tokens@4.60.5 - @patternfly/react-topology@4.55.5 - @patternfly/react-virtualized-extension@4.55.5 - transformer-cjs-imports@4.46.5 Feat(Table): Adds full screen demo for basic/bulk select (patternfly#7264) * full screen demo for bulk-select example * format chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.6 - @patternfly/react-catalog-view-extension@4.59.6 - @patternfly/react-charts@6.61.6 - @patternfly/react-code-editor@4.49.6 - @patternfly/react-console@4.59.6 - @patternfly/react-core@4.208.6 - @patternfly/react-docs@5.69.6 - @patternfly/react-icons@4.59.6 - @patternfly/react-inline-edit-extension@4.53.6 - demo-app-ts@4.168.6 - @patternfly/react-integration@4.170.6 - @patternfly/react-log-viewer@4.53.6 - @patternfly/react-styles@4.58.6 - @patternfly/react-table@4.77.6 - @patternfly/react-tokens@4.60.6 - @patternfly/react-topology@4.55.6 - @patternfly/react-virtualized-extension@4.55.6 - transformer-cjs-imports@4.46.6 Add ColaGroupsLayout (patternfly#7308) chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.7 - @patternfly/react-catalog-view-extension@4.59.7 - @patternfly/react-charts@6.61.7 - @patternfly/react-code-editor@4.49.7 - @patternfly/react-console@4.59.7 - @patternfly/react-core@4.208.7 - @patternfly/react-docs@5.69.7 - @patternfly/react-icons@4.59.7 - @patternfly/react-inline-edit-extension@4.53.7 - demo-app-ts@4.168.7 - @patternfly/react-integration@4.170.7 - @patternfly/react-log-viewer@4.53.7 - @patternfly/react-styles@4.58.7 - @patternfly/react-table@4.77.7 - @patternfly/react-tokens@4.60.7 - @patternfly/react-topology@4.55.7 - @patternfly/react-virtualized-extension@4.55.7 - transformer-cjs-imports@4.46.7 chore(deps): update dependency @patternfly/patternfly to v4.192.6 (patternfly#7352) Co-authored-by: Renovate Bot <bot@renovateapp.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.8 - @patternfly/react-catalog-view-extension@4.59.8 - @patternfly/react-charts@6.61.8 - @patternfly/react-code-editor@4.49.8 - @patternfly/react-console@4.59.8 - @patternfly/react-core@4.208.8 - @patternfly/react-docs@5.69.8 - @patternfly/react-icons@4.59.8 - @patternfly/react-inline-edit-extension@4.53.8 - demo-app-ts@4.168.8 - @patternfly/react-integration@4.170.8 - @patternfly/react-log-viewer@4.53.8 - @patternfly/react-styles@4.58.8 - @patternfly/react-table@4.77.8 - @patternfly/react-tokens@4.60.8 - @patternfly/react-topology@4.55.8 - @patternfly/react-virtualized-extension@4.55.8 - transformer-cjs-imports@4.46.8 Add correct types for class components using context API (patternfly#7282) chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.9 - @patternfly/react-catalog-view-extension@4.59.9 - @patternfly/react-charts@6.61.9 - @patternfly/react-code-editor@4.49.9 - @patternfly/react-console@4.59.9 - @patternfly/react-core@4.208.9 - @patternfly/react-docs@5.69.9 - @patternfly/react-icons@4.59.9 - @patternfly/react-inline-edit-extension@4.53.9 - demo-app-ts@4.168.9 - @patternfly/react-integration@4.170.9 - @patternfly/react-log-viewer@4.53.9 - @patternfly/react-styles@4.58.9 - @patternfly/react-table@4.77.9 - @patternfly/react-tokens@4.60.9 - @patternfly/react-topology@4.55.9 - @patternfly/react-virtualized-extension@4.55.9 - transformer-cjs-imports@4.46.9 fix(charts): Add style for tooltip cursor (patternfly#7361) chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.10 - @patternfly/react-catalog-view-extension@4.59.10 - @patternfly/react-charts@6.61.10 - @patternfly/react-code-editor@4.49.10 - @patternfly/react-console@4.59.10 - @patternfly/react-core@4.208.10 - @patternfly/react-docs@5.69.10 - @patternfly/react-icons@4.59.10 - @patternfly/react-inline-edit-extension@4.53.10 - demo-app-ts@4.168.10 - @patternfly/react-integration@4.170.10 - @patternfly/react-log-viewer@4.53.10 - @patternfly/react-styles@4.58.10 - @patternfly/react-table@4.77.10 - @patternfly/react-tokens@4.60.10 - @patternfly/react-topology@4.55.10 - @patternfly/react-virtualized-extension@4.55.10 - transformer-cjs-imports@4.46.10 chore(AlertGroup): convert examples to TypeScript/functional components (patternfly#7273) chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.11 - @patternfly/react-catalog-view-extension@4.59.11 - @patternfly/react-charts@6.61.11 - @patternfly/react-code-editor@4.49.11 - @patternfly/react-console@4.59.11 - @patternfly/react-core@4.208.11 - @patternfly/react-docs@5.69.11 - @patternfly/react-icons@4.59.11 - @patternfly/react-inline-edit-extension@4.53.11 - demo-app-ts@4.168.11 - @patternfly/react-integration@4.170.11 - @patternfly/react-log-viewer@4.53.11 - @patternfly/react-styles@4.58.11 - @patternfly/react-table@4.77.11 - @patternfly/react-tokens@4.60.11 - @patternfly/react-topology@4.55.11 - @patternfly/react-virtualized-extension@4.55.11 - transformer-cjs-imports@4.46.11 chore(deps): update dependency @patternfly/patternfly to v4.193.0 (patternfly#7362) Co-authored-by: Renovate Bot <bot@renovateapp.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.12 - @patternfly/react-catalog-view-extension@4.59.12 - @patternfly/react-charts@6.61.12 - @patternfly/react-code-editor@4.49.12 - @patternfly/react-console@4.59.12 - @patternfly/react-core@4.208.12 - @patternfly/react-docs@5.69.12 - @patternfly/react-icons@4.59.12 - @patternfly/react-inline-edit-extension@4.53.12 - demo-app-ts@4.168.12 - @patternfly/react-integration@4.170.12 - @patternfly/react-log-viewer@4.53.12 - @patternfly/react-styles@4.58.12 - @patternfly/react-table@4.77.12 - @patternfly/react-tokens@4.60.12 - @patternfly/react-topology@4.55.12 - @patternfly/react-virtualized-extension@4.55.12 - transformer-cjs-imports@4.46.12 feat(tabs): add secondary border-bottom variation, update demos (patternfly#7311) * feat(tabs): add secondary border-bottom variation, update demos * improve prop description Co-authored-by: Jenny <32821331+jenny-s51@users.noreply.github.com> * sentence case test aria labels Co-authored-by: Jenny <32821331+jenny-s51@users.noreply.github.com> fix(Wixard): Fixed id not being applied to wizard step (patternfly#7349) * fix(Wixard): Fixed id not being applied to wizard step * add id to tests Co-authored-by: Titani <tlabaj@redaht.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.47.13 - @patternfly/react-catalog-view-extension@4.59.13 - @patternfly/react-charts@6.61.13 - @patternfly/react-code-editor@4.49.13 - @patternfly/react-console@4.59.13 - @patternfly/react-core@4.208.13 - @patternfly/react-docs@5.69.13 - @patternfly/react-icons@4.59.13 - @patternfly/react-inline-edit-extension@4.53.13 - demo-app-ts@4.168.13 - @patternfly/react-integration@4.170.13 - @patternfly/react-log-viewer@4.53.13 - @patternfly/react-styles@4.58.13 - @patternfly/react-table@4.77.13 - @patternfly/react-tokens@4.60.13 - @patternfly/react-topology@4.55.13 - @patternfly/react-virtualized-extension@4.55.13 - transformer-cjs-imports@4.46.13 Add missing 'children' prop in several places (patternfly#7363) fix(ClipboardCopy): dynamic tooltip updates get announced (patternfly#7335) feat(drawer): convert examples to TS (patternfly#7329) * wip drawer demos * convert drawer examples to TS * PR feedback from Eric chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.48.0 - @patternfly/react-catalog-view-extension@4.60.0 - @patternfly/react-charts@6.62.0 - @patternfly/react-code-editor@4.50.0 - @patternfly/react-console@4.60.0 - @patternfly/react-core@4.209.0 - @patternfly/react-docs@5.70.0 - @patternfly/react-icons@4.60.0 - @patternfly/react-inline-edit-extension@4.54.0 - demo-app-ts@4.169.0 - @patternfly/react-integration@4.171.0 - @patternfly/react-log-viewer@4.54.0 - @patternfly/react-styles@4.59.0 - @patternfly/react-table@4.78.0 - @patternfly/react-tokens@4.61.0 - @patternfly/react-topology@4.56.0 - @patternfly/react-virtualized-extension@4.56.0 - transformer-cjs-imports@4.47.0 feat(charts): Deprecate themeVariant prop for light / dark themes (patternfly#7372) patternfly#7369 chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.49.0 - @patternfly/react-catalog-view-extension@4.61.0 - @patternfly/react-charts@6.63.0 - @patternfly/react-code-editor@4.51.0 - @patternfly/react-console@4.61.0 - @patternfly/react-core@4.210.0 - @patternfly/react-docs@5.71.0 - @patternfly/react-icons@4.61.0 - @patternfly/react-inline-edit-extension@4.55.0 - demo-app-ts@4.170.0 - @patternfly/react-integration@4.172.0 - @patternfly/react-log-viewer@4.55.0 - @patternfly/react-styles@4.60.0 - @patternfly/react-table@4.79.0 - @patternfly/react-tokens@4.62.0 - @patternfly/react-topology@4.57.0 - @patternfly/react-virtualized-extension@4.57.0 - transformer-cjs-imports@4.48.0 feat(tokens): Variables now include a fallback value for charts (patternfly#7374) patternfly#7373 chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.50.0 - @patternfly/react-catalog-view-extension@4.62.0 - @patternfly/react-charts@6.64.0 - @patternfly/react-code-editor@4.52.0 - @patternfly/react-console@4.62.0 - @patternfly/react-core@4.211.0 - @patternfly/react-docs@5.72.0 - @patternfly/react-icons@4.62.0 - @patternfly/react-inline-edit-extension@4.56.0 - demo-app-ts@4.171.0 - @patternfly/react-integration@4.173.0 - @patternfly/react-log-viewer@4.56.0 - @patternfly/react-styles@4.61.0 - @patternfly/react-table@4.80.0 - @patternfly/react-tokens@4.63.0 - @patternfly/react-topology@4.58.0 - @patternfly/react-virtualized-extension@4.58.0 - transformer-cjs-imports@4.49.0 chore(deps): update dependency @patternfly/patternfly to v4.194.0 (patternfly#7375) Co-authored-by: Renovate Bot <bot@renovateapp.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.50.1 - @patternfly/react-catalog-view-extension@4.62.1 - @patternfly/react-charts@6.64.1 - @patternfly/react-code-editor@4.52.1 - @patternfly/react-console@4.62.1 - @patternfly/react-core@4.211.1 - @patternfly/react-docs@5.72.1 - @patternfly/react-icons@4.62.1 - @patternfly/react-inline-edit-extension@4.56.1 - demo-app-ts@4.171.1 - @patternfly/react-integration@4.173.1 - @patternfly/react-log-viewer@4.56.1 - @patternfly/react-styles@4.61.1 - @patternfly/react-table@4.80.1 - @patternfly/react-tokens@4.63.1 - @patternfly/react-topology@4.58.1 - @patternfly/react-virtualized-extension@4.58.1 - transformer-cjs-imports@4.49.1 fix: tree view menu keyboard handling (patternfly#7334) * fix: tree view menu keyboard handling * refactor to panel * add comments to helper functions, remove unused keyboard override from menu fix(Page): add tabindex to components with hasOverflowScroll (patternfly#7274) * fix(PageSection): make content scrollable via keyboard with hasOverflowScroll * Add tabindex to remaining Page components with hasOverflowScroll chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.50.2 - @patternfly/react-catalog-view-extension@4.62.2 - @patternfly/react-charts@6.64.2 - @patternfly/react-code-editor@4.52.2 - @patternfly/react-console@4.62.2 - @patternfly/react-core@4.211.2 - @patternfly/react-docs@5.72.2 - @patternfly/react-icons@4.62.2 - @patternfly/react-inline-edit-extension@4.56.2 - demo-app-ts@4.171.2 - @patternfly/react-integration@4.173.2 - @patternfly/react-log-viewer@4.56.2 - @patternfly/react-styles@4.61.2 - @patternfly/react-table@4.80.2 - @patternfly/react-tokens@4.63.2 - @patternfly/react-topology@4.58.2 - @patternfly/react-virtualized-extension@4.58.2 - transformer-cjs-imports@4.49.2 fix(Tooltip): make ref variant announced by assistive tech (patternfly#7332) * fix(Tooltip): make ref variant announced by assistive tech * Make suggested changes * Add aria-describedby back to example for NVDA and JAWS support fix(LogViewer): clear ANSI cache when resetting the log window (patternfly#7355) chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.50.3 - @patternfly/react-catalog-view-extension@4.62.3 - @patternfly/react-charts@6.64.3 - @patternfly/react-code-editor@4.52.3 - @patternfly/react-console@4.62.3 - @patternfly/react-core@4.211.3 - @patternfly/react-docs@5.72.3 - @patternfly/react-icons@4.62.3 - @patternfly/react-inline-edit-extension@4.56.3 - demo-app-ts@4.171.3 - @patternfly/react-integration@4.173.3 - @patternfly/react-log-viewer@4.56.3 - @patternfly/react-styles@4.61.3 - @patternfly/react-table@4.80.3 - @patternfly/react-tokens@4.63.3 - @patternfly/react-topology@4.58.3 - @patternfly/react-virtualized-extension@4.58.3 - transformer-cjs-imports@4.49.3 chore(deps): update dependency @patternfly/patternfly to v4.194.1 (patternfly#7386) Co-authored-by: Renovate Bot <bot@renovateapp.com> docs(Modal): add example preserving a11y when content overflows (patternfly#7293) * docs(Modal): add example preserving a11y when content overflows * update overflow example copy * add additional props to enable better a11y for scrollable content * add tests for new aria props * expand on body aria prop descriptions chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.50.4 - @patternfly/react-catalog-view-extension@4.62.4 - @patternfly/react-charts@6.64.4 - @patternfly/react-code-editor@4.52.4 - @patternfly/react-console@4.62.4 - @patternfly/react-core@4.211.4 - @patternfly/react-docs@5.72.4 - @patternfly/react-icons@4.62.4 - @patternfly/react-inline-edit-extension@4.56.4 - demo-app-ts@4.171.4 - @patternfly/react-integration@4.173.4 - @patternfly/react-log-viewer@4.56.4 - @patternfly/react-styles@4.61.4 - @patternfly/react-table@4.80.4 - @patternfly/react-tokens@4.63.4 - @patternfly/react-topology@4.58.4 - @patternfly/react-virtualized-extension@4.58.4 - transformer-cjs-imports@4.49.4 fix(Popper): update Popper modifiers when child DOM changes (patternfly#7385) * fix(Popper): update Popper modifiers when child DOM changes * update comments * fix build error * udpate comment chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.50.5 - @patternfly/react-catalog-view-extension@4.62.5 - @patternfly/react-charts@6.64.5 - @patternfly/react-code-editor@4.52.5 - @patternfly/react-console@4.62.5 - @patternfly/react-core@4.211.5 - @patternfly/react-docs@5.72.5 - @patternfly/react-icons@4.62.5 - @patternfly/react-inline-edit-extension@4.56.5 - demo-app-ts@4.171.5 - @patternfly/react-integration@4.173.5 - @patternfly/react-log-viewer@4.56.5 - @patternfly/react-styles@4.61.5 - @patternfly/react-table@4.80.5 - @patternfly/react-tokens@4.63.5 - @patternfly/react-topology@4.58.5 - @patternfly/react-virtualized-extension@4.58.5 - transformer-cjs-imports@4.49.5 chore(deps): update dependency theme-patternfly-org to v0.11.38 (patternfly#7381) Co-authored-by: Renovate Bot <bot@renovateapp.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.50.6 - @patternfly/react-catalog-view-extension@4.62.6 - @patternfly/react-charts@6.64.6 - @patternfly/react-code-editor@4.52.6 - @patternfly/react-console@4.62.6 - @patternfly/react-core@4.211.6 - @patternfly/react-docs@5.72.6 - @patternfly/react-icons@4.62.6 - @patternfly/react-inline-edit-extension@4.56.6 - demo-app-ts@4.171.6 - @patternfly/react-integration@4.173.6 - @patternfly/react-log-viewer@4.56.6 - @patternfly/react-styles@4.61.6 - @patternfly/react-table@4.80.6 - @patternfly/react-tokens@4.63.6 - @patternfly/react-topology@4.58.6 - @patternfly/react-virtualized-extension@4.58.6 - transformer-cjs-imports@4.49.6 feat(charts): added PF dark theme support (patternfly#7310) * feat(charts): added PF dark theme support * chore(charts): use single theme colorscale vars * chore(charts): update react-tokens to test fallback * chore(charts): merge cleanup * chore(charts): cleanup * chore(charts): revert token name change * chore(charts): remove newlines * chore(charts): snapshots * chore(charts): updated colors to use react tokens var chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.51.0 - @patternfly/react-catalog-view-extension@4.63.0 - @patternfly/react-charts@6.65.0 - @patternfly/react-code-editor@4.53.0 - @patternfly/react-console@4.63.0 - @patternfly/react-core@4.212.0 - @patternfly/react-docs@5.73.0 - @patternfly/react-icons@4.63.0 - @patternfly/react-inline-edit-extension@4.57.0 - demo-app-ts@4.172.0 - @patternfly/react-integration@4.174.0 - @patternfly/react-log-viewer@4.57.0 - @patternfly/react-styles@4.62.0 - @patternfly/react-table@4.81.0 - @patternfly/react-tokens@4.64.0 - @patternfly/react-topology@4.59.0 - @patternfly/react-virtualized-extension@4.59.0 - transformer-cjs-imports@4.50.0 feat(Tabs): allow dynamic close/add (patternfly#7297) * feat(Tabs): allow dynamic close/add * add button names * change to buttons, add disabled for close button, update demo * focus added tabs, update snap * update default aria * update new tab naming * update aria names, fix logic for empty tabs * update test with new prop names * update prop name in desc, prevent single tab close * update aria label, reabase * add update check for children * add beta flags chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.52.0 - @patternfly/react-catalog-view-extension@4.64.0 - @patternfly/react-charts@6.66.0 - @patternfly/react-code-editor@4.54.0 - @patternfly/react-console@4.64.0 - @patternfly/react-core@4.213.0 - @patternfly/react-docs@5.74.0 - @patternfly/react-icons@4.64.0 - @patternfly/react-inline-edit-extension@4.58.0 - demo-app-ts@4.173.0 - @patternfly/react-integration@4.175.0 - @patternfly/react-log-viewer@4.58.0 - @patternfly/react-styles@4.63.0 - @patternfly/react-table@4.82.0 - @patternfly/react-tokens@4.65.0 - @patternfly/react-topology@4.60.0 - @patternfly/react-virtualized-extension@4.60.0 - transformer-cjs-imports@4.51.0 chore(deps): update dependency @patternfly/patternfly to v4.194.2 (patternfly#7394) Co-authored-by: Renovate Bot <bot@renovateapp.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.52.1 - @patternfly/react-catalog-view-extension@4.64.1 - @patternfly/react-charts@6.66.1 - @patternfly/react-code-editor@4.54.1 - @patternfly/react-console@4.64.1 - @patternfly/react-core@4.213.1 - @patternfly/react-docs@5.74.1 - @patternfly/react-icons@4.64.1 - @patternfly/react-inline-edit-extension@4.58.1 - demo-app-ts@4.173.1 - @patternfly/react-integration@4.175.1 - @patternfly/react-log-viewer@4.58.1 - @patternfly/react-styles@4.63.1 - @patternfly/react-table@4.82.1 - @patternfly/react-tokens@4.65.1 - @patternfly/react-topology@4.60.1 - @patternfly/react-virtualized-extension@4.60.1 - transformer-cjs-imports@4.51.1 Revert "docs(Dropdown): expose menuAppendTo in Dropdown prop docs (patternfly#7173)" (patternfly#7395) This reverts commit fdbf6f9. chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.52.2 - @patternfly/react-catalog-view-extension@4.64.2 - @patternfly/react-charts@6.66.2 - @patternfly/react-code-editor@4.54.2 - @patternfly/react-console@4.64.2 - @patternfly/react-core@4.213.2 - @patternfly/react-docs@5.74.2 - @patternfly/react-icons@4.64.2 - @patternfly/react-inline-edit-extension@4.58.2 - demo-app-ts@4.173.2 - @patternfly/react-integration@4.175.2 - @patternfly/react-log-viewer@4.58.2 - @patternfly/react-styles@4.63.2 - @patternfly/react-table@4.82.2 - @patternfly/react-tokens@4.65.2 - @patternfly/react-topology@4.60.2 - @patternfly/react-virtualized-extension@4.60.2 - transformer-cjs-imports@4.51.2 fix(Card): indicate card selectivity and status if using a screen reader (patternfly#7144) * fix(Card): indicate card selectivity and status if using a screen reader * rework hidden input implementation to fix a11y structure issues * Add temporary styling on hidden input focus for PR demo purposes * add automatic aria label determination * replace spaces with dashes in component ids * update to only pass an id when that id isn't empty * update snapshots * refactor aria label determination to use the effect hook * fix bug causing unintended warnings to be printed to the console * add aria label to demo galleries * remove temporary demonstration styling * improve hasHiddenInput prop description * rename hiddenInput props * add tests for new a11y functionality * refactor card title registering tests to be pure unit tests * add example to better explain selectable a11y props * improve new example copy chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.52.3 - @patternfly/react-catalog-view-extension@4.64.3 - @patternfly/react-charts@6.66.3 - @patternfly/react-code-editor@4.54.3 - @patternfly/react-console@4.64.3 - @patternfly/react-core@4.213.3 - @patternfly/react-docs@5.74.3 - @patternfly/react-icons@4.64.3 - @patternfly/react-inline-edit-extension@4.58.3 - demo-app-ts@4.173.3 - @patternfly/react-integration@4.175.3 - @patternfly/react-log-viewer@4.58.3 - @patternfly/react-styles@4.63.3 - @patternfly/react-table@4.82.3 - @patternfly/react-tokens@4.65.3 - @patternfly/react-topology@4.60.3 - @patternfly/react-virtualized-extension@4.60.3 - transformer-cjs-imports@4.51.3 fix(topology): fix variables (patternfly#7364) chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.52.4 - @patternfly/react-catalog-view-extension@4.64.4 - @patternfly/react-charts@6.66.4 - @patternfly/react-code-editor@4.54.4 - @patternfly/react-console@4.64.4 - @patternfly/react-core@4.213.4 - @patternfly/react-docs@5.74.4 - @patternfly/react-icons@4.64.4 - @patternfly/react-inline-edit-extension@4.58.4 - demo-app-ts@4.173.4 - @patternfly/react-integration@4.175.4 - @patternfly/react-log-viewer@4.58.4 - @patternfly/react-styles@4.63.4 - @patternfly/react-table@4.82.4 - @patternfly/react-tokens@4.65.4 - @patternfly/react-topology@4.60.4 - @patternfly/react-virtualized-extension@4.60.4 - transformer-cjs-imports@4.51.4 fix(charts): support customizing tooltip border for dark theme (patternfly#7393) chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.52.5 - @patternfly/react-catalog-view-extension@4.64.5 - @patternfly/react-charts@6.66.5 - @patternfly/react-code-editor@4.54.5 - @patternfly/react-console@4.64.5 - @patternfly/react-core@4.213.5 - @patternfly/react-docs@5.74.5 - @patternfly/react-icons@4.64.5 - @patternfly/react-inline-edit-extension@4.58.5 - demo-app-ts@4.173.5 - @patternfly/react-integration@4.175.5 - @patternfly/react-log-viewer@4.58.5 - @patternfly/react-styles@4.63.5 - @patternfly/react-table@4.82.5 - @patternfly/react-tokens@4.65.5 - @patternfly/react-topology@4.60.5 - @patternfly/react-virtualized-extension@4.60.5 - transformer-cjs-imports@4.51.5 chore(deps): update dependency @patternfly/patternfly to v4.194.4 (patternfly#7404) Co-authored-by: Renovate Bot <bot@renovateapp.com> chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.52.6 - @patternfly/react-catalog-view-extension@4.64.6 - @patternfly/react-charts@6.66.6 - @patternfly/react-code-editor@4.54.6 - @patternfly/react-console@4.64.6 - @patternfly/react-core@4.213.6 - @patternfly/react-docs@5.74.6 - @patternfly/react-icons@4.64.6 - @patternfly/react-inline-edit-extension@4.58.6 - demo-app-ts@4.173.6 - @patternfly/react-integration@4.175.6 - @patternfly/react-log-viewer@4.58.6 - @patternfly/react-styles@4.63.6 - @patternfly/react-table@4.82.6 - @patternfly/react-tokens@4.65.6 - @patternfly/react-topology@4.60.6 - @patternfly/react-virtualized-extension@4.60.6 - transformer-cjs-imports@4.51.6 feat(table): expandable table demo (patternfly#7277) * full screen demo for bulk-select example * format * convert to full page demo * rename column * revert bulk selct * revert imports * format * add imports * add isFullscreen flag * remove select all * PR feedback from Matt * remove toolbar chore(release): releasing packages [ci skip] - eslint-plugin-patternfly-react@4.53.0 - @patternfly/react-catalog-view-extension@4.65.0 - @patternfly/react-charts@6.67.0 - @patternfly/react-code-editor@4.55.0 - @patternfly/react-console@4.65.0 - @patternfly/react-core@4.214.0 - @patternfly/react-docs@5.75.0 - @patternfly/react-icons@4.65.0 - @patternfly/react-inline-edit-extension@4.59.0 - demo-app-ts@4.174.0 - @patternfly/react-integration@4.176.0 - @patternfly/react-log-viewer@4.59.0 - @patternfly/react-styles@4.64.0 - @patternfly/react-table@4.83.0 - @patternfly/react-tokens@4.66.0 - @patternfly/react-topology@4.61.0 - @patternfly/react-virtualized-extension@4.61.0 - transformer-cjs-imports@4.52.0 Revert BaseLayout startLayout method back to protected. (patternfly#7407) fix(Tabs): make close handler optional (patternfly#7405) expose prop info

wise-king-sullyman force-pushed the 6798-hidden-input branch from e5852a1 to 3b41786 Compare March 29, 2022 18:50

wise-king-sullyman force-pushed the 6798-hidden-input branch from 3b41786 to 1ca8417 Compare March 29, 2022 19:26

wise-king-sullyman requested review from jessiehuff, jgiardino, nicolethoen and thatblindgeye March 29, 2022 20:52

seanforyou23 reviewed Apr 5, 2022

View reviewed changes

wise-king-sullyman force-pushed the 6798-hidden-input branch 2 times, most recently from 9e657b2 to 64a28d3 Compare April 22, 2022 21:01

thatblindgeye reviewed May 3, 2022

View reviewed changes

wise-king-sullyman marked this pull request as ready for review May 4, 2022 20:46

wise-king-sullyman requested a review from thatblindgeye May 4, 2022 20:50

thatblindgeye approved these changes May 5, 2022

View reviewed changes

jessiehuff reviewed May 5, 2022

View reviewed changes

wise-king-sullyman added 8 commits May 5, 2022 15:42

fix(Card): indicate card selectivity and status if using a screen reader

628adc1

rework hidden input implementation to fix a11y structure issues

26a0421

Add temporary styling on hidden input focus for PR demo purposes

be92b50

add automatic aria label determination

3def8b9

replace spaces with dashes in component ids

0697e8a

update to only pass an id when that id isn't empty

896119e

update snapshots

95abb86

refactor aria label determination to use the effect hook

5349fcf

wise-king-sullyman added 7 commits May 5, 2022 15:42

fix bug causing unintended warnings to be printed to the console

fdc31c1

add aria label to demo galleries

d0df74e

remove temporary demonstration styling

232aeca

improve hasHiddenInput prop description

5fb6a7f

rename hiddenInput props

51d9035

add tests for new a11y functionality

6aceb74

refactor card title registering tests to be pure unit tests

1cad9b5

wise-king-sullyman mentioned this pull request May 6, 2022

Card - hidden inputs used by screen readers should appear to focus the associated card patternfly/patternfly#4835

Closed

tlabaj reviewed May 6, 2022

View reviewed changes

add example to better explain selectable a11y props

2382438

wise-king-sullyman force-pushed the 6798-hidden-input branch from caeb9c2 to 2382438 Compare May 6, 2022 20:32

nicolethoen approved these changes May 9, 2022

View reviewed changes

tlabaj reviewed May 9, 2022

View reviewed changes

seanforyou23 approved these changes May 10, 2022

View reviewed changes

improve new example copy

09d0656

tlabaj approved these changes May 10, 2022

View reviewed changes

jessiehuff approved these changes May 10, 2022

View reviewed changes

kmcfaul approved these changes May 10, 2022

View reviewed changes

tlabaj added the ux review label May 10, 2022

tlabaj requested a review from mcarrano May 10, 2022 15:28

mcarrano approved these changes May 10, 2022

View reviewed changes

tlabaj merged commit 56fab43 into patternfly:main May 10, 2022

wise-king-sullyman deleted the 6798-hidden-input branch May 10, 2022 17:01


		### Selectable accessibility highlight

		This example demonstrates how the `hasSelectableInput` and `onSelectableInputChange` props enable improved accessibility for selectable cards.

fix(Card): indicate card selectivity and status if using a screen reader #7144

fix(Card): indicate card selectivity and status if using a screen reader #7144

Uh oh!

Conversation

wise-king-sullyman commented Mar 29, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

patternfly-build commented Mar 29, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

thatblindgeye commented Mar 30, 2022

Uh oh!

wise-king-sullyman commented Mar 30, 2022 • edited by mcoker Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

seanforyou23 left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

nicolethoen commented Apr 6, 2022

Uh oh!

seanforyou23 commented Apr 6, 2022

Uh oh!

seanforyou23 commented Apr 6, 2022

Uh oh!

thatblindgeye left a comment

Choose a reason for hiding this comment

Uh oh!

wise-king-sullyman commented May 4, 2022

Uh oh!

thatblindgeye left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

wise-king-sullyman May 5, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jessiehuff left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

wise-king-sullyman commented May 5, 2022

Uh oh!

tlabaj left a comment

Choose a reason for hiding this comment

Uh oh!

wise-king-sullyman commented May 6, 2022

Uh oh!

tlabaj commented May 6, 2022

Uh oh!

wise-king-sullyman commented May 6, 2022

Uh oh!

nicolethoen left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

seanforyou23 left a comment

Choose a reason for hiding this comment

Uh oh!

jessiehuff left a comment

Choose a reason for hiding this comment

Uh oh!

mcarrano left a comment

Choose a reason for hiding this comment

Uh oh!

wise-king-sullyman commented Mar 29, 2022 •

edited

Loading

patternfly-build commented Mar 29, 2022 •

edited

Loading

wise-king-sullyman commented Mar 30, 2022 •

edited by mcoker

Loading

seanforyou23 left a comment •

edited

Loading

wise-king-sullyman May 5, 2022 •

edited

Loading

jessiehuff left a comment •

edited

Loading