<TelerikWindow @bind-Top="@Top" @bind-Left="@Left" Centered="@Centered" @bind-Visible="@Visible">
    <WindowTitle>
        Title
    </WindowTitle>
    <WindowContent>
        Drag or resize the Window and center it afterwards...
    </WindowContent>
</TelerikWindow>

<TelerikButton OnClick="@( () => Visible = !Visible )">Toggle Window</TelerikButton>
<TelerikButton OnClick="@OnCenterClick">Center</TelerikButton>

@code {
    string Top { get; set; }
    string Left { get; set; }
    bool Centered = false;
    bool Visible { get; set; } = true;

    async Task OnCenterClick()
    {
        Visible = false;
        await Task.Delay(1);

        Top = Left = string.Empty;
        Visible = true;
    }
}

<TelerikWindow Left="@TheLeft" Top="@TheTop" Draggable="true"
               LeftChanged="@LeftChangedHandler" TopChanged="@TopChangedHandler"
               Visible="true" Width="400px" Height="300px">
    <WindowTitle>Drag me!</WindowTitle>
    <WindowContent>When using Left and Top, make sure to update them in the view-model.</WindowContent>
    <WindowActions>
        <WindowAction Name="Minimize"></WindowAction>
        <WindowAction Name="Maximize"></WindowAction>
    </WindowActions>
</TelerikWindow>

@code{
    string TheLeft { get; set; } = "50px";
    string TheTop { get; set; } = "50px";

    async Task LeftChangedHandler(string currLeft)
    {
        float leftValue = float.Parse(currLeft.Replace("px", ""));
        Console.WriteLine("left " + leftValue);
        //left boundary
        if (leftValue < 0)
        {
            currLeft = "0px";
        }
        //right boundary - replace hardcoded values with current values from the viewport size
        //and take into account the dimensions of your window. This sample hardcodes values for brevity and clarity
        //you may find useful packages like this to get the viewport size https://www.nuget.org/packages/BlazorPro.BlazorSize/
        if (leftValue > 1000)
        {
            currLeft = "1000px";
        }


        TheLeft = currLeft;

        await DelayedRender();
    }

    async Task TopChangedHandler(string currTop)
    {
        float topValue = float.Parse(currTop.Replace("px", ""));
        Console.WriteLine("top: " + topValue);

        //top boundary
        if (topValue < 0)
        {
            currTop = "0px";
        }
        //bottom boundary - replace hardcoded values with current values from the viewport size
        //and take into account the dimensions of your window
        if (topValue > 600)
        {
            currTop = "600px";
        }

        TheTop = currTop;

        await DelayedRender();
    }

    async Task DelayedRender()
    {
        await Task.Run(async () =>
        {
            await Task.Delay(30);
            await InvokeAsync(StateHasChanged);
        });
    }
}

<TelerikContextMenu Data="@MenuItems" Selector="#menu-target"
                    Class="menu-on-top" />

<style>
    .menu-on-top,
    .k-animation-container:has(.menu-on-top) {
        z-index: 11000 !important;
    }
</style>

<TelerikWindow Width="240px" Height="160px"
               Top="100px" Left="100px"
               Visible="true" Modal="true">
    <WindowTitle>Window</WindowTitle>
    <WindowContent>
        <div style="height:60px;border: 1px solid;"
             id="menu-target">Right-click me</div>
    </WindowContent>
</TelerikWindow>

@code {
    List<ContextMenuItem> MenuItems { get; set; } = new List<ContextMenuItem>();

    protected override void OnInitialized()
    {
        for (int i = 1; i <= 7; i++)
        {
            MenuItems.Add(new ContextMenuItem() { Text = $"Menu item {i}" });
        }

        base.OnInitialized();
    }

    public class ContextMenuItem
    {
        public string Text { get; set; } = string.Empty;
    }
}

<TelerikWindow Width="80%"
                Height="auto"
                Top="404px"
                State="WindowState.Minimized"
                Left="200px"                        
                Class="myClass"
                Visible="true"
><WindowTitle>My Title</WindowTitle><WindowActions><WindowAction Name="Minimize"></WindowAction></WindowActions><WindowContent><h1>My Content</h1></WindowContent></TelerikWindow>
 
Window starts out minimized, with proper width, height, top and left.
Clicking maximize button clears the top and left property, and resets position every time you open/close.
Click/dragging to move the window will reapply top/left property, and then maximize/minimize works properly.
 
If you change the state to to WindowState.Maximized, it has the correct top/left property, but resets the width/height properties.
Window is not draggable.
 
Not setting the State at all is the only way to have proper behavior.
    
    
        
    
    
        
    

<TelerikWindow Visible="true" Class="workaround-for-touch-drag">
    <WindowTitle>the title</WindowTitle>
    <WindowContent>the content</WindowContent>
</TelerikWindow>

<style>
    .workaround-for-touch-drag {
        touch-action: none;
    }
</style>