Generate module and optimize LiveView diffing

This commit is contained in:
Chris McCord
2022-09-15 11:58:46 -04:00
parent 2ff8bca42e
commit 46c0c7237d
857 changed files with 8823 additions and 501 deletions

View File

@ -1,14 +1,12 @@
# Heroicons
[Heroicons](https://github.com/tailwindlabs/heroicons) are "a set of free MIT-licensed high-quality SVG icons for you to use in your web projects". This package gives you Elixir functions to drop Heroicons into your HTML, styled with arbitrary classes.
[Heroicons](heroicons.com) are "a set of free MIT-licensed high-quality SVG icons for you to use in your web projects". This package gives you Elixir functions to drop Heroicons into your HTML, styled with arbitrary classes.
This library provides optimized svgs for each Heroicon packaged as a Phoenix Component (and as a function for backwards-compatibility).
In order to provide the best balance of fast compilation times and run-time performance, Phoenix Components are just-in-time compiled on first use and then cached in an ETS-backed cache.
This library provides optimized svgs for each Heroicon packaged as a Phoenix Component.
Heroicons are designed by [Steve Schoger](https://twitter.com/steveschoger)
Current Heroicons Version: **2.0.10**. It's possible to configure a different Heroicon version locally, see [mix heroicons.update](https://hexdocs.pm/heroicons/Mix.Tasks.Heroicons.Update.html)
Current Heroicons Version: **2.0.10**.
## Installation
@ -17,7 +15,7 @@ Add Heroicons to your `mix.exs`:
```elixir
defp deps do
[
{:heroicons, "~> 0.4.1"}
{:heroicons, "~> 0.5.0"}
]
end
```
@ -26,23 +24,25 @@ After that, run `mix deps.get`.
## Usage
The components are in `Heroicons.Solid`, `Heroicons.Outline`, and `Heroicons.Mini`. Each icon is a Phoenix Component you can use in your HEEx templates.
The components are provided by the `Heroicons` module. Each icon is a Phoenix Component you can use in your HEEx templates.
By ddefault the outline style is used:
```eex
<Heroicons.Solid.cake />
```
and style it with some classes
You can render the solid or mini styles by providing the `solid` or `mini` flags:
```eex
<Heroicons.Solid.cake class="w-6 h-6 text-gray-500" />
<Heroicons.Solid.cake solid />
<Heroicons.Solid.cake mini />
```
There are also function versions of each component:
```eex
<%= Heroicons.Solid.cake() %>
You can also provide arbitrary HTML attributes to the svg tag, such as classes:
<%= Heroicons.Solid.cake(class: "w-6 h-6 text-gray-500") %>
```eex
<Heroicons.cake class="w-6 h-6 text-gray-500" />
```
For a full list of icons see [the docs](https://hexdocs.pm/heroicons/api-reference.html) or [heroicons.com](https://heroicons.com/).