Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Lucide support #45

Merged
merged 4 commits into from
Apr 28, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions .gitmodules
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,9 @@
[submodule "icon_resources/feather"]
path = icon_resources/feather
url = https://github.com/feathericons/feather
[submodule "icon_resources/lucide"]
path = icon_resources/lucide
url = https://github.com/lucide-icons/lucide
[submodule "icon_resources/material-design-icons"]
path = icon_resources/material-design-icons
url = https://github.com/google/material-design-icons
2 changes: 2 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ The following features are available. Please see [react-icons site](https://reac
- [hero-icons-outline](https://docs.rs/dioxus-free-icons/latest/dioxus_free_icons/icons/hi_outline_icons/index.html)
- [hero-icons-solid](https://docs.rs/dioxus-free-icons/latest/dioxus_free_icons/icons/hi_solid_icons/index.html)
- [ionicons](https://docs.rs/dioxus-free-icons/latest/dioxus_free_icons/icons/io_icons/index.html)
- [lucide](https://docs.rs/dioxus-free-icons/latest/dioxus_free_icons/icons/ld_icons/index.html)
- [material-design-icons-action](https://docs.rs/dioxus-free-icons/latest/dioxus_free_icons/icons/md_action_icons/index.html)
- [material-design-icons-alert](https://docs.rs/dioxus-free-icons/latest/dioxus_free_icons/icons/md_alert_icons/index.html)
- [material-design-icons-av](https://docs.rs/dioxus-free-icons/latest/dioxus_free_icons/icons/md_av_icons/index.html)
Expand Down Expand Up @@ -81,6 +82,7 @@ Icon Library|License|Version
[Font Awesome](https://fontawesome.com/)|[CC BY 4.0 License](https://creativecommons.org/licenses/by/4.0/)| [6.1.1](https://github.com/FortAwesome/Font-Awesome/tree/6.1.1)
[Heroicons](https://heroicons.com/)|[MIT License](https://github.com/tailwindlabs/heroicons/blob/master/LICENSE)| [1.0.6](https://github.com/tailwindlabs/heroicons/tree/v1.0.6)
[Ionicons](https://ionic.io/ionicons)|[MIT License](https://github.com/ionic-team/ionicons/blob/main/LICENSE)| [6.0.2](https://github.com/ionic-team/ionicons/tree/v6.0.2)
[Lucide](https://lucide.dev)|[ISC License](https://github.com/lucide-icons/lucide/blob/main/LICENSE)| [0.265.0](https://github.com/lucide-icons/lucide/tree/v0.265.0)
[Material Design icons](https://developers.google.com/fonts/docs/material_icons)|[Apache License 2.0](https://github.com/google/material-design-icons/blob/master/LICENSE)| [4.0.0](https://github.com/google/material-design-icons/tree/4.0.0)
[Octicons](https://primer.style/octicons/)|[MIT License](https://github.com/primer/octicons/blob/main/LICENSE)| [17.3.0](https://github.com/primer/octicons/tree/v17.3.0)

Expand Down
1 change: 1 addition & 0 deletions icon_resources/lucide
Submodule lucide added at 34cf88
25 changes: 25 additions & 0 deletions packages/codegen/src/create_icon_file.rs
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,12 @@ impl IconShape for {ICON_NAME} {
fn fill_and_stroke<'a>(&self, user_color: &'a str) -> (&'a str, &'a str, &'a str) {
({FILL_COLOR}, {STROKE_COLOR}, {STROKE_WIDTH})
}
fn stroke_linecap(&self) -> &str {
"{STROKE_LINECAP}"
}
fn stroke_linejoin(&self) -> &str {
"{STROKE_LINEJOIN}"
}
fn child_elements(&self) -> Element {
rsx! {
{CHILD_ELEMENTS}
Expand Down Expand Up @@ -61,6 +67,8 @@ pub fn create_icon_file(svg_path: &str, output_path: &str, icon_prefix: &str) {
let (view_box, xmlns) = extract_svg_attrs(svg_element);
let child_elements = extract_svg_child_elements(svg_child_elements, icon_prefix);
let (fill_color, stroke_color, stroke_width) = extract_svg_colors(icon_prefix);
let stroke_linecap = extract_stroke_linecap(icon_prefix);
let stroke_linejoin = extract_stroke_linejoin(icon_prefix);

ICON_TEMPLATE
.replace("{ICON_NAME}", &format!("{}{}", icon_prefix, &icon_name))
Expand All @@ -70,6 +78,8 @@ pub fn create_icon_file(svg_path: &str, output_path: &str, icon_prefix: &str) {
.replace("{FILL_COLOR}", &fill_color)
.replace("{STROKE_COLOR}", &stroke_color)
.replace("{STROKE_WIDTH}", &stroke_width)
.replace("{STROKE_LINECAP}", &stroke_linecap)
.replace("{STROKE_LINEJOIN}", &stroke_linejoin)
})
.collect::<Vec<_>>()
.join("\n");
Expand Down Expand Up @@ -143,11 +153,26 @@ fn extract_svg_attrs(element: &Element) -> (String, String) {
fn extract_svg_colors(icon_prefix: &str) -> (&str, &str, &str) {
match icon_prefix {
"Fi" => ("\"none\"", "user_color", "\"2\""),
"Ld" => ("\"none\"", "user_color", "\"2\""),
"Io" => ("user_color", "user_color", "\"0\""),
_ => ("user_color", "\"none\"", "\"0\""),
}
}

fn extract_stroke_linecap(icon_prefix: &str) -> &str {
match icon_prefix {
"Ld" => "round",
_ => "butt",
}
}

fn extract_stroke_linejoin(icon_prefix: &str) -> &str {
match icon_prefix {
"Ld" => "round",
_ => "miter",
}
}

fn extract_svg_child_elements(elements: &[&Element], icon_prefix: &str) -> String {
let elements = match icon_prefix {
"Md" => &elements[1..],
Expand Down
5 changes: 5 additions & 0 deletions packages/codegen/src/main.rs
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,11 @@ fn main() {
let fi_output_path = format!("{}/fi_icons.rs", OUTPUT_BASE_PATH);
create_icon_file::create_icon_file(FI_SVG_BASE_PATH, &fi_output_path, "Fi");

// create feather icons
const LD_SVG_BASE_PATH: &str = "../../icon_resources/lucide/icons";
let ld_output_path = format!("{}/ld_icons.rs", OUTPUT_BASE_PATH);
create_icon_file::create_icon_file(LD_SVG_BASE_PATH, &ld_output_path, "Ld");

// create material design icons
const MI_SVG_BASE_PATH: &str = "../../icon_resources/material-design-icons/src";
for icon_type in vec![
Expand Down
1 change: 1 addition & 0 deletions packages/lib/Cargo.toml
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ octicons = []
hero-icons-outline = []
hero-icons-solid = []
ionicons = []
lucide = []
material-design-icons-action = []
material-design-icons-alert = []
material-design-icons-av = []
Expand Down
8 changes: 8 additions & 0 deletions packages/lib/src/icon_component.rs
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,12 @@ pub trait IconShape {
fn fill_and_stroke<'a>(&self, user_color: &'a str) -> (&'a str, &'a str, &'a str) {
("none", user_color, "0")
}
fn stroke_linecap(&self) -> &str {
"butt"
}
fn stroke_linejoin(&self) -> &str {
"miter"
}
}

/// Icon component Props
Expand Down Expand Up @@ -45,6 +51,8 @@ pub fn Icon<T: IconShape + Clone + PartialEq + 'static>(props: IconProps<T>) ->
fill,
stroke,
stroke_width,
stroke_linecap: "{props.icon.stroke_linecap()}",
stroke_linejoin: "{props.icon.stroke_linejoin()}",
if let Some(title_text) = props.title {
title {
"{title_text}"
Expand Down
2 changes: 2 additions & 0 deletions packages/lib/src/icons.rs
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,8 @@ pub mod hi_outline_icons;
pub mod hi_solid_icons;
#[cfg(feature = "ionicons")]
pub mod io_icons;
#[cfg(feature = "lucide")]
pub mod ld_icons;
#[cfg(feature = "material-design-icons-action")]
pub mod md_action_icons;
#[cfg(feature = "material-design-icons-alert")]
Expand Down
Loading
Loading