Skip to content

:octocat: GitHub Emoji for C#, ASP.NET Core and Blazor, dotnet tool for the terminal and PowerToys Run plugin

License

Notifications You must be signed in to change notification settings

hlaueriksson/GEmojiSharp

Folders and files

NameName
Last commit message
Last commit date

Latest commit

e184848 Β· Oct 26, 2024
Jun 30, 2024
Aug 24, 2024
Aug 4, 2024
Aug 4, 2024
Oct 31, 2023
Apr 14, 2019
Aug 4, 2024
Jun 22, 2024
Jun 22, 2024
Apr 11, 2022
Jul 10, 2024
Apr 17, 2022
Dec 29, 2022
Sep 2, 2023
Apr 17, 2022
Aug 4, 2024
Sep 2, 2023
Apr 11, 2022
Dec 29, 2022
Jun 30, 2024
Apr 14, 2019
Oct 26, 2024
Jul 10, 2024
Jul 10, 2024
Jul 10, 2024
Apr 10, 2022
Jun 2, 2020
Nov 25, 2020
Jun 30, 2024

Repository files navigation

GEmojiSharp :octocat:

Build status CodeFactor

GEmojiSharp GEmojiSharp.AspNetCore GEmojiSharp.Blazor GEmojiSharp.DotnetTool

GitHub Emoji for C# and .NET:

  • netstandard2.0
  • ASP.NET Core
  • Blazor
  • dotnet tool
  • PowerToys Run plugin
πŸ™ :octopus:
βž• :heavy_plus_sign:
🐈 :cat2:
β©΅
❀️ :heart:

Content

Introduction

Using emojis on GitHub is accomplish with emoji aliases enclosed by colons:

:+1: This PR looks great - it's ready to merge! :shipit:

πŸ‘ This PR looks great - it's ready to merge! :shipit:

GEmojiSharp make this possible in C#. The library contains a static array of all valid emoji in GitHub Flavored Markdown. That is the intersection of the emoji.json database and the API with available emojis.

A visual referense of all GitHub Emoji:

GEmojiSharp

NuGet

GitHub Emoji for C# and .NET πŸ“¦

Static methods:

Emoji.Get(":tada:").Raw; // πŸŽ‰
Emoji.Get("πŸŽ‰").Alias(); // :tada:
Emoji.Raw(":tada:"); // πŸŽ‰
Emoji.Alias("πŸŽ‰"); // :tada:
Emoji.Emojify(":tada: initial commit"); // πŸŽ‰ initial commit
Emoji.Demojify("πŸŽ‰ initial commit"); // :tada: initial commit
Emoji.Find("party popper").First().Raw; // πŸŽ‰
Emoji.Get("✌️").RawSkinToneVariants(); // ✌🏻, ✌🏼, ✌🏽, ✌🏾, ✌🏿

Extension methods:

":tada:".GetEmoji().Raw; // πŸŽ‰
"πŸŽ‰".GetEmoji().Alias(); // :tada:
":tada:".RawEmoji(); // πŸŽ‰
"πŸŽ‰".EmojiAlias(); // :tada:
":tada: initial commit".Emojify(); // πŸŽ‰ initial commit
"πŸŽ‰ initial commit".Demojify(); // :tada: initial commit
"party popper".FindEmojis().First().Raw; // πŸŽ‰

Regular expression pattern to match all emojis:

var text = "Lorem πŸ˜‚πŸ˜‚ ipsum";

var matches = Regex.Matches(text, Emoji.RegexPattern);
string.Join(string.Empty, matches.Select(x => x.Value)); // πŸ˜‚πŸ˜‚

Regex.Replace(text, Emoji.RegexPattern, string.Empty); // Lorem  ipsum

GEmojiSharp.AspNetCore

NuGet

GitHub Emoji for ASP.NET Core πŸ“¦

The package includes:

  • TagHelpers
  • HtmlHelpers

TagHelpers

Update the _ViewImports.cshtml file, to enable tag helpers in all Razor views:

@addTagHelper *, GEmojiSharp.AspNetCore

Use the <emoji> tag or emoji attribute to render emojis:

<span emoji=":tada:"></span>
<emoji>:tada: initial commit</emoji>

Standard emoji characters are rendered like this:

<g-emoji class="g-emoji" alias="tada" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f389.png">πŸŽ‰</g-emoji>

Custom GitHub emojis are rendered as images:

<img class="emoji" title=":octocat:" alt=":octocat:" src="https://github.githubassets.com/images/icons/emoji/octocat.png" height="20" width="20" align="absmiddle">

Use CSS to properly position the custom GitHub emojis images:

.emoji {
    background-color: transparent;
    max-width: none;
    vertical-align: text-top;
}

Use the JavaScript from g-emoji-element to support old browsers.

Backports native emoji characters to browsers that don't support them by replacing the characters with fallback images.

Add a libman.json file:

{
  "version": "1.0",
  "defaultProvider": "cdnjs",
  "libraries": [
    {
      "provider": "unpkg",
      "library": "@github/g-emoji-element@1.2.0",
      "destination": "wwwroot/lib/g-emoji-element/"
    }
  ]
}

