using H5.Core;
using Tesserae;
using static H5.Core.dom;
using static Tesserae.UI;

namespace Tesserae.Tests
{
    internal static class App
    {
        private static void Main()
        {
            var btn1 = Button("Feature A").Primary();
            var btn2 = Button("Feature B");
            var btn3 = Button("Feature C");

            var component = VStack().WS().Children(
                TextBlock("Click 'Start Walkthrough' to begin. Step 1 requires clicking Next, Step 2 auto-advances after 5 seconds, and Step 3 finishes with a confirmation toast.").PB(8),
                HStack().Children(btn1, btn2, btn3),
                Button("Start Walkthrough").SetIcon(UIcons.Play).MT(16).OnClick(() =>
                    Teaching()
                       .AddStep(btn1, TextBlock("Step 1: This is Feature A. Click Next to continue."), stepType: Teaching.StepType.NextButton)
                       .AddStep(btn2, TextBlock("Step 2: This is Feature B. It will auto-advance in 5 seconds."), stepType: Teaching.StepType.After5seconds)
                       .AddStep(btn3, TextBlock("Step 3: This is Feature C. You're done!"), stepType: Teaching.StepType.NextButton)
                       .OnComplete(() => Toast().Success("Walkthrough complete!"))
                       .RunNow())
            );

            document.body.style.overflow = "hidden";
            MountCenteredToBody(component);
        }
    }
}