< Summary

Information
Class: Chronicis.Client.Components.Articles.MarkdownToolbar
Assembly: Chronicis.Client
File(s): /home/runner/work/chronicis/chronicis/src/Chronicis.Client/Components/Articles/MarkdownToolbar.razor
Line coverage
0%
Covered lines: 0
Uncovered lines: 29
Coverable lines: 29
Total lines: 143
Line coverage: 0%
Branch coverage
N/A
Covered branches: 0
Total branches: 0
Branch coverage: N/A
Method coverage

Feature is only available for sponsors

Upgrade to PRO version

Metrics

MethodBranch coverage Crap Score Cyclomatic complexity Line coverage
get_OnInsertMarkdown()100%210%
get_IsPreviewMode()100%210%
get_OnTogglePreview()100%210%
InsertSyntax(...)100%210%
InsertTable()100%210%

File(s)

/home/runner/work/chronicis/chronicis/src/Chronicis.Client/Components/Articles/MarkdownToolbar.razor

#LineLine coverage
 1@* MarkdownToolbar.razor *@
 2
 3<div class="markdown-toolbar">
 4    <MudButtonGroup Variant="Variant.Text" Size="Size.Small" Class="toolbar-group">
 5        <!-- Text Formatting -->
 6        <MudTooltip Text="Bold">
 7            <MudIconButton Icon="@Icons.Material.Filled.FormatBold"
 08                           OnClick="@(() => InsertSyntax("**", "**", "bold text"))" />
 9        </MudTooltip>
 10
 11        <MudTooltip Text="Italic">
 12            <MudIconButton Icon="@Icons.Material.Filled.FormatItalic"
 013                           OnClick="@(() => InsertSyntax("*", "*", "italic text"))" />
 14        </MudTooltip>
 15
 16        <MudTooltip Text="Strikethrough">
 17            <MudIconButton Icon="@Icons.Material.Filled.FormatStrikethrough"
 018                           OnClick="@(() => InsertSyntax("~~", "~~", "strikethrough"))" />
 19        </MudTooltip>
 20
 21        <MudDivider Vertical="true" FlexItem="true" />
 22
 23        <!-- Headers -->
 24        <MudTooltip Text="Heading 1">
 25            <MudIconButton Icon="@Icons.Material.Filled.LooksOne"
 026                           OnClick="@(() => InsertSyntax("# ", "", "Heading 1"))" />
 27        </MudTooltip>
 28
 29        <MudTooltip Text="Heading 2">
 30            <MudIconButton Icon="@Icons.Material.Filled.LooksTwo"
 031                           OnClick="@(() => InsertSyntax("## ", "", "Heading 2"))" />
 32        </MudTooltip>
 33
 34        <MudTooltip Text="Heading 3">
 35            <MudIconButton Icon="@Icons.Material.Filled.Looks3"
 036                           OnClick="@(() => InsertSyntax("### ", "", "Heading 3"))" />
 37        </MudTooltip>
 38
 39        <MudDivider Vertical="true" FlexItem="true" />
 40
 41        <!-- Lists -->
 42        <MudTooltip Text="Bullet List">
 43            <MudIconButton Icon="@Icons.Material.Filled.FormatListBulleted"
 044                           OnClick="@(() => InsertSyntax("- ", "", "List item"))" />
 45        </MudTooltip>
 46
 47        <MudTooltip Text="Numbered List">
 48            <MudIconButton Icon="@Icons.Material.Filled.FormatListNumbered"
 049                           OnClick="@(() => InsertSyntax("1. ", "", "List item"))" />
 50        </MudTooltip>
 51
 52        <MudTooltip Text="Task List">
 53            <MudIconButton Icon="@Icons.Material.Filled.CheckBox"
 054                           OnClick="@(() => InsertSyntax("- [ ] ", "", "Task"))" />
 55        </MudTooltip>
 56
 57        <MudDivider Vertical="true" FlexItem="true" />
 58
 59        <!-- Special Elements -->
 60        <MudTooltip Text="Link">
 61            <MudIconButton Icon="@Icons.Material.Filled.Link"
 062                           OnClick="@(() => InsertSyntax("[", "](url)", "link text"))" />
 63        </MudTooltip>
 64
 65        <MudTooltip Text="Image">
 66            <MudIconButton Icon="@Icons.Material.Filled.Image"
 067                           OnClick="@(() => InsertSyntax("![", "](image-url)", "alt text"))" />
 68        </MudTooltip>
 69
 70        <MudTooltip Text="Code Block">
 71            <MudIconButton Icon="@Icons.Material.Filled.Code"
 072                           OnClick="@(() => InsertSyntax("```\n", "\n```", "code"))" />
 73        </MudTooltip>
 74
 75        <MudTooltip Text="Inline Code">
 76            <MudIconButton Icon="@Icons.Material.Filled.DataObject"
 077                           OnClick="@(() => InsertSyntax("`", "`", "code"))" />
 78        </MudTooltip>
 79
 80        <MudTooltip Text="Quote">
 81            <MudIconButton Icon="@Icons.Material.Filled.FormatQuote"
 082                           OnClick="@(() => InsertSyntax("> ", "", "Quote"))" />
 83        </MudTooltip>
 84
 85        <MudTooltip Text="Horizontal Rule">
 86            <MudIconButton Icon="@Icons.Material.Filled.HorizontalRule"
 087                           OnClick="@(() => InsertSyntax("\n---\n", "", ""))" />
 88        </MudTooltip>
 89
 90        <MudDivider Vertical="true" FlexItem="true" />
 91
 92        <!-- Table -->
 93        <MudTooltip Text="Table">
 94            <MudIconButton Icon="@Icons.Material.Filled.TableChart"
 95                           OnClick="InsertTable" />
 96        </MudTooltip>
 97    </MudButtonGroup>
 98
 99    <MudSpacer />
 100
 101    <!-- Preview Toggle -->
 102    <MudButtonGroup Variant="Variant.Text" Size="Size.Small">
 103        <MudTooltip Text="@(IsPreviewMode ? "Edit" : "Preview")">
 104            <MudIconButton Icon="@(IsPreviewMode ? Icons.Material.Filled.Edit : Icons.Material.Filled.Preview)"
 105                           OnClick="OnTogglePreview"
 106                           Color="@(IsPreviewMode ? Color.Primary : Color.Default)" />
 107        </MudTooltip>
 108
 109        <MudTooltip Text="Markdown Guide">
 110            <MudIconButton Icon="@Icons.Material.Filled.Help"
 111                           Href="https://www.markdownguide.org/cheat-sheet/"
 112                           Target="_blank" />
 113        </MudTooltip>
 114    </MudButtonGroup>
 115</div>
 116
 117@code {
 118    [Parameter]
 0119    public EventCallback<string> OnInsertMarkdown { get; set; }
 120
 121    [Parameter]
 0122    public bool IsPreviewMode { get; set; }
 123
 124    [Parameter]
 0125    public EventCallback OnTogglePreview { get; set; }
 126
 127    private void InsertSyntax(string before, string after, string placeholder)
 128    {
 0129        var markdown = before + placeholder + after;
 0130        OnInsertMarkdown.InvokeAsync(markdown);
 0131    }
 132
 133    private void InsertTable()
 134    {
 0135        var table = @"
 0136| Column 1 | Column 2 | Column 3 |
 0137|----------|----------|----------|
 0138| Cell 1   | Cell 2   | Cell 3   |
 0139| Cell 4   | Cell 5   | Cell 6   |
 0140";
 0141        OnInsertMarkdown.InvokeAsync(table);
 0142    }
 143}