And add the script to the _Layout.cshtml file:

<script src="~/lib/g-emoji-element/dist/index.js"></script>

Do you want to use emoji anywhere, on any tag, in the body? Then you can use the BodyTagHelperComponent.

Use any tag to render emojis:

<h1>Hello, :earth_africa:</h1>

Registration via services container:

using GEmojiSharp.AspNetCore;
using Microsoft.AspNetCore.Razor.TagHelpers;

var builder = WebApplication.CreateBuilder(args);

builder.Services.AddRazorPages();
builder.Services.AddTransient<ITagHelperComponent, BodyTagHelperComponent>();

Registration via Razor file:

@page
@model GEmojiSharp.Sample.Web.Pages.ComponentModel
@using Microsoft.AspNetCore.Mvc.Razor.TagHelpers
@using GEmojiSharp.AspNetCore
@inject ITagHelperComponentManager manager;
@{
    ViewData["Title"] = "Component";
    manager.Components.Add(new BodyTagHelperComponent());
}

Registration via Page Model or controller:

using GEmojiSharp.AspNetCore;
using Microsoft.AspNetCore.Mvc.Razor.TagHelpers;
using Microsoft.AspNetCore.Mvc.RazorPages;

namespace GEmojiSharp.Sample.Web.Pages
{
    public class ComponentModel : PageModel
    {
        private readonly ITagHelperComponentManager _tagHelperComponentManager;

        public IndexModel(ITagHelperComponentManager tagHelperComponentManager)
        {
            _tagHelperComponentManager = tagHelperComponentManager;
        }

        public void OnGet()
        {
            _tagHelperComponentManager.Components.Add(new BodyTagHelperComponent());
        }
    }
}

HtmlHelpers

Update the _ViewImports.cshtml file, to enable HTML helpers in all Razor views:

@using GEmojiSharp.AspNetCore

Use the Emoji extension methods to render emojis:

@Html.Emoji(":tada: initial commit")
@Html.Emoji(x => x.Text)

GEmojiSharp.Blazor

NuGet

GitHub Emoji for Blazor πŸ“¦

The package is a Razor class library (RCL) with a Razor component.

Update the _Imports.razor file, to enable the component in all Razor views:

@using GEmojiSharp.Blazor

Note

In a Blazor Web App (.NET 8 or later), the component requires an interactive render mode applied either globally to the app or to the component definition.

Set the global render mode in App.razor:

<Routes @rendermode="InteractiveServer" />

or per page/component:

@rendermode InteractiveServer

Use the <Emoji> component to render emojis:

<Emoji>:tada: initial commit</Emoji>

Standard emoji characters are rendered like this:

<g-emoji class="g-emoji" alias="tada" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f389.png">πŸŽ‰</g-emoji>

Custom GitHub emojis are rendered as images:

<img class="emoji" title=":octocat:" alt=":octocat:" src="https://github.githubassets.com/images/icons/emoji/octocat.png" height="20" width="20" align="absmiddle">

GEmojiSharp.DotnetTool

NuGet

GitHub Emoji dotnet tool 🧰

GEmojiSharp.DotnetTool

Installation

Install:

dotnet tool install -g GEmojiSharp.DotnetTool

Update:

dotnet tool update -g GEmojiSharp.DotnetTool

Uninstall:

dotnet tool uninstall -g GEmojiSharp.DotnetTool

Enable emoji in the terminal:

  • Open Settings / Time & Language / Language / Administrative Language Settings / Change system locale...
  • Check "Beta: Use Unicode UTF-8 for worldwide language support" and click OK
  • Reboot the PC for the change to take effect

Beta: Use Unicode UTF-8 for worldwide language support

Usage

emoji --help
Description:
  GitHub Emoji dotnet tool

Usage:
  emoji [command] [options]

Options:
  --version       Show version information
  -?, -h, --help  Show help and usage information

Commands:
  r, raw <args>       Get raw emojis
  a, alias <args>     Get emoji aliases
  e, emojify <args>   Replace aliases in text with raw emojis
  d, demojify <args>  Replace raw emojis in text with aliases
  export <args>       Export emoji data to <json|toml|xml|yaml>

Raw

emoji raw --help
Description:
  Get raw emojis

Usage:
  emoji raw [<args>...] [options]

Arguments:
  <args>  Find emojis via description, category, alias or tag

Options:
  -st, --skin-tones  Include skin tone variants
  -c, --copy         Copy to clipboard
  -?, -h, --help     Show help and usage information
Examples πŸ’

Get raw emojis:

emoji raw "grinning cat"
emoji raw grinning cat
emoji r grinning cat
😺
😸

Copy to clipboard:

emoji raw "grinning cat" --copy
emoji r grinning cat -c
😺😸

Skin tone variants:

emoji raw "victory" --skin-tones
emoji r victory -st
✌️
✌🏻
✌🏼
✌🏽
✌🏾
✌🏿

Alias

emoji alias --help
Description:
  Get emoji aliases

Usage:
  emoji alias [<args>...] [options]

Arguments:
  <args>  Find emojis via description, category, alias or tag

