update docs

Author: heyMP

elements/pfe-clipboard/docs/index.md

@@ -11,6 +11,7 @@ tags:
   - component
 ---
 
+
 ::: section header
 # {{ title }}
 :::
@@ -38,6 +39,36 @@ npm install @patternfly/pfe-clipboard
 <pfe-clipboard role="button" tabindex="0"></pfe-clipboard>
 ```
 
+### Copy text from element
+<pfe-clipboard role="button" tabindex="0" copy-from="#textToCopy">
+  <span slot="text">This will copy the text in the text field below!</span>
+  <span slot="text--success">Making some copies!</span>
+</pfe-clipboard>
+<input type="text" id="textToCopy" value="This text will be copied!!11"></input>
+```html
+<pfe-clipboard role="button" tabindex="0" copy-from="#textToCopy">
+  <span slot="text">This will copy the text in the text field below!</span>
+  <span slot="text--success">Making some copies!</span>
+</pfe-clipboard>
+<input type="text" id="textToCopy" value="This text will be copied!!11"></input>
+```
+
+### Copying text from property
+<pfe-clipboard role="button" tabindex="0" copy-from="property" id="propertyCopy"></pfe-clipboard>
+<script>
+  window.addEventListener('load', function() {
+    document.getElementById('propertyCopy').contentToCopy = '    <h2>Clipboard: with custom text & copying text from element</h2>\n    <pfe-clipboard role="button" tabindex="0" copy-from="#textToCopy">\n      <span slot="text">This will copy the text in the text field below!</span>\n      <span slot="text--success">Making some copies!</span>\n    </pfe-clipboard>\n    <input type="text" id="textToCopy" value="This text will be copied!!11"></input>';
+  })
+</script>
+```html
+<pfe-clipboard role="button" tabindex="0" copy-from="property" id="propertyCopy"></pfe-clipboard>
+<script>
+  window.addEventListener('load', function() {
+    document.getElementById('propertyCopy').contentToCopy = '    <h2>Clipboard: with custom text & copying text from element</h2>\n    <pfe-clipboard role="button" tabindex="0" copy-from="#textToCopy">\n      <span slot="text">This will copy the text in the text field below!</span>\n      <span slot="text--success">Making some copies!</span>\n    </pfe-clipboard>\n    <input type="text" id="textToCopy" value="This text will be copied!!11"></input>';
+  })
+</script>
+```
+
 ### Optionally hide the icon
 <pfe-clipboard no-icon role="button" tabindex="0"></pfe-clipboard>
 ```html