docs(release-highlights): Adds 6.3 highlights.

[edonehoo]

Closes #4637

[patternfly-build]

Preview: https://patternfly-org-pr-4682-site.surge.sh

[srambach]

This behavior actually changes slightly for mobile views. I don't know if we want to go into it here or make this more generic so that it covers mobile as well.

[edonehoo]

oh good callout! I think it's good to mention when mobile behavior is notably different.

Is there a good place to view the mobile behavior?

From the og issue, it seems like this was the idea, but I'm not able to replicate it on staging sites:

On desktop

• No direction by default (regular 3 bars)
• Show "collapse" arrows on hover/focus

On mobile

• Show "collapse" arrows when expanded
• Show "expand" arrows on hover/focus when collapsed

[srambach]

I don't think this is true?

[edonehoo]

ahh, I was going off of patternfly/patternfly#7151 (comment), which I'm now realizing is a super old comment. But I also don't see the animation in the pf menu on any of the staging sites? Do you know if it's just something yet to be pulled in, vs an intentional leave-off?

[rebeccaalpert]

Hey @edonehoo - This is what we added for ChatBot lately:

• Smart scroll for MessageBox - this was a contribution from Red Hat Developer Hub Lightspeed
• Compact variants for many UI components
• Empty and no-results states for chat history
• Expandable view for sources card
• External links in sources card
• Editable messages
• Expandable code blocks for use in Messages
• Documentation on how to add and use rehype plugins for advanced Message HTML customization
• Bug fixes like allowing custom placeholder text for message bar, allowing manual control over response action clicked state, improved image rendering in Message blocks, and passing additional props to many components

[srambach]

One other thought - we had implemented expand/collapse motion on navigation previously, but in this release we changed the approach so that it's more performant. This is probably worth calling out as at least one consumer saw some lagginess when lots of things were happening on their page.

[rebeccaalpert]

ChatBot stuff looks great; thank you! Links should work after a rebase/merge.

[mcoker]

🚀

[srambach]

We need to be super clear here that using this codemod to enable these particular animations could cause breaking changes. That's why they are created as opt-in - they create breaking changes due to changes in the HTML structure.

Instead of "support opt-in" perhaps it's also clearer to say "require opt-in"

[thatblindgeye]

I think what you have here is a great start for all of this. Some comments that would be worth tweaking/adding so consumers are structuring their tables in the way that was originally intended by Core but wasn't done so in React (but is now in expandable-like examples), moreso if they're opting into animations but they should also update their structure regardless (but nothing should break if they don't and aren't opting into animations):

• Table must have isExpandable passed to it (rather than isExpanded logic)
• The Tbody that contains any expandable rows must have isExpanded logic
• Any Tr whose purpsoe is to act as a "control row" (for normal expandable tables) or has the isControlRow prop (for compound expansion tables) must have isExpanded logic
• Any Tr whose purpose is to expand/collapse (the one that actually contains the expandable content) must have isExpandable passed to it, in addition to isExpanded logic
  • Additionally, any Td within these expandable Tr's must wrap any content in an ExpandableRowContent

With a basic example structure being:

<Table isExpandable> // pass hasAnimations if opting into animations, or run codemods rule to auto apply it
  ...Thead stuff...
  <Tbody isExpanded={...logic for checking if expanded}>
    <Tr isExpanded={...logic for checking if expanded}> // pass isControlRow for compound expandable implementation as well
      ..."control row" content
    </Tr>
    <Tr isExpandable isExpanded={...logic for checking if expanded}>
      <Td>
        <ExpandableRowContent>
          ...the actual content to display for the cell
        </ExpandableRowContent>
      </Td>
    </Tr>
  </Tbody>
</Table>

But this is also a lot of information so let me know what you think.

cc @mcoker did I miss anything/mess anything up in the intended structure here?

[mcoker]

👍

[thatblindgeye]

😮 looks great, thank you for adding the verbiage about all the table stuff! 🪨 ⭐

[thatblindgeye]

Suggested change

We have also created an [enable-animations codemod](https://github.com/patternfly/pf-codemods/tree/main/packages/eslint-plugin-pf-codemods/src/rules/v6/enableAnimations), which adds the `hasAnimations` prop to components that require opt-in animations. Keep in mind that, depending on your codebase, this codemod could introduce breaking changes that require further attention.

We have also created an [enable-animations codemod](https://github.com/patternfly/pf-codemods/tree/main/packages/eslint-plugin-pf-codemods/src/rules/v6/enableAnimations), which adds the `hasAnimations` prop to components that require opt-in animations. Keep in mind that, depending on your codebase, this codemod could introduce breaking changes that require further attention. Due to this, when running the codemod you will be asked whether you want to include the Table components for the animations opt-in, or just opt into animations for the react-core package.

Since the codemod will now offer a CLI option to include the react-table package as part of the animations optin, wdyt about this tweak?