<ResourceDictionary
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:Avalonia.Controls"
    xmlns:converters="using:Avalonia.Controls.Converters"
    x:CompileBindings="True">
    <!--  Add Resources Here  -->
    <converters:EnumToBoolConverter x:Key="EnumToBoolConverter" />
    <converters:CornerRadiusToDoubleConverter x:Key="TopLeftCornerRadiusConverter" Corner="TopLeft" />
    <converters:CornerRadiusToDoubleConverter x:Key="BottomRightCornerRadiusConverter" Corner="BottomRight" />


    <ControlTheme x:Key="{x:Type ColorSpectrum}" TargetType="ColorSpectrum">
        <Setter Property="CornerRadius" Value="6" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ColorSpectrum}">
                    <Panel
                        x:Name="PART_LayoutRoot"
                        HorizontalAlignment="Stretch"
                        VerticalAlignment="Stretch">
                        <Panel
                            x:Name="PART_SizingPanel"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            ClipToBounds="True">
                            <Rectangle
                                x:Name="PART_SpectrumRectangle"
                                HorizontalAlignment="Stretch"
                                VerticalAlignment="Stretch"
                                IsHitTestVisible="False"
                                IsVisible="{TemplateBinding Shape,
                                                            Converter={StaticResource EnumToBoolConverter},
                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Box}}"
                                RadiusX="{TemplateBinding CornerRadius,
                                                          Converter={StaticResource TopLeftCornerRadiusConverter}}"
                                RadiusY="{TemplateBinding CornerRadius,
                                                          Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                            <Rectangle
                                x:Name="PART_SpectrumOverlayRectangle"
                                HorizontalAlignment="Stretch"
                                VerticalAlignment="Stretch"
                                IsHitTestVisible="False"
                                IsVisible="{TemplateBinding Shape,
                                                            Converter={StaticResource EnumToBoolConverter},
                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Box}}"
                                RadiusX="{TemplateBinding CornerRadius,
                                                          Converter={StaticResource TopLeftCornerRadiusConverter}}"
                                RadiusY="{TemplateBinding CornerRadius,
                                                          Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                            <Ellipse
                                x:Name="PART_SpectrumEllipse"
                                HorizontalAlignment="Stretch"
                                VerticalAlignment="Stretch"
                                IsHitTestVisible="False"
                                IsVisible="{TemplateBinding Shape,
                                                            Converter={StaticResource EnumToBoolConverter},
                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Ring}}" />
                            <Ellipse
                                x:Name="PART_SpectrumOverlayEllipse"
                                HorizontalAlignment="Stretch"
                                VerticalAlignment="Stretch"
                                IsHitTestVisible="False"
                                IsVisible="{TemplateBinding Shape,
                                                            Converter={StaticResource EnumToBoolConverter},
                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Ring}}" />
                            <Canvas
                                x:Name="PART_InputTarget"
                                HorizontalAlignment="Stretch"
                                VerticalAlignment="Stretch"
                                Background="Transparent">
                                <!--  Note: ToolTip.VerticalOffset is for touch devices to keep the tip above fingers  -->
                                <Panel
                                    x:Name="PART_SelectionEllipsePanel"
                                    ToolTip.Placement="Top"
                                    ToolTip.VerticalOffset="-10">
                                    <Ellipse
                                        x:Name="FocusEllipse"
                                        Margin="-2"
                                        HorizontalAlignment="Stretch"
                                        VerticalAlignment="Stretch"
                                        IsHitTestVisible="False"
                                        StrokeThickness="2" />
                                    <Ellipse
                                        x:Name="SelectionEllipse"
                                        HorizontalAlignment="Stretch"
                                        VerticalAlignment="Stretch"
                                        IsHitTestVisible="False"
                                        StrokeThickness="2" />
                                    <ToolTip.Tip>
                                        <!--  Set in code-behind  -->
                                    </ToolTip.Tip>
                                </Panel>
                            </Canvas>
                            <Rectangle
                                x:Name="BorderRectangle"
                                HorizontalAlignment="Stretch"
                                VerticalAlignment="Stretch"
                                IsHitTestVisible="False"
                                IsVisible="{TemplateBinding Shape,
                                                            Converter={StaticResource EnumToBoolConverter},
                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Box}}"
                                RadiusX="{TemplateBinding CornerRadius,
                                                          Converter={StaticResource TopLeftCornerRadiusConverter}}"
                                RadiusY="{TemplateBinding CornerRadius,
                                                          Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                            <Ellipse
                                x:Name="BorderEllipse"
                                HorizontalAlignment="Stretch"
                                VerticalAlignment="Stretch"
                                IsHitTestVisible="False"
                                IsVisible="{TemplateBinding Shape,
                                                            Converter={StaticResource EnumToBoolConverter},
                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Ring}}" />
                        </Panel>
                    </Panel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>

        <!--  Normal  -->
        <!--  Separating this allows easier customization in applications  -->
        <Style Selector="^ /template/ Ellipse#BorderEllipse,                      ^ /template/ Rectangle#BorderRectangle">
            <Setter Property="Stroke" Value="{DynamicResource ColorSpectrumBorderBrush}" />
            <Setter Property="StrokeThickness" Value="1" />
        </Style>

        <!--  Focus  -->
        <Style Selector="^ /template/ Ellipse#FocusEllipse">
            <Setter Property="IsVisible" Value="False" />
        </Style>
        <Style Selector="^:focus-visible /template/ Ellipse#FocusEllipse">
            <Setter Property="IsVisible" Value="True" />
        </Style>

        <!--  Selector Color  -->
        <Style Selector="^ /template/ Ellipse#FocusEllipse">
            <Setter Property="Stroke" Value="{DynamicResource ColorSliderLightBorderBrush}" />
        </Style>
        <Style Selector="^ /template/ Ellipse#SelectionEllipse">
            <Setter Property="Stroke" Value="{DynamicResource ColorSliderDarkBorderBrush}" />
        </Style>
        <Style Selector="^:light-selector /template/ Ellipse#FocusEllipse">
            <Setter Property="Stroke" Value="{DynamicResource ColorSliderDarkBorderBrush}" />
        </Style>
        <Style Selector="^:light-selector /template/ Ellipse#SelectionEllipse">
            <Setter Property="Stroke" Value="{DynamicResource ColorSliderLightBorderBrush}" />
        </Style>

        <Style Selector="^:pointerover /template/ Ellipse#SelectionEllipse">
            <Setter Property="Opacity" Value="0.7" />
        </Style>
        <Style Selector="^:pointerover:light-selector /template/ Ellipse#SelectionEllipse">
            <Setter Property="Opacity" Value="0.8" />
        </Style>

        <!--  Selector Size  -->
        <Style Selector="^ /template/ Panel#PART_SelectionEllipsePanel">
            <Setter Property="Width" Value="16" />
            <Setter Property="Height" Value="16" />
        </Style>
        <Style Selector="^:large-selector /template/ Panel#PART_SelectionEllipsePanel">
            <Setter Property="Width" Value="48" />
            <Setter Property="Height" Value="48" />
        </Style>
    </ControlTheme>
</ResourceDictionary>
