-
Notifications
You must be signed in to change notification settings - Fork 53
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #322 from fluentcms/321-add-icon-component
#321 Add Icon component
- Loading branch information
Showing
15 changed files
with
380 additions
and
75 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,21 +1,30 @@ | ||
| <span class="f-icon f-icon-size-@Size @Class" @attributes=@RestProps> | ||
| <iconify-icon icon=@($"{Pack}:{Name}") width="100%" height="100%" /> | ||
| @inherits BaseComponent | ||
| @using System.Resources; | ||
|
|
||
| <span class=@this.GetClasses() @attributes=@AdditionalAttributes> | ||
| @Content | ||
| </span> | ||
|
|
||
| @code { | ||
| [Parameter] | ||
| public string Name {get; set;} = ""; | ||
| [Inject(Key = "FluentCMS.Web.UI.Resources.Icons")] | ||
| public required ResourceManager ResourceManager { get; set; } | ||
|
|
||
| [Parameter] | ||
| public string Pack {get; set;} = "tabler"; | ||
| public IconNameEnum Name { get; set; } = IconNameEnum.Default; | ||
|
|
||
| [Parameter] | ||
| public string Class {get; set;} = ""; | ||
| public MarkupString Content { get; set; } = default!; | ||
|
|
||
| [Parameter] | ||
| public string Size {get; set;} = "md"; | ||
| [CssProperty] | ||
| public ColorEnum Color { get; set; } = ColorEnum.Default; | ||
|
|
||
| [Parameter] | ||
| [CssProperty] | ||
| public SizeEnum Size { get; set; } = SizeEnum.Default; | ||
|
|
||
| [Parameter(CaptureUnmatchedValues = true)] | ||
| public Dictionary<string, object> RestProps {get; set;} | ||
| } | ||
| protected override void OnInitialized() | ||
| { | ||
| base.OnInitialized(); | ||
| Content = (MarkupString)(ResourceManager.GetString(Name.ToString()) ?? throw new Exception("Invalid Icon Name")); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,16 @@ | ||
| namespace FluentCMS.Web.UI.Components; | ||
|
|
||
| public enum ColorEnum | ||
| { | ||
| Default, | ||
| Primary, | ||
| Secondary, | ||
| Success, | ||
| Danger, | ||
| Warning, | ||
| Info, | ||
| Light, | ||
| Dark, | ||
| White, | ||
| Transparent | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| namespace FluentCMS.Web.UI.Resources; | ||
|
|
||
| // Enum Class for Icons | ||
| public enum IconNameEnum | ||
| { | ||
| // home icon | ||
| Default, | ||
| Home, | ||
| Delete, | ||
| InformationFilled, | ||
| Plus, | ||
| Search, | ||
| Settings, | ||
| Filter, | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| namespace FluentCMS.Web.UI.Components; | ||
|
|
||
| public enum SizeEnum | ||
| { | ||
| Default, | ||
| Small, | ||
| Medium, | ||
| Large | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| namespace FluentCMS.Web.UI.Resources; | ||
|
|
||
| // marker class for Icons.resx | ||
| public class Icons | ||
| { | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,189 @@ | ||
| <?xml version="1.0" encoding="utf-8"?> | ||
| <root> | ||
| <!-- | ||
| Microsoft ResX Schema | ||
| Version 2.0 | ||
| The primary goals of this format is to allow a simple XML format | ||
| that is mostly human readable. The generation and parsing of the | ||
| various data types are done through the TypeConverter classes | ||
| associated with the data types. | ||
| Example: | ||
| ... ado.net/XML headers & schema ... | ||
| <resheader name="resmimetype">text/microsoft-resx</resheader> | ||
| <resheader name="version">2.0</resheader> | ||
| <resheader name="reader">System.Resources.ResXResourceReader, System.Windows.Forms, ...</resheader> | ||
| <resheader name="writer">System.Resources.ResXResourceWriter, System.Windows.Forms, ...</resheader> | ||
| <data name="Name1"><value>this is my long string</value><comment>this is a comment</comment></data> | ||
| <data name="Color1" type="System.Drawing.Color, System.Drawing">Blue</data> | ||
| <data name="Bitmap1" mimetype="application/x-microsoft.net.object.binary.base64"> | ||
| <value>[base64 mime encoded serialized .NET Framework object]</value> | ||
| </data> | ||
| <data name="Icon1" type="System.Drawing.Icon, System.Drawing" mimetype="application/x-microsoft.net.object.bytearray.base64"> | ||
| <value>[base64 mime encoded string representing a byte array form of the .NET Framework object]</value> | ||
| <comment>This is a comment</comment> | ||
| </data> | ||
| There are any number of "resheader" rows that contain simple | ||
| name/value pairs. | ||
| Each data row contains a name, and value. The row also contains a | ||
| type or mimetype. Type corresponds to a .NET class that support | ||
| text/value conversion through the TypeConverter architecture. | ||
| Classes that don't support this are serialized and stored with the | ||
| mimetype set. | ||
| The mimetype is used for serialized objects, and tells the | ||
| ResXResourceReader how to depersist the object. This is currently not | ||
| extensible. For a given mimetype the value must be set accordingly: | ||
| Note - application/x-microsoft.net.object.binary.base64 is the format | ||
| that the ResXResourceWriter will generate, however the reader can | ||
| read any of the formats listed below. | ||
| mimetype: application/x-microsoft.net.object.binary.base64 | ||
| value : The object must be serialized with | ||
| : System.Runtime.Serialization.Formatters.Binary.BinaryFormatter | ||
| : and then encoded with base64 encoding. | ||
| mimetype: application/x-microsoft.net.object.soap.base64 | ||
| value : The object must be serialized with | ||
| : System.Runtime.Serialization.Formatters.Soap.SoapFormatter | ||
| : and then encoded with base64 encoding. | ||
| mimetype: application/x-microsoft.net.object.bytearray.base64 | ||
| value : The object must be serialized into a byte array | ||
| : using a System.ComponentModel.TypeConverter | ||
| : and then encoded with base64 encoding. | ||
| --> | ||
| <xsd:schema id="root" xmlns="" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata"> | ||
| <xsd:import namespace="http://www.w3.org/XML/1998/namespace" /> | ||
| <xsd:element name="root" msdata:IsDataSet="true"> | ||
| <xsd:complexType> | ||
| <xsd:choice maxOccurs="unbounded"> | ||
| <xsd:element name="metadata"> | ||
| <xsd:complexType> | ||
| <xsd:sequence> | ||
| <xsd:element name="value" type="xsd:string" minOccurs="0" /> | ||
| </xsd:sequence> | ||
| <xsd:attribute name="name" use="required" type="xsd:string" /> | ||
| <xsd:attribute name="type" type="xsd:string" /> | ||
| <xsd:attribute name="mimetype" type="xsd:string" /> | ||
| <xsd:attribute ref="xml:space" /> | ||
| </xsd:complexType> | ||
| </xsd:element> | ||
| <xsd:element name="assembly"> | ||
| <xsd:complexType> | ||
| <xsd:attribute name="alias" type="xsd:string" /> | ||
| <xsd:attribute name="name" type="xsd:string" /> | ||
| </xsd:complexType> | ||
| </xsd:element> | ||
| <xsd:element name="data"> | ||
| <xsd:complexType> | ||
| <xsd:sequence> | ||
| <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" /> | ||
| <xsd:element name="comment" type="xsd:string" minOccurs="0" msdata:Ordinal="2" /> | ||
| </xsd:sequence> | ||
| <xsd:attribute name="name" type="xsd:string" use="required" msdata:Ordinal="1" /> | ||
| <xsd:attribute name="type" type="xsd:string" msdata:Ordinal="3" /> | ||
| <xsd:attribute name="mimetype" type="xsd:string" msdata:Ordinal="4" /> | ||
| <xsd:attribute ref="xml:space" /> | ||
| </xsd:complexType> | ||
| </xsd:element> | ||
| <xsd:element name="resheader"> | ||
| <xsd:complexType> | ||
| <xsd:sequence> | ||
| <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" /> | ||
| </xsd:sequence> | ||
| <xsd:attribute name="name" type="xsd:string" use="required" /> | ||
| </xsd:complexType> | ||
| </xsd:element> | ||
| </xsd:choice> | ||
| </xsd:complexType> | ||
| </xsd:element> | ||
| </xsd:schema> | ||
| <resheader name="resmimetype"> | ||
| <value>text/microsoft-resx</value> | ||
| </resheader> | ||
| <resheader name="version"> | ||
| <value>2.0</value> | ||
| </resheader> | ||
| <resheader name="reader"> | ||
| <value>System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value> | ||
| </resheader> | ||
| <resheader name="writer"> | ||
| <value>System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value> | ||
| </resheader> | ||
| <data name="Default" xml:space="preserve"> | ||
| <value /> | ||
| </data> | ||
| <data name="Delete" xml:space="preserve"> | ||
| <value><svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 18 20"> | ||
| <path | ||
| d="M17 4h-4V2a2 2 0 0 0-2-2H7a2 2 0 0 0-2 2v2H1a1 1 0 0 0 0 2h1v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V6h1a1 1 0 1 0 | ||
| 0-2ZM7 2h4v2H7V2Zm1 14a1 1 0 1 1-2 0V8a1 1 0 0 1 2 0v8Zm4 0a1 1 0 0 1-2 0V8a1 1 0 0 1 2 0v8Z" /> | ||
| </svg></value> | ||
| </data> | ||
| <data name="Filter" xml:space="preserve"> | ||
| <value><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 20 20" fill="currentColor"> | ||
| <path fill-rule="evenodd" | ||
| d="M3 3a1 1 0 011-1h12a1 1 0 011 1v3a1 1 0 01-.293.707L12 11.414V15a1 1 0 01-.293.707l-2 2A1 1 0 018 17v-5.586L3.293 | ||
| 6.707A1 1 0 013 6V3z" | ||
| clip-rule="evenodd"></path> | ||
| </svg></value> | ||
| </data> | ||
| <data name="Home" xml:space="preserve"> | ||
| <value><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6"> | ||
| <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25" /> | ||
| </svg></value> | ||
| </data> | ||
| <data name="InformationFilled" xml:space="preserve"> | ||
| <value><svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20"> | ||
| <path | ||
| d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5ZM9.5 4a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM12 15H8a1 1 0 0 1 | ||
| 0-2h1v-3H8a1 1 0 0 1 0-2h2a1 1 0 0 1 1 1v4h1a1 1 0 0 1 0 2Z"> | ||
| </path> | ||
| </svg></value> | ||
| </data> | ||
| <data name="Plus" xml:space="preserve"> | ||
| <value><svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" | ||
| viewBox="0 0 18 18"> | ||
| <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" | ||
| d="M9 1v16M1 9h16" /> | ||
| </svg></value> | ||
| </data> | ||
| <data name="Search" xml:space="preserve"> | ||
| <value><svg aria-hidden="true" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> | ||
| <path fill-rule="evenodd" clip-rule="evenodd" | ||
| d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 | ||
| 8z"> | ||
| </path> | ||
| </svg></value> | ||
| </data> | ||
| <data name="Settings" xml:space="preserve"> | ||
| <value><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="mr-2 w-4 h-4" | ||
| aria-hidden="true"> | ||
| <path fill-rule="evenodd" clip-rule="evenodd" | ||
| d="M11.828 2.25c-.916 0-1.699.663-1.85 1.567l-.091.549a.798.798 0 01-.517.608 7.45 7.45 0 00-.478.198.798.798 0 | ||
| 01-.796-.064l-.453-.324a1.875 1.875 0 00-2.416.2l-.243.243a1.875 1.875 0 00-.2 2.416l.324.453a.798.798 0 01.064.796 | ||
| 7.448 7.448 0 00-.198.478.798.798 0 01-.608.517l-.55.092a1.875 1.875 0 00-1.566 1.849v.344c0 .916.663 1.699 1.567 | ||
| 1.85l.549.091c.281.047.508.25.608.517.06.162.127.321.198.478a.798.798 0 01-.064.796l-.324.453a1.875 1.875 0 00.2 | ||
| 2.416l.243.243c.648.648 1.67.733 2.416.2l.453-.324a.798.798 0 | ||
| 01.796-.064c.157.071.316.137.478.198.267.1.47.327.517.608l.092.55c.15.903.932 1.566 1.849 1.566h.344c.916 0 | ||
| 1.699-.663 1.85-1.567l.091-.549a.798.798 0 01.517-.608 7.52 7.52 0 00.478-.198.798.798 0 01.796.064l.453.324a1.875 | ||
| 1.875 0 002.416-.2l.243-.243c.648-.648.733-1.67.2-2.416l-.324-.453a.798.798 0 | ||
| 01-.064-.796c.071-.157.137-.316.198-.478.1-.267.327-.47.608-.517l.55-.091a1.875 1.875 0 | ||
| 001.566-1.85v-.344c0-.916-.663-1.699-1.567-1.85l-.549-.091a.798.798 0 01-.608-.517 7.507 7.507 0 | ||
| 00-.198-.478.798.798 0 01.064-.796l.324-.453a1.875 1.875 0 00-.2-2.416l-.243-.243a1.875 1.875 0 | ||
| 00-2.416-.2l-.453.324a.798.798 0 01-.796.064 7.462 7.462 0 00-.478-.198.798.798 0 01-.517-.608l-.091-.55a1.875 1.875 | ||
| 0 00-1.85-1.566h-.344zM12 15.75a3.75 3.75 0 100-7.5 3.75 3.75 0 000 7.5z"> | ||
| </path> | ||
| </svg></value> | ||
| </data> | ||
| <data name="Spinner" xml:space="preserve"> | ||
| <value>Spinner</value> | ||
| </data> | ||
| </root> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.