UNPKG

@neynar/ui

Version:

React UI component library built on shadcn/ui and Tailwind CSS

108 lines (87 loc) 2.2 kB
# Code **Type**: component Code - Inline code component for technical content Semantic code element for inline code snippets, variable names, and technical references. Uses monospace font and "code" variant for clear distinction from regular text. ## JSX Usage ```jsx import { Code } from '@neynar/ui'; <Code color={value} align={value} transform={value} weight={value} htmlFor="value" asChild={true} italic={true} underline={true} strikethrough={true} truncate={true} srOnly={true} className="value" > {/* Your content here */} </Code> ``` ## Component Props ### color - **Type**: `| "default" | "muted" | "accent" | "destructive" | "success" | "warning"` - **Required**: No - **Description**: No description available ### align - **Type**: `"left" | "center" | "right" | "justify"` - **Required**: No - **Description**: No description available ### transform - **Type**: `"uppercase" | "lowercase" | "capitalize"` - **Required**: No - **Description**: No description available ### weight - **Type**: `"normal" | "medium" | "semibold" | "bold"` - **Required**: No - **Description**: No description available ### htmlFor - **Type**: `string` - **Required**: No - **Description**: No description available ### asChild - **Type**: `boolean` - **Required**: No - **Description**: No description available ### italic - **Type**: `boolean` - **Required**: No - **Description**: No description available ### underline - **Type**: `boolean` - **Required**: No - **Description**: No description available ### strikethrough - **Type**: `boolean` - **Required**: No - **Description**: No description available ### truncate - **Type**: `boolean` - **Required**: No - **Description**: No description available ### srOnly - **Type**: `boolean` - **Required**: No - **Description**: No description available ### className - **Type**: `string` - **Required**: No - **Description**: No description available ### children - **Type**: `React.ReactNode` - **Required**: No - **Description**: No description available ## Examples ```tsx // Inline code snippet <Code>const message = "Hello, world!";</Code> // Terminal command <Code color="muted">npm install