Snippet
The Snippet component is used to display blocks of code or text with a convenient copy-to-clipboard feature. It supports customization through different accent colors and can optionally display a command-line prompt before each line.
Usage
First of all, you need to import the Snippet
component from the kitchn
package.
import { Snippet } from "kitchn"
Default
Multi-line
No prompt
Callback
Type
Props
Name | Type | Default | Required | Description |
---|---|---|---|---|
text | string | string[] | "" | Yes | The text or code to be displayed in the snippet. Can be a single string or an array of strings for multi-line snippets. |
prompt | boolean | true | No | If true , displays a command-line prompt ($ ) before each line of text. |
type | keyof AccentColors | "primary" | No | Defines the accent color for the snippet. |
onCopy | (text: string) => void | null | No | Callback function that gets triggered when the text is copied. |