PhiaUi.Components.CodeSnippet (phia_ui v0.1.17)

Copy Markdown View Source

Code display card with filename header, language badge, copy button, and line numbers.

Uses PhiaCodeSnippet JS hook for copy-to-clipboard with "Copied!" feedback. No syntax highlighting is included — the component renders raw code in a <pre><code> block. Syntax highlighting can be added via external libraries.

Examples

<.code_snippet id="ex1" code="defmodule Hello, do: def world, do: :ok" language="elixir" />

<.code_snippet
  id="ex2"
  code={@snippet}
  filename="app.js"
  language="javascript"
  show_line_numbers
/>

<.code_snippet id="ex3" code={@long_code} max_height="300px" />

Summary

Functions

code_snippet(assigns)

Functions

code_snippet(assigns)

Attributes

  • id (:string) (required) - Unique id required by the JS hook.
  • code (:string) (required) - Code string to display.
  • language (:string) - Language name shown as badge. Defaults to nil.
  • filename (:string) - Filename shown in header. Defaults to nil.
  • show_line_numbers (:boolean) - Show line numbers. Defaults to false.
  • highlight_lines (:list) - Line numbers to highlight. Defaults to [].
  • max_height (:string) - Max height for scrollable code area (CSS value). Defaults to nil.
  • class (:string) - Defaults to nil.
  • Global attributes are accepted.