README.md

# AcePhoenix

A Phoenix component for integrating the Ace code editor into your Phoenix applications.

## Installation

Add `ace_phoenix` to your list of dependencies in `mix.exs`:

```elixir
def deps do
  [
    {:ace_phoenix, "~> 0.1.0"}
  ]
end
```

## Usage

1. In your `app.js`, import and set up the AceEditorHook:

```javascript
import { AceEditorHook } from "ace_phoenix";

let Hooks = {};
Hooks.AceEditor = AceEditorHook;

let liveSocket = new LiveSocket("/live", Socket, { hooks: Hooks, params: { _csrf_token: csrfToken } });
```

2. In your LiveView or component:

```elixir
import AcePhoenix.Components.AceEditor

def render(assigns) do
  ~H"""
  <.ace_editor id="my-editor" content={@content} mode="elixir" theme="monokai" />
  """
end

def handle_event("ace-change", %{"content" => content}, socket) do
  {:noreply, assign(socket, content: content)}
end
```

## License

This project is licensed under the MIT License.