<?xml version="1.0" encoding="utf-8" ?>
<ContentView
    x:Class="SeriesTracker.Controls.MaterialEntry"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:controls="clr-namespace:SeriesTracker.Controls"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
    x:Name="this">
    <Grid WidthRequest="200">
        <Label
            x:Name="MELabel"
            BackgroundColor="{AppThemeBinding Light=#ffffff,
                                              Dark=#121212}"
            FontSize="13"
            HorizontalOptions="Center"
            InputTransparent="True"
            Text="{Binding Source={x:Reference this}, Path=Label}"
            TextColor="{AppThemeBinding Light=#121212,
                                        Dark={StaticResource Gray400}}"
            VerticalOptions="Center">
            <Label.Triggers>
                <DataTrigger
                    Binding="{Binding Source={x:Reference this}, Path=HasError}"
                    TargetType="Label"
                    Value="True">
                    <Setter Property="TextColor" Value="#E24750" />
                </DataTrigger>
            </Label.Triggers>
        </Label>
        <Border
            x:Name="warning"
            BackgroundColor="{AppThemeBinding Light=#ffffff,
                                              Dark=#121212}"
            HeightRequest="21"
            IsVisible="{Binding Source={x:Reference this}, Path=HasError}"
            StrokeShape="RoundRectangle 50"
            WidthRequest="21">
            <Image
                HeightRequest="21"
                Source="exclamation.png"
                WidthRequest="21">
                <Image.Behaviors>
                    <toolkit:IconTintColorBehavior TintColor="#E24750" />
                </Image.Behaviors>
            </Image>
        </Border>
        <Border
            x:Name="MEBorder"
            BackgroundColor="Transparent"
            HorizontalOptions="Center"
            Stroke="{AppThemeBinding Light=#121212,
                                     Dark={StaticResource Gray400}}"
            StrokeShape="RoundRectangle 5"
            VerticalOptions="Center">
            <Border.Triggers>
                <DataTrigger
                    Binding="{Binding Source={x:Reference MEEntry}, Path=IsFocused}"
                    TargetType="Border"
                    Value="True">
                    <Setter Property="StrokeThickness" Value="2" />
                </DataTrigger>
                <DataTrigger
                    Binding="{Binding Source={x:Reference MEEntry}, Path=IsFocused}"
                    TargetType="Border"
                    Value="False">
                    <Setter Property="StrokeThickness" Value="1" />
                </DataTrigger>
            </Border.Triggers>
            <Border.Padding>
                <OnPlatform x:TypeArguments="Thickness">
                    <On Platform="Android" Value="10,0,10,0" />
                </OnPlatform>
            </Border.Padding>
            <controls:BorderlessEntry
                x:Name="MEEntry"
                Completed="MEEntry_Completed"
                Focused="MEEntry_Focused"
                HeightRequest="{OnPlatform iOS=45,
                                           MacCatalyst=45}"
                HorizontalOptions="Center"
                HorizontalTextAlignment="Center"
                Keyboard="Numeric"
                Loaded="MEEntry_Loaded"
                MaxLength="4"
                Text="{Binding Source={x:Reference this}, Path=Text}"
                TextChanged="MEEntry_TextChanged"
                TextColor="{AppThemeBinding Light={StaticResource Primary},
                                            Dark={StaticResource PrimaryDark}}"
                Unfocused="MEEntry_Unfocused"
                VerticalOptions="Center"
                WidthRequest="110">
                <controls:BorderlessEntry.Margin>
                    <OnPlatform x:TypeArguments="Thickness">
                        <On Platform="iOS" Value="20,0,20,0" />
                        <On Platform="MacCatalyst" Value="20,0,20,0" />
                    </OnPlatform>
                </controls:BorderlessEntry.Margin>

            </controls:BorderlessEntry>
        </Border>
    </Grid>
</ContentView>
