From 9f95d30885b8ea06d17e8a2a3e9a287ce9307465 Mon Sep 17 00:00:00 2001
From: gitdallas <dallas.nicol@gmail.com>
Date: Thu, 5 Oct 2023 12:39:07 -0500
Subject: [PATCH 1/2] feat(ClipboardCopy): 9712 allow alternative title

---
 .../src/components/ClipboardCopy/ClipboardCopy.tsx |  9 +++++++--
 .../ClipboardCopy/examples/ClipboardCopy.md        |  5 +++++
 .../examples/ClipboardCopyExpandedWithAltTitle.tsx | 14 ++++++++++++++
 3 files changed, 26 insertions(+), 2 deletions(-)
 create mode 100644 packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopyExpandedWithAltTitle.tsx

diff --git a/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx b/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx
index bb70d7af704..d18b6a29c4e 100644
--- a/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx
+++ b/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx
@@ -47,6 +47,8 @@ export interface ClipboardCopyProps extends Omit<React.HTMLProps<HTMLDivElement>
   isBlock?: boolean;
   /** Adds Clipboard Copy variant styles. */
   variant?: typeof ClipboardCopyVariant | 'inline' | 'expansion' | 'inline-compact';
+  /** Replaces the textinput text, useful for expansion variant when you want to provide a summary of the text that will be copied. Will force isReadOnly on the textInput part. */
+  title?: string;
   /** Copy button tooltip position. */
   position?:
     | TooltipPosition
@@ -104,6 +106,7 @@ class ClipboardCopy extends React.Component<ClipboardCopyProps, ClipboardCopySta
     isExpanded: false,
     isCode: false,
     variant: 'inline',
+    title: '',
     position: TooltipPosition.top,
     maxWidth: '150px',
     exitDelay: 1500,
@@ -160,6 +163,7 @@ class ClipboardCopy extends React.Component<ClipboardCopyProps, ClipboardCopySta
       toggleAriaLabel,
       variant,
       position,
+      title,
       className,
       additionalActions,
       ouiaId,
@@ -169,6 +173,7 @@ class ClipboardCopy extends React.Component<ClipboardCopyProps, ClipboardCopySta
     const textIdPrefix = 'text-input-';
     const toggleIdPrefix = 'toggle-';
     const contentIdPrefix = 'content-';
+
     return (
       <div
         className={css(
@@ -237,9 +242,9 @@ class ClipboardCopy extends React.Component<ClipboardCopyProps, ClipboardCopySta
                     />
                   )}
                   <TextInput
-                    readOnlyVariant={isReadOnly || this.state.expanded ? 'default' : undefined}
+                    readOnlyVariant={isReadOnly || title || this.state.expanded ? 'default' : undefined}
                     onChange={this.updateText}
-                    value={this.state.text as string | number}
+                    value={title || (this.state.text as string | number)}
                     id={`text-input-${id}`}
                     aria-label={textAriaLabel}
                     {...(isCode && { dir: 'ltr' })}
diff --git a/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopy.md b/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopy.md
index 7acf139ac99..eb331b7d591 100644
--- a/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopy.md
+++ b/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopy.md
@@ -25,6 +25,11 @@ import PlayIcon from '@patternfly/react-icons/dist/esm/icons/play-icon';
 ```ts file="./ClipboardCopyExpanded.tsx"
 ```
 
+### Expanded with alternate title
+
+```ts file="./ClipboardCopyExpandedWithAltTitle.tsx"
+```
+
 ### Read only expanded
 
 ```ts file="./ClipboardCopyReadOnlyExpanded.tsx"
diff --git a/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopyExpandedWithAltTitle.tsx b/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopyExpandedWithAltTitle.tsx
new file mode 100644
index 00000000000..fe870c20538
--- /dev/null
+++ b/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopyExpandedWithAltTitle.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import { ClipboardCopy, ClipboardCopyVariant } from '@patternfly/react-core';
+
+export const ClipboardCopyExpanded: React.FunctionComponent = () => (
+  <ClipboardCopy
+    hoverTip="Copy"
+    title="The info you need, expand to see what actually gets copied"
+    clickTip="Copied"
+    variant={ClipboardCopyVariant.expansion}
+  >
+    Got a lot of text here, need to see all of it? Click that arrow on the left side and check out the resulting
+    expansion.
+  </ClipboardCopy>
+);

From af15759337958bee14e65cc9729f804f63d9e117 Mon Sep 17 00:00:00 2001
From: gitdallas <dallas.nicol@gmail.com>
Date: Thu, 5 Oct 2023 13:16:02 -0500
Subject: [PATCH 2/2] add some descriptive text in the example

---
 .../examples/ClipboardCopyExpandedWithAltTitle.tsx          | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopyExpandedWithAltTitle.tsx b/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopyExpandedWithAltTitle.tsx
index fe870c20538..d03caf857a8 100644
--- a/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopyExpandedWithAltTitle.tsx
+++ b/packages/react-core/src/components/ClipboardCopy/examples/ClipboardCopyExpandedWithAltTitle.tsx
@@ -8,7 +8,9 @@ export const ClipboardCopyExpanded: React.FunctionComponent = () => (
     clickTip="Copied"
     variant={ClipboardCopyVariant.expansion}
   >
-    Got a lot of text here, need to see all of it? Click that arrow on the left side and check out the resulting
-    expansion.
+    This could be a lot of information that you'd want to summarize with a title as above. The title above will be
+    readonly as it was defined as a title rather than just the first part of this text. However, a user can still modify
+    this content which gets copied into the clipboard. You can use the isReadOnly flag to prevent them from changing
+    this.
   </ClipboardCopy>
 );