ClipboardCopy - Allow truncate flexibility

[gitdallas]

trafficstars

ClipboardCopy currently truncates at the end. It may be nice in some cases to truncate at the start or middle (similar to how Truncate component works).

A workaround could currently work with inline-compact with some hacking, see https://codesandbox.io/p/sandbox/red-wind-zdgyqf

    <ClipboardCopy
      variant={"inline-compact"}
      style={{ display: "inline-flex" }}
      clickTip="Copied"
      onCopy={() => {
        navigator.clipboard.writeText(textToCopy);
      }}
    >
      <Truncate
        content={textToCopy}
        trailingNumChars={10}
        position={"middle"}
      />
    </ClipboardCopy>

However, this wouldn't work with other variants. They all use TextInput, as part of this feature I believe TextInput would also have to be updated to work with middle truncate (currently it only has start/end).

Could use props like truncatePosition, and truncateTrailingNumChars for middle.

This came up in a slack conversation with Vince Consola and @christianvogt

It would also be nice if inline-compact supported truncate by itself as well.

[tlabaj]

@mattnolting would we need css support for this?

[Griffin-Sullivan]

Would like to note here that in PF5 ClipboardCopy expects children of type React.ReactNode so the above example can be done without any issues. In PF6, ClipboardCopy expects children of type string. It seems to still work when passing the Truncate component but my IDE is upset about it.

[mattnolting]

@mattnolting would we need css support for this?

@tlabaj Doesn't appear to need any additional CSS support. 👍

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.

[christianvogt]

bump

[thatblindgeye]

@gitdallas @christianvogt is the ask here to provide truncation only for inline/inline-compact variants of the ClipboardCopy component? Only asking because I'm not totally sure we could provide truncate customization for a basic ClipboardCopy, where the text input shows truncation at the end when the input doesn't have focus.

[christianvogt]

The ask was for ClipboardCopy to support more truncation options such as start and middle because we have a scenario where a token is being copied and the values look identical except for the ends which gets truncated.