This component uses the native, asynchronous [Clipboard API](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/writeText) to copy text. Please note that the `clipboard.writeText` API is not supported in [IE 11 nor Safari iOS version 13.3 or lower](https://caniuse.com/mdn-api_clipboard_writetext). You can override the default copy functionality with your own implementation. See [Overriding copy functionality](#overriding-copy-functionality). ## Default (single-line) ## Overriding copy functionality To override the default copy behavior, pass a custom function to the `copy` prop. In this example, we use the open source module [clipboard-copy](https://github.com/feross/clipboard-copy) to copy the text instead of the default Clipboard API. ## Preventing copy functionality To prevent text from being copied entirely, pass a no-op function to the `copy` prop. {}} /> ## Inline ## Multi-line ## Expanded by default Use the `expanded` prop to control whether the multi-line code snippet is expanded or not. ## Reactive example The multi-line code snippet also dispatches "expand" and "collapse" events. ## Custom copy feedback text Use the `feedback` prop to override the default copy button feedback text. ## Hidden copy button Set `hideCopyButton` to `true` to hide the copy button. ## Disabled The `disabled` prop applies only to the `"single"` and `"multi"` code snippet types.
## Wrapped text `wrapText` only applies to the `"multi"` type. ## Dynamic multi-line code For dynamically updated code, you must use the `code` prop instead of the default slot. ## Hidden multi-line code There may be cases where your code snippet is hidden in the DOM. The logic to render the "Show more" button relies on the element's computed height. For hidden content, the button will not appear because the computed height is `0`. The recommended workaround is to re-render the component. See the example below. ## Skeleton The default skeleton type is `"single"`. ## Skeleton (multi-line)