Options:
  -c, --copy      Copy to clipboard
  -?, -h, --help  Show help and usage information
Examples πŸ’

Get emoji aliases:

emoji alias "grinning cat"
emoji alias grinning cat
emoji a grinning cat
:smiley_cat:
:smile_cat:

Copy to clipboard:

emoji alias "grinning cat" --copy
emoji a grinning cat -c
:smiley_cat::smile_cat:

Emojify

emoji emojify --help
Description:
  Replace aliases in text with raw emojis

Usage:
  emoji emojify [<args>...] [options]

Arguments:
  <args>  A text with emoji aliases

Options:
  -c, --copy      Copy to clipboard
  -?, -h, --help  Show help and usage information
Examples πŸ’

Replace aliases in text with raw emojis:

emoji emojify ":tada: initial commit"
emoji emojify :tada: initial commit
emoji e :tada: initial commit
πŸŽ‰ initial commit

Copy to clipboard:

emoji emojify ":tada: initial commit" --copy
emoji e :tada: initial commit -c

Demojify

emoji demojify --help
Description:
  Replace raw emojis in text with aliases

Usage:
  emoji demojify [<args>...] [options]

Arguments:
  <args>  A text with raw emojis

Options:
  -c, --copy      Copy to clipboard
  -?, -h, --help  Show help and usage information
Examples πŸ’

Replace raw emojis in text with aliases:

emoji demojify "πŸŽ‰ initial commit"
emoji demojify πŸŽ‰ initial commit
emoji d πŸŽ‰ initial commit
:tada: initial commit

Copy to clipboard:

emoji demojify "πŸŽ‰ initial commit" --copy
emoji d πŸŽ‰ initial commit -c

Export

emoji export --help
Description:
  Export emoji data to <json|toml|xml|yaml>

Usage:
  emoji export [<args>...] [options]

Arguments:
  <args>  Find emojis via description, category, alias or tag

Options:
  -f, --format <format>  Format the data as <json|toml|xml|yaml>
  -c, --copy             Copy to clipboard
  -?, -h, --help         Show help and usage information

Formats:

  • json
  • toml
  • xml
  • yaml
Examples πŸ’

Export emoji data to json:

emoji export "grinning cat" --format json
emoji export grinning cat --format json
emoji export grinning cat -f json
emoji export grinning cat
[
  {
    "Raw": "😺",
    "Description": "grinning cat",
    "Category": "Smileys & Emotion",
    "Aliases": [
      "smiley_cat"
    ],
    "Tags": null,
    "UnicodeVersion": "6.0",
    "IosVersion": "6.0",
    "Filename": "1f63a",
    "IsCustom": false
  },
  {
    "Raw": "😸",
    "Description": "grinning cat with smiling eyes",
    "Category": "Smileys & Emotion",
    "Aliases": [
      "smile_cat"
    ],
    "Tags": null,
    "UnicodeVersion": "6.0",
    "IosVersion": "6.0",
    "Filename": "1f638",
    "IsCustom": false
  }
]

Copy to clipboard:

emoji export "grinning cat" --format json --copy
emoji export "grinning cat" -c

GEmojiSharp.PowerToysRun

GitHub Downloads (all assets, all releases) Mentioned in Awesome PowerToys Run Plugins

GitHub Emoji PowerToys Run plugin πŸ—‚οΈπŸ”ŽπŸ”Œ

GEmojiSharp.PowerToysRun

Installation

The plugin is developed and tested with PowerToys v0.83.0.

Install:

  1. Install PowerToys
  2. Exit PowerToys
  3. Download the .zip file from the latest release and extract it to:
    • %LocalAppData%\Microsoft\PowerToys\PowerToys Run\Plugins
  4. Start PowerToys

GEmojiSharp.PowerToysRun

Usage

  1. Open PowerToys Run with alt + space
  2. Type emoji
    • A list of all emojis will be displayed
  3. Continue to type to find emojis via description, category, alias or tag
  4. Use ⬆️ and ⬇️ keys to select an emoji
  5. Press Enter to copy the selected raw emoji to clipboard
  6. Press ctrl + c to copy the selected emoji aliases to clipboard
  7. Press ctrl + Enter to copy the selected raw emoji skin tone variants to clipboard
    • For emoji that supports skin tone modifiers

Emojify:

  • You can paste a text containing emoji aliases to replace them with raw emojis

Demojify:

  • You can paste a text containing raw emojis to replace them with aliases

Configuration

Change action keyword:

  1. Open PowerToys
  2. Select PowerToys Run
  3. Scroll down to Plugins
  4. Expand GEmojiSharp
  5. Change Direct activation command

GEmojiSharp.PowerToysRun

Samples

The samples folder contains...

  • GEmojiSharp.Sample.BlazorWeb, a Blazor Web App (InteractiveServer render mode)
  • GEmojiSharp.Sample.BlazorWebAssembly, a Blazor WebAssembly App
  • GEmojiSharp.Sample.Web, a ASP.NET Core Web App (Razor Pages)

The Blazor WebAssembly app is showcased here:

GEmojiSharp.Sample.BlazorWebAssembly

Attribution

Repositories consulted when building this: