Renders a code component.

Examples

<.code>IO.inspect()</.code>
<.code size="4" variant="solid" color="indigo">terminal.start()</.code>
<.code weight="bold" truncate={true}>const veryLongSyntaxExample = "truncated"</.code>

Props

• as_child - Composes the component into its immediate child instead of rendering its own HTML element.
• size - Code size from 1 to 9. Controls font size, line height, and letter spacing. Can be a string or a responsive map.
• variant - Visual style variant. One of "solid", "soft", "outline", or "ghost". Defaults to "soft".
• weight - Font weight: one of "light", "regular", "medium", or "bold".
• color - The code color. One of: gray, gold, bronze, brown, yellow, amber, orange, tomato, red, ruby, crimson, pink, plum, purple, violet, iris, indigo, blue, cyan, teal, jade, green, grass, lime, mint, sky.
• high_contrast - Whether to increase color contrast with the background.
• truncate - Whether to truncate text with ellipsis when it overflows.
• wrap - Text wrapping: one of "wrap", "nowrap", "pretty", or "balance".
• class - Additional CSS classes to add to the element.
• style - Additional inline styles.
• rest - Additional HTML attributes to add to the element.

Attributes

• color (:string) - Color utility class string. One of: gray, gold, bronze, brown, yellow, amber, orange, tomato, red, ruby, crimson, pink, plum, purple, violet, iris, indigo, blue, cyan, teal, jade, green, grass, lime, mint, sky. Must be one of "gray", "gold", "bronze", "brown", "yellow", "amber", "orange", "tomato", "red", "ruby", "crimson", "pink", "plum", "purple", "violet", "iris", "indigo", "blue", "cyan", "teal", "jade", "green", "grass", "lime", "mint", or "sky".
• high_contrast (:boolean) - Whether to increase color contrast with the background.
• truncate (:boolean) - Whether to truncate text with ellipsis when it overflows.
• wrap (:string) - Text wrapping: one of wrap, nowrap, pretty, balance. Must be one of "wrap", "nowrap", "pretty", or "balance".
• weight (:string) - Font weight: one of light, regular, medium, bold. Must be one of "light", "regular", "medium", or "bold".
• as_child (:boolean) - Composes the component into its immediate child instead of rendering its own HTML element. Defaults to false.
• size (:any) - Code size from 1 to 9. Controls font size, line height, and letter spacing. Can be "1" or %{xs: "1", sm: "2", md: "3", lg: "4", xl: "5"}.
• variant (:string) - Visual style variant. One of 'solid', 'soft', 'outline', or 'ghost'. Defaults to 'soft'. Defaults to "soft". Must be one of "solid", "soft", "outline", or "ghost".
• class (:string) - Defaults to nil.
• style (:string) - Defaults to "".
• Global attributes are accepted.

Slots

• inner_block (required)