README.md

# RemixIcons

A Phoenix LiveView component library for using [Remix Icons](https://remixicon.com/) in your Elixir applications. This library provides over 2,800 pixel-perfect icons with automatic SVG downloading, caching, and easy integration with Phoenix components.

## Features

- 🎨 **2,800+ Icons**: Access the complete Remix Icon set
- âš¡ **Performance**: Built-in caching with Cachex for optimal performance
- 🔧 **Phoenix Component**: Simple, idiomatic Phoenix LiveView integration
- 🎯 **Type Safe**: Run-time icon name validation

## Installation

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

```elixir
def deps do
  [
    {:remix_icons, "~> 4.7.0"}
  ]
end
```

The package includes Remix Icons v4.7.0.

## Configuration

Add the RemixIcons cache to your application's supervision tree in `lib/your_app/application.ex`:

```elixir
def start(_type, _args) do
  children = [
    # ... other children
    RemixIcons.cache()
  ]

  opts = [strategy: :one_for_one, name: YourApp.Supervisor]
  Supervisor.start_link(children, opts)
end
```

## Usage

We recommend adding an icon component wrapper in your `CoreComponents` module. This allows you to use the `ri-` prefix (matching the Remix Icon naming convention) and add custom styling. The icon will inherit the styles from the wrapping div:

```elixir
attr :name, :string, required: true
attr :class, :string, default: nil

def icon(%{name: "ri-" <> name} = assigns) do
  assigns = assign(assigns, :name, name)

  ~H"""
  <div class={@class}>
    <RemixIcons.icon name={@name} />
  </div>
  """
end
```

Then use it in your templates:

```heex
<.icon name="ri-home-line" class="w-6 h-6" />
<.icon name="ri-user-fill" class="text-blue-500" />
```

### Finding Icon Names

Browse all available icons at [remixicon.com](https://remixicon.com/). When using the wrapper recommended on "Usage" section, the icon names are identical to those shown on the website:

```heex
<.icon name="ri-home-line" />
<.icon name="ri-user-fill" />
<.icon name="ri-arrow-right-line" />
```

If using `RemixIcons.icon` directly, omit the `ri-` prefix:

```heex
<RemixIcons.icon name="home-line" />
<RemixIcons.icon name="user-fill" />
<RemixIcons.icon name="arrow-right-line" />
```

## Contributions

This library follows the version numbering of the official [Remix Icon repository](https://github.com/Remix-Design/RemixIcon). When a new version of Remix Icons is released, this package will be updated to match that version number, ensuring consistency and easy tracking of which icon set version you're using.

### Updating Icons

To update to a new version of Remix Icons:

1. Update the `@remix_icon_version` variable in `mix.exs` to the desired version
2. Clean the existing icons:
   ```bash
   mix remix_clean
   ```
3. Download the new icons:
   ```bash
   mix remix_download
   ```
4. Update the package version in `mix.exs` to match the Remix Icon version
5. Test your application to ensure all icons are working correctly

### Useful Links

- [Remix Icon Official Site](https://remixicon.com/)
- [Remix Icon GitHub](https://github.com/Remix-Design/RemixIcon)

## Requirements

- Elixir ~> 1.18
- Phoenix LiveView >= 0.0.0
- Cachex >= 0.0.0

## License

This package is released under the MIT License.

Remix Icons are licensed under Apache License 2.0. See [Remix Icon License](https://github.com/Remix-Design/RemixIcon/blob/master/License) for details.