{"id":32418281,"url":"https://github.com/drualcman/blazorbasics.richtexteditor","last_synced_at":"2025-10-25T16:52:32.236Z","repository":{"id":177755779,"uuid":"660848514","full_name":"drualcman/BlazorBasics.RichTextEditor","owner":"drualcman","description":"A simple Rich Text Editor for Blazor Server or Blazor WebAssembly applications.","archived":false,"fork":false,"pushed_at":"2025-10-22T02:57:36.000Z","size":125,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-10-22T04:34:27.752Z","etag":null,"topics":["blazor","blazor-server","blazor-webassembly","rich-text-editor"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/drualcman.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":"FUNDING.yml","license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null},"funding":{"github":null,"patreon":null,"open_collective":null,"ko_fi":"drualcman","tidelift":null,"community_bridge":null,"liberapay":"drualcman","issuehunt":"drualcman","otechie":null,"custom":null}},"created_at":"2023-07-01T02:45:25.000Z","updated_at":"2025-10-22T02:57:39.000Z","dependencies_parsed_at":null,"dependency_job_id":"99ad9cb3-1a74-4d0a-acfe-34c47fa0e410","html_url":"https://github.com/drualcman/BlazorBasics.RichTextEditor","commit_stats":null,"previous_names":["drualcman/blazorbasics.richtexteditor"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/drualcman/BlazorBasics.RichTextEditor","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/drualcman%2FBlazorBasics.RichTextEditor","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/drualcman%2FBlazorBasics.RichTextEditor/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/drualcman%2FBlazorBasics.RichTextEditor/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/drualcman%2FBlazorBasics.RichTextEditor/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/drualcman","download_url":"https://codeload.github.com/drualcman/BlazorBasics.RichTextEditor/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/drualcman%2FBlazorBasics.RichTextEditor/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":280987563,"owners_count":26425343,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-25T02:00:06.499Z","response_time":81,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["blazor","blazor-server","blazor-webassembly","rich-text-editor"],"created_at":"2025-10-25T16:52:26.593Z","updated_at":"2025-10-25T16:52:32.219Z","avatar_url":"https://github.com/drualcman.png","language":"JavaScript","funding_links":["https://ko-fi.com/drualcman","https://liberapay.com/drualcman","https://issuehunt.io/r/drualcman"],"categories":[],"sub_categories":[],"readme":"[![Nuget](https://img.shields.io/nuget/v/BlazorBasics.RichTextEditor?style=for-the-badge)](https://www.nuget.org/packages/BlazorBasics.RichTextEditor)\n[![Nuget](https://img.shields.io/nuget/dt/BlazorBasics.RichTextEditor?style=for-the-badge)](https://www.nuget.org/packages/BlazorBasics.RichTextEditor)\n\n# Description\nA simple Rich Text Editor for Blazor Server or Blazor WebAssembly applications. This rich text editor is based in [Quill](https://quilljs.com/) JavaScript.\n\n# How to use\nNugget installation\n\n```PM\u003e Install-Package BlazorBasics.RichTextEditor```\n\nOr clone the [repository](https://github.com/drualcman/BlazorBasics.RichTextEditor) and add the project to your solution.\u003cbr/\u003e\nAdd the component where you want to show rich text editor like this example:\n\n``` RAZOR\n\n\u003cRichTextEditorComponent Html=HtmlMarkupString OnSave=\"SaveHtml\"/\u003e\n\n@code{\n\tMarkupString HtmlMarkupString = \n\t\tnew MarkupString(\"\u003cp\u003eA long time ago in a galaxi far, far away...\u003c/p\u003e\");\n\t\n\tvoid SaveHtml(string html){\n\t\t//process your data\n\t}\n}\n```\n\n## Options\n* Show/Hide Save button into the menu\n* Disable paste images if you don't like to allow base64 image insert into the document\n* Show/Hide Images button to allow or not user can insert images\n* You can use your API to upload images\n* \n## Upload Images to the API\nYou will receive a object from the editor like\n\n``` CSHARP\npublic class FileUpload\n{\n    public string FileName { get; set; }\n    public byte[] FileBytes { get; set; }\n\n    public FileUpload(string fileName, byte[] fileBytes)\n    {\n        FileName = fileName;\n        FileBytes = fileBytes;\n    }\n}\n```\n\nThen need a Task to return a string with the URL about where is located the image. If don't return a url and return string.Empty editor add the image into de document like a image/base64 but you also can manage the image, to register in a database for example.\n\n``` RAZOR\n\u003cRichTextEditorComponent Html=HtmlMarkupString OnSave=\"SaveHtml\" UploadFile=UploadFile/\u003e\n\n@code{\n\tMarkupString HtmlMarkupString = \n\t\tnew MarkupString(\"\u003cp\u003eA long time ago in a galaxi far, far away...\u003c/p\u003e\");\n\t\n\tvoid SaveHtml(string html){\n\t\t//process your data\n\t}\n\n    async Task\u003cstring\u003e UploadFile(FileUpload file)\n    {          \n        string url = await YourApiToUploadFiles.SaveFile(file);\n\t\treturn url;\n    }\n}\n```\n\n## Disable upload and paste images\n\n``` RAZOR\n\u003cRichTextEditorComponent Html=HtmlMarkupString OnSave=\"SaveHtml\" HideImageButton=true AvoidPasteImages=true/\u003e\n\n@code{\n\tMarkupString HtmlMarkupString = \n\t\tnew MarkupString(\"\u003cp\u003eA long time ago in a galaxi far, far away...\u003c/p\u003e\");\n\t\n\tvoid SaveHtml(string html){\n\t\t//process your data\n\t}\n}\n```\n\n## If you want to use a external save button\n\nIf you want to use external save button it's much better use the property HideSaveButton=true to avoid user can see 2 save buttons, into the editor and outside the editor\n\n``` RAZOR\n\u003cRichTextEditorComponent Html=HtmlMarkupString OnSave=\"SaveHtml\" @ref=Editor HideSaveButton=true /\u003e\n\n\u003cbutton @onclick=Save\u003eSave\u003c/button\u003e\n\n@code{\n\tRichTextEditorComponent Editor;\n\tMarkupString HtmlMarkupString = \n\t\tnew MarkupString(\"\u003cp\u003eA long time ago in a galaxi far, far away...\u003c/p\u003e\");\n\tstring Html;\n\n\tvoid SaveHtml(string html){\n\t\tHtml = html;\n\t}\n\n\tasync Task Save(){\n\t\tawait Editor.GetContent();\n\t\t//process your data\n\t}\n}\n```\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdrualcman%2Fblazorbasics.richtexteditor","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdrualcman%2Fblazorbasics.richtexteditor","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdrualcman%2Fblazorbasics.richtexteditor/lists"}