# `PhiaUi.Components.CodeSnippet`
[🔗](https://github.com/charlenopires/PhiaUI/blob/v0.1.17/lib/phia_ui/components/display/code_snippet.ex#L1)

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" />

# `code_snippet`

## 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.

---

*Consult [api-reference.md](api-reference.md) for complete listing*
