@namespace Connected.Components
@using System.Globalization;
@inherits Chart

<svg @attributes="UserAttributes" class="mud-chart-line mud-ltr" width="@ChartParent?.Width" height="@ChartParent?.Height" viewBox="0 0 650 350">
    <g class="mud-charts-grid">
        <g class="mud-charts-gridlines-yaxis">
            @foreach (var horizontalLine in _horizontalLines)
            {
                <path stroke="#e0e0e0" stroke-width="0.3" d="@horizontalLine.Data"></path>
            }
        </g>
        @if (ChartParent?.ChartOptions.XAxisLines==true)
        {
            <g class="mud-charts-gridlines-xaxis-lines">
                @foreach (var verticalLine in _verticalLines)
                {
                    <path stroke="gray" stroke-width="0.3" d="@verticalLine.Data"></path>
                }
            </g>
        }
    </g>
    <g class="mud-charts-yaxis">
        @foreach (var horizontalLineValue in _horizontalValues)
        {
            @((MarkupString)$"<text x='{horizontalLineValue.X.ToString(CultureInfo.InvariantCulture)}' y='{horizontalLineValue.Y.ToString(CultureInfo.InvariantCulture)}' font-size='12px' text-anchor='end' dominant-baseline='auto'>{horizontalLineValue.Value.ToString(CultureInfo.InvariantCulture)}</text>")
        }
    </g>
    <g class="mud-charts-xaxis">
        @foreach (var verticalLineValue in _verticalValues)
        {
            @((MarkupString)$"<text x='{verticalLineValue.X.ToString(CultureInfo.InvariantCulture)}' y='{verticalLineValue.Y.ToString(CultureInfo.InvariantCulture)}' font-size='12px' text-anchor='middle'>{verticalLineValue.Value.ToString(CultureInfo.InvariantCulture)}</text>")
        }
    </g>
    <g class="mud-charts-bar-series">
        @foreach (var bar in _bars)
        {
            <path class="mud-chart-bar" @onclick="() => SelectedIndex = bar.Index"  fill="@(ChartParent.ChartOptions.ChartPalette.GetValue(bar.Index % ChartOptions.ChartPalette.Count()))" stroke="@(ChartParent.ChartOptions.ChartPalette.GetValue(bar.Index % ChartOptions.ChartPalette.Count()))" stroke-width="8" d="@bar.Data"></path>
        }
    </g>


	@ChartParent?.CustomGraphics
</svg>
<Legend Data="@_legends" />