<UserControl
    x:Class="Bili.App.Controls.HorizontalRepeaterView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:Microsoft.UI.Xaml.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="using:Bili.App.Controls"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    d:DesignHeight="300"
    d:DesignWidth="400"
    IsTabStop="False"
    SizeChanged="OnSizeChanged"
    mc:Ignorable="d">

    <Grid XYFocusKeyboardNavigation="Enabled">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <Grid Margin="0,0,0,4" ColumnSpacing="12">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <TextBlock
                Style="{StaticResource SubtitleTextBlockStyle}"
                Margin="0,0,0,8"
                HorizontalAlignment="Left"
                VerticalAlignment="Center"
                FontSize="16"
                Text="{x:Bind Header, Mode=OneWay}"
                TextTrimming="CharacterEllipsis"
                Visibility="{x:Bind HeaderVisibility, Mode=OneWay}" />
            <ContentPresenter
                Grid.Column="1"
                HorizontalAlignment="Right"
                VerticalAlignment="Center"
                HorizontalContentAlignment="Stretch"
                VerticalContentAlignment="Center"
                Content="{x:Bind AdditionalContent, Mode=OneWay}" />
        </Grid>

        <Grid
            x:Name="WideContainer"
            Grid.Row="1"
            CornerRadius="{StaticResource ControlCornerRadius}">
            <ScrollViewer
                x:Name="WideScrollViewer"
                HorizontalScrollBarVisibility="Hidden"
                HorizontalScrollMode="Enabled"
                IsTabStop="False"
                VerticalScrollBarVisibility="Hidden"
                VerticalScrollMode="Disabled"
                ViewChanged="OnWideScrollViewerChanged">
                <controls:ItemsRepeater
                    x:Name="BannerRepeater"
                    Margin="0,4"
                    ItemTemplate="{x:Bind WideItemTemplate, Mode=OneWay}"
                    ItemsSource="{x:Bind ItemsSource, Mode=OneWay}">
                    <controls:ItemsRepeater.Layout>
                        <controls:StackLayout Orientation="Horizontal" Spacing="12" />
                    </controls:ItemsRepeater.Layout>
                </controls:ItemsRepeater>
            </ScrollViewer>

            <local:OffsetButton
                x:Name="LeftOffsetButton"
                HorizontalAlignment="Left"
                Click="OnLeftOffsetButtonClick"
                Glyph="&#xEDD9;" />

            <local:OffsetButton
                x:Name="RightOffsetButton"
                HorizontalAlignment="Right"
                Click="OnRightOffsetButtonClick"
                Glyph="&#xEDDA;" />
        </Grid>

        <Grid
            x:Name="NarrowContainer"
            Grid.Row="1"
            Visibility="Collapsed">
            <FlipView
                Height="{x:Bind NarrowHeight, Mode=OneWay}"
                Background="Transparent"
                ItemTemplate="{x:Bind NarrowItemTemplate, Mode=OneWay}"
                ItemsSource="{x:Bind ItemsSource, Mode=OneWay}">
                <FlipView.ItemContainerStyle>
                    <Style TargetType="FlipViewItem">
                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                    </Style>
                </FlipView.ItemContainerStyle>
            </FlipView>
        </Grid>
    </Grid>
</UserControl>
