README.md in phlex-icons-hero-0.14.0 vs README.md in phlex-icons-hero-0.15.0

- old
+ new

@@ -19,10 +19,20 @@ - [Remix Icons](https://remixicon.com) (2,800+) - [Tabler Icons](https://tabler.io/icons) (4,800+) And happy to extend to other icon packs! +If you don't want to add all icon packs to your application, you can add a specific icon pack by using one (or multiple) of the following gems: + +- [phlex-icons-bootstrap](https://rubygems.org/gems/phlex-icons-bootstrap) +- [phlex-icons-flag](https://rubygems.org/gems/phlex-icons-flag) +- [phlex-icons-hero](https://rubygems.org/gems/phlex-icons-hero) +- [phlex-icons-lucide](https://rubygems.org/gems/phlex-icons-lucide) +- [phlex-icons-radix](https://rubygems.org/gems/phlex-icons-radix) +- [phlex-icons-remix](https://rubygems.org/gems/phlex-icons-remix) +- [phlex-icons-tabler](https://rubygems.org/gems/phlex-icons-tabler) + Thanks [nejdetkadir](https://github.com/nejdetkadir) for creating [Phlex::Heroicons](https://github.com/nejdetkadir/phlex-heroicons) as it was the base for this gem. Other Phlex icon gems: - [phlex-remixicon](https://github.com/danieldocki/phlex-remixicon) - [phlex-lucide](https://github.com/akodkod/phlex-lucide) @@ -39,20 +49,10 @@ ```bash gem install phlex-icons ``` -If you don't want to add all icon packs to your application, you can add a specific icon pack by using one (or multiple) of the following gems: - -- [phlex-icons-bootstrap](https://rubygems.org/gems/phlex-icons-bootstrap) -- [phlex-icons-flag](https://rubygems.org/gems/phlex-icons-flag) -- [phlex-icons-hero](https://rubygems.org/gems/phlex-icons-hero) -- [phlex-icons-lucide](https://rubygems.org/gems/phlex-icons-lucide) -- [phlex-icons-radix](https://rubygems.org/gems/phlex-icons-radix) -- [phlex-icons-remix](https://rubygems.org/gems/phlex-icons-remix) -- [phlex-icons-tabler](https://rubygems.org/gems/phlex-icons-tabler) - ## Configuration The gem provides global configuration options, and per icons pack configuration options. ### Global configuration @@ -122,11 +122,11 @@ ## Usage ### With `Phlex::Kit` ```ruby -require 'phlex_icons' +require 'phlex-icons' class PhlexIcons < Phlex::HTML include Phlex::Icons def view_template @@ -144,11 +144,11 @@ ``` ### Without `Phlex::Kit` ```ruby -require 'phlex_icons' +require 'phlex-icons' class PhlexIcons < Phlex::HTML def view_template div do render Phlex::Icons::Bootstrap::House.new(classes: 'size-4') @@ -160,9 +160,74 @@ render Phlex::Icons::Tabler::Home.new(variant: :filled, classes: 'size-4') end end end ``` + +### Specific icon pack(s) + +Let's say you want to use only Heroicons and Flag Icons, you can use the following gems: +- [phlex-icons-flag](https://rubygems.org/gems/phlex-icons-flag) +- [phlex-icons-hero](https://rubygems.org/gems/phlex-icons-hero) + +Then, in your application, you can use the icons like this: + +```ruby +require 'phlex-icons-flag' +require 'phlex-icons-hero' + +class PhlexIcons < Phlex::HTML + include Phlex::Icons # If you want to use Phlex::Kit. + + def view_template + div do + # With Phlex::Kit. + Flag::Sa(variant: :rectangle, classes: 'size-4') + Hero::Home(variant: :solid, classes: 'size-4') + + # Without Phlex::Kit. + render Phlex::Icons::Flag::Sa.new(variant: :rectangle, classes: 'size-4') + render Phlex::Icons::Hero::Home.new(variant: :solid, classes: 'size-4') + end + end +end +``` + +### Add custom icons to your Rails application + +You can extend the gem in your Rails application to add new icons by creating a `phlex/icons/custom` directory inside `views/components` directory. Then, you can create a new component for each icon you want to add. For example: + +```ruby +# app/views/components/phlex/icons/custom/icon_class_name.rb + +module Phlex + module Icons + module Custom + class IconClassName < Phlex::Icons::Base + def view_template + # SVG code here. + end + end + end + end +end +``` + +Finally, you will need to create a `Phlex::Icons::Custom` module in `phlex/icons/custom.rb` file to include your custom icons and make them a `Phlex::Kit`: + +```ruby +# app/views/components/phlex/icons/custom.rb + +module Phlex + module Icons + module Custom + extend Phlex::Kit + end + end +end +``` + +Now, you can use your custom icons like any other icon pack as described above. ## Update icon packs All icon packs provided in this gem are auto-generated by their generator under [`generators`](/generators) directory. You just need to clone the repo and run the generator for the icon pack you want to update. In future, I'm planning to add GitHub Actions to automatically generate the icon packs and update the gem.