diff --git a/ReactWithDotNet.WebSite.Test/GlobalUsings.cs b/ReactWithDotNet.WebSite.Test/GlobalUsings.cs deleted file mode 100644 index 783294d5..00000000 --- a/ReactWithDotNet.WebSite.Test/GlobalUsings.cs +++ /dev/null @@ -1,10 +0,0 @@ -global using System; -global using System.Linq.Expressions; -global using ReactWithDotNet; -global using System.Collections.Generic; -global using System.Linq; -global using static ReactWithDotNet.Mixin; -global using static ReactWithDotNet.WebSite.Extensions; -global using ReactWithDotNet.WebSite.Components; -global using Microsoft.VisualStudio.TestTools.UnitTesting; - diff --git a/ReactWithDotNet.WebSite.Test/HtmlToCSharpTests.cs b/ReactWithDotNet.WebSite.Test/HtmlToCSharpTests.cs deleted file mode 100644 index a126cf3e..00000000 --- a/ReactWithDotNet.WebSite.Test/HtmlToCSharpTests.cs +++ /dev/null @@ -1,188 +0,0 @@ -using FluentAssertions; -using static ReactWithDotNet.WebSite.HelperApps.HtmlToReactWithDotNetCsharpCodeConverter; - -namespace ReactWithDotNet.WebSite.Test; - -[TestClass] -public class HtmlToCSharpTests -{ - [TestMethod] - public void _0() - { - Assert(""" -
- """, - """ - new div() - """); - - Assert(""" - xYz1 - """, - """ - new span("a-b c", Color(rgb(28, 32, 37)), BorderRadius(12)) - { - "xYz1" - } - """); - - - Assert(""" - xYz1 - """, - """ - new span("a-b c") - { - "xYz1" - } - """); - - - Assert(""" - xYz1 - """, - """ - new span - { - "xYz1" - } - """); - - - - - Assert(""" - - """, - """ - new a(TargetBlank) - """); - - - Assert(""" - - """, - """ - new a(TargetBlank, Color(rgb(28, 32, 37)), BorderRadius(12)) - """); - - - Assert(""" - - """, - """ - new a(TargetBlank, Aria("hidden", "true"), Data("testid", "AcUnitIcon"), Color(rgb(28, 32, 37)), BorderRadius(12)) - { - "xyz" - } - """); - - - Assert(""" - - """, - """ - new FlexRow(Aria("hidden", "true"), Data("testid", "AcUnitIcon"), Color("blue")) - """); - return; - - static void Assert(string html, string expected) - { - var actual = HtmlToCSharp(html); - - actual.Should().Be(expected); - } - } - - [TestMethod] - public void _1() - { - Assert(""" - - """, - """ - new path(Fill("#010002")) - { - d = "abc" - } - """ - ); - - - Assert(""" - - """, - """ - new FlexRow(Aria("hidden", "true"), Data("testid", "AcUnitIcon"), Color("blue")) - """); - - - - Assert(""" -
- -
- """, - """ - new div(Width(96.7), Padding(1, 2, 3, 4)) - """); - - Assert(""" -
- aB c -
- """, - """ - new InlineFlexColumn(Width(246.7), JustifyContentFlexStart, AlignItemsFlexStart) - { - "aB c" - } - """); - - - Assert(""" -
- aB c -
- xY z -
-
- """, - """ - new InlineFlexColumn("c5 c6", Width(246.7), JustifyContentFlexStart, AlignItemsFlexStart) - { - @" - aB c - ", - new div("c1 c2", Width(96.7), Padding(1, 2, 3, 4)) - { - "xY z" - } - } - """); - - - return; - - static void Assert(string html, string expected) - { - var current = HtmlToCSharp(html); - - current.Should().Be(expected); - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite.Test/ReactWithDotNet.WebSite.Test.csproj b/ReactWithDotNet.WebSite.Test/ReactWithDotNet.WebSite.Test.csproj deleted file mode 100644 index c387e79c..00000000 --- a/ReactWithDotNet.WebSite.Test/ReactWithDotNet.WebSite.Test.csproj +++ /dev/null @@ -1,33 +0,0 @@ - - - - net8.0 - enable - enable - - false - true - - - - - preview - - - - - - - - - all - runtime; build; native; contentfiles; analyzers; buildtransitive - - - - - - - - - diff --git a/ReactWithDotNet.WebSite/BaseClassList.cs b/ReactWithDotNet.WebSite/BaseClassList.cs deleted file mode 100644 index a5399faf..00000000 --- a/ReactWithDotNet.WebSite/BaseClassList.cs +++ /dev/null @@ -1,100 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.MUI.Material; - -namespace ReactWithDotNet.WebSite; - -public abstract class Component : ReactWithDotNet.Component -{ - protected LightTheme Theme => ThemeKey[Context]; - - public StyleModifier BackgroundForPaper => Background(Theme.background_default); - - public StyleModifier BorderForPaper => Border(Solid(1,Theme.grey_200)); - - protected string Asset(string fileName) => $"{Context.wwwroot}/assets/{fileName}"; -} -public abstract class PureComponent : ReactWithDotNet.PureComponent -{ - protected LightTheme Theme => ThemeKey[Context]; - - public StyleModifier BackgroundForPaper => Background(Theme.background_default); - - public StyleModifier BorderForPaper => Border(Solid(1, Theme.grey_200)); - - protected string Asset(string fileName) => $"{Context.wwwroot}/assets/{fileName}"; -} - -public abstract class Component : ReactWithDotNet.Component where TState :class, new() -{ - protected LightTheme Theme => ThemeKey[Context]; - - public StyleModifier BackgroundForPaper => Background(Theme.background_default); - - public StyleModifier BorderForPaper => Border(Solid(1, Theme.grey_200)); - - protected string Asset(string fileName) => $"{Context.wwwroot}/assets/{fileName}"; -} - -static class QueryKey -{ - public static string Page = "p"; - public static string Id = "id"; -} - -public class LightTheme -{ - static readonly IColorPalette P = new ColorPaletteLight(); - - public string pink50 => "#FFF0FB"; - public string pink100=> "#FFE5F8"; - public string pink200=> "#FFD6F3"; - public string pink300=> "#FFC2EE"; - public string pink400=> "#FFA3E5"; - public string pink500=> "#FF7AD9"; - public string pink600=> "#FF4ECD"; - public string pink700=> "#D6009A"; - public string pink800=> "#B80084"; - public string pink900=> "#4D0037"; - - - public string text_primary => P.text_primary; - public string primary_main => P.primary_main; - public string primary_100 => P.primary_100; - public string common_background => P.common_background; - public string background_default => P.background_default; - public string grey_50 => P.grey_50; - public string grey_100 => P.grey_100; - public string grey_200 => P.grey_200; - public string grey_300 => P.grey_300; - public string grey_700 => P.grey_700; - public string primary_700 => P.primary_700; - public string text_secondary => P.text_secondary; - public string EditorBackground => linear_gradientTo("right","bottom", rgb(255, 255, 255), rgb(235, 235, 235)); - - - // B L U E https://tailwindcss.com/docs/customizing-colors - public string Blue50 = "#eff6ff"; - public string Blue100 = "#dbeafe"; - public string Blue200 = "#bfdbfe"; - public string Blue300 = "#93c5fd"; - public string Blue400 = "#60a5fa"; - public string Blue500 = "#3b82f6"; - public string Blue600 = "#2563eb"; - public string Blue700 = "#1d4ed8"; - public string Blue800 = "#1e40af"; - public string Blue900 = "#1e3a8a"; - public string Blue950 = "#172554"; - - // G R A Y https://tailwindcss.com/docs/customizing-colors - public string Gray50 = "#f9fafb"; - public string Gray100 = "#f3f4f6"; - public string Gray200 = "#e5e7eb"; - public string Gray300 = "#d1d5db"; - public string Gray400 = "#9ca3af"; - public string Gray500 = "#6b7280"; - public string Gray600 = "#4b5563"; - public string Gray700 = "#374151"; - public string Gray800 = "#1f2937"; - public string Gray900 = "#111827"; - public string Gray950 = "#030712"; - -} diff --git a/ReactWithDotNet.WebSite/Components/ArrowUpDownIcon.cs b/ReactWithDotNet.WebSite/Components/ArrowUpDownIcon.cs deleted file mode 100644 index 6f045369..00000000 --- a/ReactWithDotNet.WebSite/Components/ArrowUpDownIcon.cs +++ /dev/null @@ -1,27 +0,0 @@ -namespace ReactWithDotNet.WebSite.Components; - -sealed class ArrowUpDownIcon : PureComponent -{ - public bool IsArrowUp { get; init; } - - public int Size { get; init; } = 24; - - protected override Element render() - { - var arrowDown = new svg(svg.ViewBox(0, 0, 24, 24), svg.Size(Size), Transition("all", 400)) - { - new path { d = "M8.12 9.29 12 13.17l3.88-3.88c.39-.39 1.02-.39 1.41 0 .39.39.39 1.02 0 1.41l-4.59 4.59c-.39.39-1.02.39-1.41 0L6.7 10.7a.9959.9959 0 0 1 0-1.41c.39-.38 1.03-.39 1.42 0z" } - }; - - if (IsArrowUp) - { - return arrowDown + WithStyle([ - Transform("rotate(-180deg)") - ]); - } - - return arrowDown + WithStyle([ - Transform("rotate(0deg)") - ]); - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/Article.cs b/ReactWithDotNet.WebSite/Components/Article.cs deleted file mode 100644 index 52491470..00000000 --- a/ReactWithDotNet.WebSite/Components/Article.cs +++ /dev/null @@ -1,16 +0,0 @@ -namespace ReactWithDotNet.WebSite.Components; - -class Article : PureComponent -{ - public string FilePathInContentFolder { get; set; } - - protected override Element render() - { - var htmlContent = GetArticleHtmlContent(FilePathInContentFolder); - - return new article - { - dangerouslySetInnerHTML = htmlContent - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/BlogElements.cs b/ReactWithDotNet.WebSite/Components/BlogElements.cs deleted file mode 100644 index 879ebd54..00000000 --- a/ReactWithDotNet.WebSite/Components/BlogElements.cs +++ /dev/null @@ -1,30 +0,0 @@ -namespace ReactWithDotNet.WebSite.Components; - -sealed class BlogH1 : PureComponent -{ - protected override Element render() - { - return new h1 - { - children, - FontFamily("'General Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'"), - FontSize20, - LineHeight(36), - LetterSpacing(-0.2), - FontWeight600, - Color(rgb(15, 18, 20)), - }; - } -} - -sealed class BlogP : PureComponent -{ - protected override Element render() - { - return new p - { - children, - FontSize16 - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/CSharpCodeEditor.cs b/ReactWithDotNet.WebSite/Components/CSharpCodeEditor.cs deleted file mode 100644 index 5c16e55a..00000000 --- a/ReactWithDotNet.WebSite/Components/CSharpCodeEditor.cs +++ /dev/null @@ -1,29 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.MonacoEditorReact; - -namespace ReactWithDotNet.WebSite.Components; - -sealed class CSharpCodeEditor : Component -{ - public Expression> valueBind { get; init; } - public Func valueBindDebounceHandler { get; init; } - - protected override Element render() - { - return new Editor - { - valueBind = valueBind, - valueBindDebounceHandler = valueBindDebounceHandler, - valueBindDebounceTimeout = 500, - defaultLanguage = "html", - options = - { - renderLineHighlight = "none", - fontFamily = "consolas, 'IBM Plex Mono Medium', 'Courier New', monospace", - fontSize = 11, - minimap = new { enabled = false }, - lineNumbers = "off", - unicodeHighlight = new { showExcludeOptions = false } - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/CSharpCodePanel.cs b/ReactWithDotNet.WebSite/Components/CSharpCodePanel.cs deleted file mode 100644 index acfb738c..00000000 --- a/ReactWithDotNet.WebSite/Components/CSharpCodePanel.cs +++ /dev/null @@ -1,97 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.MonacoEditorReact; - -namespace ReactWithDotNet.WebSite.Components; - -sealed class CodeViewer : PureComponent -{ - public CodeViewer(params Modifier[] modifiers) - { - Add(modifiers); - } - - public static Modifier LangCSharp => CreatePureComponentModifier(x => { x.LanguageIsCSharp = true; }); - - public static Modifier LangTypeScript => CreatePureComponentModifier(x => { x.LanguageIsTypeScript = true; }); - - public string Code { get; init; } - - public bool LanguageIsCSharp { get; set; } - - public bool LanguageIsTypeScript { get; set; } - - protected override Element render() - { - var language = "csharp"; - if (LanguageIsTypeScript) - { - language = "typescript"; - } - - var code = Code ?? (children.FirstOrDefault() as HtmlTextNode)?.text; - - if (DesignMode && code is null) - { - Add(SizeFull); - - code = """" - using ReactWithDotNet.ThirdPartyLibraries.MonacoEditorReact; - - namespace ReactWithDotNet.WebSite.Components; - - sealed class CSharpCodePanel : PureComponent - { - public required string Code { get; init; } = "using System;"; - - protected override Element render() - { - return new Editor - { - defaultLanguage = "csharp", - value = Code, - options = - { - renderLineHighlight = "none", - fontFamily = "Consolas, monospace", - fontSize = 11, - minimap = new { enabled = false }, - // lineNumbers = "off", - unicodeHighlight = new { showExcludeOptions = false }, - readOnly = true - } - }; - } - } - """"; - } - - return new FlexRowCentered(Border(1,solid,Gray200), BorderRadius(4), Padding(4), SizeFull) - { - SpaceY(4), - new Editor - { - defaultLanguage = language, - value = code, - options = - { - renderLineHighlight = "none", - fontFamily = "Consolas, monospace", - fontSize = 11, - minimap = new { enabled = false }, - // lineNumbers = "off", - unicodeHighlight = new { showExcludeOptions = false }, - readOnly = true - } - } - }; - } -} - -sealed class CSharpCodePanel : PureComponent -{ - public required string Code { get; init; } - - protected override Element render() - { - return new CodeViewer { Code = Code, LanguageIsCSharp = true }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/FaqItem.cs b/ReactWithDotNet.WebSite/Components/FaqItem.cs deleted file mode 100644 index db0e70c0..00000000 --- a/ReactWithDotNet.WebSite/Components/FaqItem.cs +++ /dev/null @@ -1,48 +0,0 @@ -namespace ReactWithDotNet.WebSite.Components; - -class FaqItemState -{ - public bool IsOpen { get; set; } -} - -class FaqItem : Component -{ - public string Title { get; set; } - - public Element Content { get; set; } - - protected override Element render() - { - return new div(Padding(5)) - { - new FlexColumn(Padding(16),Border(Solid(1,Gray100)), BorderRadius(12)) - { - new FlexRow(JustifyContentSpaceBetween, AlignItemsCenter) - { - new h3(FontWeight700) - { - Title - }, - - new svg(ViewBox(0, 0, 24, 24), Size(24,24), OnClick(OnDropDownClicked)) - { - new path{d ="M8.12 9.29 12 13.17l3.88-3.88c.39-.39 1.02-.39 1.41 0 .39.39.39 1.02 0 1.41l-4.59 4.59c-.39.39-1.02.39-1.41 0L6.7 10.7a.9959.9959 0 0 1 0-1.41c.39-.38 1.03-.39 1.42 0z"} - } - }, - - new div(When(state.IsOpen is false, DisplayNone)) - { - children - } - } - }; - - } - - Task OnDropDownClicked(MouseEvent obj) - { - state.IsOpen = !state.IsOpen; - - return Task.CompletedTask; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/GradientText.cs b/ReactWithDotNet.WebSite/Components/GradientText.cs deleted file mode 100644 index 86ea9d4c..00000000 --- a/ReactWithDotNet.WebSite/Components/GradientText.cs +++ /dev/null @@ -1,18 +0,0 @@ -namespace ReactWithDotNet.WebSite.Components; - -sealed class GradientText : PureComponent -{ - protected override Element render() - { - return new span - { - children, - - PaddingLeftRight(3), - WebkitTextFillColor(transparent), - Background(linear_gradientTo("right", Blue400, Blue600)), - BackgroundClipText, - WebkitBackgroundClipText - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/HamburgerButton.cs b/ReactWithDotNet.WebSite/Components/HamburgerButton.cs deleted file mode 100644 index af7cfde9..00000000 --- a/ReactWithDotNet.WebSite/Components/HamburgerButton.cs +++ /dev/null @@ -1,45 +0,0 @@ -namespace ReactWithDotNet.WebSite.Components; - -class HamburgerButton : Component -{ - public required bool IsOpen { get; init; } - - public required MouseEventHandler Click { get; init; } - - protected override Element render() - { - var transition = Transition("all 0.2s ease 0s"); - - return new button(DisplayFlexRowCentered, OnClick(Click)) - { - Border(Solid(1,Theme.grey_300)), - Background(transparent), - BorderRadius(10), - - When(IsOpen,Background(Theme.grey_50)), - - Padding(8), - new svg(svg.Width(16),svg.Height(16), svg.ViewBox(0, 0, 16, 16), svg.Fill(none)) - { - new rect(transition, When(IsOpen, Transform("translate(6px, -2px) rotateZ(45deg)"))) - { - x = 1, - y = 5, - width = 14, - height = 1.5, - rx = 1, - fill = Theme.primary_main - }, - new rect(transition, When(IsOpen, Transform("translate(-5px, 6px) rotateZ(-45deg)"))) - { - x = 1, - y = 9, - width = 14, - height = 1.5, - rx = 1, - fill = Theme.primary_main - } - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/HomePageDemoComponent.cs b/ReactWithDotNet.WebSite/Components/HomePageDemoComponent.cs deleted file mode 100644 index a0dc9b44..00000000 --- a/ReactWithDotNet.WebSite/Components/HomePageDemoComponent.cs +++ /dev/null @@ -1,48 +0,0 @@ -namespace ReactWithDotNet.WebSite.Components; - -class HomePageDemoComponentState -{ - public string Message { get; set; } -} - -class HomePageDemoComponent : Component -{ - protected override Task constructor() - { - state = new(); - - return Task.CompletedTask; - } - - protected override Element render() - { - return new div(DisplayFlexColumn) - { - new button(Size(200, 50), DisplayFlexRowCentered) - { - text = "Show Message", - onClick = OnButtonClicked, - style = - { - Background(Blue500), - Border(1, solid, Gray100), - Color(White), - FontSize14, - Hover(Color(WhiteSmoke), FontSize16, Background(Blue600)) - } - }, - - new span(Color(Gray600)) - { - state.Message - } - }; - } - - Task OnButtonClicked(MouseEvent e) - { - state.Message = "Hello world"; - - return Task.CompletedTask; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/IconPlay.cs b/ReactWithDotNet.WebSite/Components/IconPlay.cs deleted file mode 100644 index cecf7f63..00000000 --- a/ReactWithDotNet.WebSite/Components/IconPlay.cs +++ /dev/null @@ -1,20 +0,0 @@ -namespace ReactWithDotNet.WebSite.Components; - -sealed class IconPlay : PureComponent -{ - public int Size { get; init; } - - protected override Element render() - { - return new FlexRowCentered(Size(Size)) - { - new svg(ViewBox(0, 0, 100, 100), Fill("#FFFFFF"), Size(Size)) - { - new path(Fill("currentColor")) - { - d = "M50,3.8C24.5,3.8,3.8,24.5,3.8,50S24.5,96.2,50,96.2S96.2,75.5,96.2,50S75.5,3.8,50,3.8z M71.2,53.3l-30.8,18 c-0.6,0.4-1.3,0.5-1.9,0.5c-0.6,0-1.3-0.1-1.9-0.5c-1.2-0.6-1.9-1.9-1.9-3.3V32c0-1.4,0.8-2.7,1.9-3.3c1.2-0.6,2.7-0.6,3.8,0 l30.8,18c1.2,0.6,1.9,1.9,1.9,3.3S72.3,52.7,71.2,53.3z" - } - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/Icons.cs b/ReactWithDotNet.WebSite/Components/Icons.cs deleted file mode 100644 index 931c15b9..00000000 --- a/ReactWithDotNet.WebSite/Components/Icons.cs +++ /dev/null @@ -1,61 +0,0 @@ -namespace ReactWithDotNet.WebSite.Components; - - - -class IconSuccess : PureComponent -{ - public string Color { get; init; } = "#2BDE3F"; - - protected override Element render() - { - return new div(Size(24)) - { - new svg(ViewBox(64, 64, 896, 896), svg.Focusable("false"), Fill(Color)) - { - new path { d = "M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 01-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z", style = { scrollMarginTop = "80px" } } - } - }; - } -} - - -class IconArrowUp: PureComponent -{ - public string Color { get; init; } = "#1C2B3D"; - - public int? Size { get; init; } - - protected override Element render() - { - var size = Size ?? 24; - - return new div(Size(size)) - { - new svg(ViewBox(0, 0, 24, 24), svg.FocusableFalse, svg.Size(size)) - { - new path { d = "M20.23 17.885L22 16.115L12 6.11501L2 16.115L3.77 17.885L12 9.65501L20.23 17.885Z", fill = Color} - } - }; - } -} - - -class IconFilter: PureComponent -{ - public string Color { get; init; } = "#1C2B3D"; - - public int? Size { get; init; } - - protected override Element render() - { - var size = Size ?? 24; - - return new div(Size(size)) - { - new svg(ViewBox(0, 0, 24, 24), svg.FocusableFalse, svg.Size(size)) - { - new path { d = "M3 7C3 6.44772 3.44772 6 4 6H20C20.5523 6 21 6.44772 21 7C21 7.55228 20.5523 8 20 8H4C3.44772 8 3 7.55228 3 7ZM6 12C6 11.4477 6.44772 11 7 11H17C17.5523 11 18 11.4477 18 12C18 12.5523 17.5523 13 17 13H7C6.44772 13 6 12.5523 6 12ZM9 17C9 16.4477 9.44772 16 10 16H14C14.5523 16 15 16.4477 15 17C15 17.5523 14.5523 18 14 18H10C9.44772 18 9 17.5523 9 17Z", fill = Color} - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/LivePreview.cs b/ReactWithDotNet.WebSite/Components/LivePreview.cs deleted file mode 100644 index bf2bf5ac..00000000 --- a/ReactWithDotNet.WebSite/Components/LivePreview.cs +++ /dev/null @@ -1,164 +0,0 @@ -using System.Text; -using System.Web; -using Microsoft.Net.Http.Headers; - -namespace ReactWithDotNet.WebSite.Components; - -sealed class LivePreview : Component -{ - public const string QueryParameterNameOfGuid = "guid"; - - static ScriptManager Scripts => ScriptManager.Instance; - - string GuidParameter => GetQuery(QueryParameterNameOfGuid); - - public static void RefreshComponentPreview(Client client, string guid) - { - var jsCode = - $"var eventName = '{GetRefreshPreviewEventName(guid)}';" - + Environment.NewLine + - $"var frame = document.getElementById('{guid}');" - + Environment.NewLine + - """ - - if(frame) - { - var reactWithDotNet = frame.contentWindow.ReactWithDotNet; - if(reactWithDotNet) - { - reactWithDotNet.DispatchEvent(eventName, []); - } - } - """; - - client.RunJavascript(jsCode); - } - - protected override Task constructor() - { - Client.ListenEvent(GetRefreshPreviewEventName(GuidParameter), Refresh); - - return Task.CompletedTask; - } - - protected override Element render() - { - return CreatePreview(GuidParameter); - } - - static Element CreatePreview(string guid) - { - if (guid is null) - { - return "guid is null"; - } - - var cacheItem = Scripts[guid]; - if (string.IsNullOrWhiteSpace(cacheItem?.RenderPartOfCSharpCode)) - { - return new pre - { - "Empty CSharp Code" - }; - } - - var assemblyName = guid; - - var fullCSharpCode = GetFullCSharpCodeByRenderPartOfCode(cacheItem.RenderPartOfCSharpCode); - - var (isTypeFound, type, assemblyLoadContext, sourceCodeHasError, sourceCodeError) = DynamicCode.LoadAndFindType(assemblyName, [fullCSharpCode], "Preview.SampleComponent"); - if (sourceCodeHasError) - { - return new pre(Color(Red300)) { sourceCodeError }; - } - - if (!isTypeFound) - { - assemblyLoadContext?.Unload(); - - return new pre - { - "Unexpected error. class not found." - }; - } - - Scripts[assemblyName] = cacheItem with - { - AssemblyLoadContext = assemblyLoadContext, - Type = type - }; - - var instance = type.Assembly.CreateInstance("Preview.SampleComponent"); - - return (ReactWithDotNet.Component)instance; - } - - static string GetFullCSharpCodeByRenderPartOfCode(string renderPartOfCSharpCode) - { - var sb = new StringBuilder(); - sb.AppendLine("using ReactWithDotNet;"); - sb.AppendLine("using static ReactWithDotNet.Mixin;"); - sb.AppendLine(); - sb.AppendLine("namespace Preview;"); - sb.AppendLine(); - sb.AppendLine("class SampleComponent: Component"); - sb.AppendLine("{"); - - sb.AppendLine(" protected override Element render()"); - sb.AppendLine(" {"); - sb.AppendLine(" return "); - - sb.AppendLine(" // s t a r t "); - foreach (var line in renderPartOfCSharpCode.Split(Environment.NewLine, StringSplitOptions.RemoveEmptyEntries)) - { - sb.AppendLine(" " + line); - } - - sb.AppendLine(" // e n d"); - - sb.AppendLine(" ;"); - - sb.AppendLine(" }"); - - sb.AppendLine(" protected override Element componentDidCatch(Exception exceptionOccurredInRender)"); - sb.AppendLine(" {"); - sb.AppendLine(" return new pre(Color(Red300))"); - sb.AppendLine(" {"); - sb.AppendLine(" exceptionOccurredInRender.ToString()"); - sb.AppendLine(" };"); - sb.AppendLine(" }"); - - sb.AppendLine("}"); - - return sb.ToString(); - } - - static string GetRefreshPreviewEventName(string guid) - { - return "RefreshComponentPreview" + guid; - } - - string GetQuery(string name) - { - var value = Context.HttpContext.Request.Query[name].FirstOrDefault(); - if (value != null) - { - return value; - } - - var referer = Context.HttpContext.Request.Headers[HeaderNames.Referer]; - if (string.IsNullOrWhiteSpace(referer)) - { - return null; - } - - var nameValueCollection = HttpUtility.ParseQueryString(new Uri(referer).Query); - - return nameValueCollection[name]; - } - - Task Refresh() - { - return Task.CompletedTask; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/LoadingIcon.cs b/ReactWithDotNet.WebSite/Components/LoadingIcon.cs deleted file mode 100644 index 52b5850f..00000000 --- a/ReactWithDotNet.WebSite/Components/LoadingIcon.cs +++ /dev/null @@ -1,43 +0,0 @@ - -namespace ReactWithDotNet.WebSite.Components; - -// Taken from https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_loader -public class LoadingIcon : PureComponent -{ - public string Color { get; set; } = "#A08139"; - - protected override Element render() - { - return new div - { - new style - { - text = $@" - -.loader {{ - border: 1px solid #f3f3f3; - border-radius: 50%; - border-top: 1px solid {Color}; - - -webkit-animation: spin 1s linear infinite; /* Safari */ - animation: spin 1s linear infinite; -}} - -/* Safari */ -@-webkit-keyframes spin {{ - 0% {{ -webkit-transform: rotate(0deg); }} - 100% {{ -webkit-transform: rotate(360deg); }} -}} - -@keyframes spin {{ - 0% {{ transform: rotate(0deg); }} - 100% {{ transform: rotate(360deg); }} -}} - -" - }, - - new div { className = "loader", style = { SizeFull } } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/MainContentContainer.cs b/ReactWithDotNet.WebSite/Components/MainContentContainer.cs deleted file mode 100644 index 076d81d1..00000000 --- a/ReactWithDotNet.WebSite/Components/MainContentContainer.cs +++ /dev/null @@ -1,33 +0,0 @@ -namespace ReactWithDotNet.WebSite.Components; - -class MainContentContainer : PureComponent -{ - readonly Modifier[] modifiers; - public MainContentContainer() - { } - - public MainContentContainer(params Modifier[] modifiers) - { - this.modifiers = modifiers; - } - protected override Element render() - { - var element = new FlexRow - { - MaxWidth(1200), - JustifyContentCenter, - - children, - - PaddingLeftRight("5%"), - MD(PaddingLeftRight("10%")), - LG(PaddingLeftRight("5%")), - Data(".net_component_name", nameof(MainContentContainer)) - - }; - - element.Apply(modifiers); - - return element; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/PlayButton.cs b/ReactWithDotNet.WebSite/Components/PlayButton.cs deleted file mode 100644 index 22936afa..00000000 --- a/ReactWithDotNet.WebSite/Components/PlayButton.cs +++ /dev/null @@ -1,132 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.React_Player; - -namespace ReactWithDotNet.WebSite.Components; - -sealed class PlayButton : Component -{ - public string Label { get; init; } = "Play tutorial (2 min)"; - - public (double W, double H) VideoSize { get; init; } = (640, 360); - - public string VideoUrl { get; init; } - - protected override Element render() - { - if (state.IsPlayerOpen) - { - return new VideoPlayer - { - Size = VideoSize, - VideoUrl = VideoUrl, - Closed = () => - { - state = state with { IsPlayerOpen = false }; - - return Task.CompletedTask; - } - }; - } - - Style style = - [ - Color(Gray500), - Gap(4), - UserSelect(none), - Hover(Color(Gray700)) - ]; - - return new FlexRowCentered(Padding(3, 10), SizeFitContent, BorderRadius(3), style) - { - new IconPlay { Size = 25 }, - - Label, - - OnClick(_ => - { - state = state with { IsPlayerOpen = true }; - - return Task.CompletedTask; - }) - }; - } - - class Backdrop : PureComponent - { - protected override Element render() - { - return new FlexRowCentered(PositionFixed, Inset0, Background("#0003"), Zindex5, Transition(Opacity, 0.3, "ease")) - { - children - }; - } - } - - class VideoPlayer : Component - { - [CustomEvent] - public Func Closed { get; init; } - - public (double W, double H) Size { get; init; } = (640, 360); - - public required string VideoUrl { get; init; } - - protected override Element render() - { - if (state.IsClosed) - { - return null; - } - - var w = Size.W; - var h = Size.H; - - List style = []; - - for (var i = 300; i < 700; i += 50) - { - style.Add(WhenMediaMinWidth(i, Width(i - 50))); - style.Add(WhenMediaMinWidth(i, Height(h * i / w))); - } - - return new Backdrop - { - OnClick(_ => - { - state.IsClosed = true; - - DispatchEvent(Closed, []); - - return Task.CompletedTask; - }), - - new FlexRowCentered(WidthFitContent, HeightAuto, Padding(16), Background(White), BorderRadius(8)) - { - new div(style) - { - new ReactPlayer - { - url = VideoUrl, - style = { BorderRadius(5) }, - - width = "100%", - height = "100%", - volume = 0, - controls = true, - playsinline = true - } - } - } - }; - } - - internal class VideoPlayerState - { - public bool IsClosed { get; set; } - } - } - - internal record State - { - public bool IsPlayerOpen { get; init; } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/Playground.cs b/ReactWithDotNet.WebSite/Components/Playground.cs deleted file mode 100644 index 406e5eca..00000000 --- a/ReactWithDotNet.WebSite/Components/Playground.cs +++ /dev/null @@ -1,205 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.MUI.Material; - -namespace ReactWithDotNet.WebSite.Components; - -record PlaygroundState -{ - public IReadOnlyList<(string fileName, string fileContent)> Files { get; init; } - - public bool ResetMode { get; init; } - - public string SelectedFileName { get; init; } - - public Type TypeOfTargetComponent { get; init; } -} - -class Playground : Component -{ - public IReadOnlyList<(string fileName, string fileContent)> Files { get; init; } - - public string SelectedFileName { get; init; } - - public Type TypeOfTargetComponent { get; init; } - - protected override Task constructor() - { - state = new() - { - Files = Files ?? new List<(string fileName, string fileContent)>(), - SelectedFileName = SelectedFileName, - TypeOfTargetComponent = TypeOfTargetComponent - }; - - if (SelectedFileName is null && Files?.Count > 0) - { - state = state with { SelectedFileName = Files[0].fileName }; - } - - return base.constructor(); - } - - protected override Element render() - { - var width = Width(100 * percent) + MD(Width(50 * percent)); - - return new FlexColumn(SizeFull, BoxShadow("rgb(0 0 0 / 34%) 0px 2px 5px 0px"), BorderRadius(3), CursorDefault) - { - Part_AppBar, - - new FlexRow(SizeFull, JustifyContentSpaceBetween, FlexWrap) - { - new FlexRowCentered(width, Height(300), BorderRight(Solid(1, rgb(235, 236, 240)))) - { - new CSharpCodePanel - { - Code = state.Files?.FirstOrDefault(x => x.fileName == state.SelectedFileName).fileContent - } - }, - - new FlexRowCentered(width, Height(300), Background(rgb(246, 247, 249)), MinSize(200)) - { - Part_Preview - } - } - }; - } - - Task FinishResetOperation() - { - state = state with { ResetMode = false }; - - return Task.CompletedTask; - } - - Element iconCsharp() - { - return new svg(ViewBox("0 0 32 32"), Size(16, 16), Fill("red")) - { - new path { d = "M19.792,7.071h2.553V9.624H24.9V7.071h2.552V9.624H30v2.552h-2.55v2.551H30V17.28H27.449v2.552H24.9v-2.55l-2.55,0,0,2.552H19.793v-2.55l-2.553,0V14.725h2.553V12.179H17.24V9.622h2.554Zm2.553,7.658H24.9V12.176H22.345Z" }, - new path { d = "M14.689,24.013a10.2,10.2,0,0,1-4.653.915,7.6,7.6,0,0,1-5.89-2.336A8.839,8.839,0,0,1,2,16.367,9.436,9.436,0,0,1,4.412,9.648a8.181,8.181,0,0,1,6.259-2.577,11.1,11.1,0,0,1,4.018.638v3.745a6.81,6.81,0,0,0-3.723-1.036,4.793,4.793,0,0,0-3.7,1.529,5.879,5.879,0,0,0-1.407,4.142,5.774,5.774,0,0,0,1.328,3.992,4.551,4.551,0,0,0,3.575,1.487,7.288,7.288,0,0,0,3.927-1.108Z" } - }; - } - - Task OnResetClicked(MouseEvent e) - { - state = state with { ResetMode = true }; - - Client.GotoMethod(20, FinishResetOperation); - - return Task.CompletedTask; - } - - Task OnSourceFileClicked(MouseEvent e) - { - state = state with { SelectedFileName = e.target.id }; - - return Task.CompletedTask; - } - - Element Part_AppBar() - { - return new FlexRow(Height(40), PaddingLeftRight(24), FontSize13, JustifyContentSpaceBetween) - { - Background("white"), Color(Theme.Gray400), BorderBottom(Solid(1, Theme.Gray100)), - - new FlexRow(Gap(15)) - { - state.Files?.Select(fileInfo => new FlexRowCentered - { - iconCsharp, - SpaceX(5), - - fileInfo.fileName, - - OnClick(OnSourceFileClicked), Id(fileInfo.fileName), - - fileInfo.fileName == state.SelectedFileName - ? - [ - Color(Theme.Gray700), - BorderBottom(Solid(1, Theme.Gray950)) - ] - : - [ - FontSize("0.9rem"), - Hover(Color(Theme.Gray700)) - ] - }) - }, - - new ResetButton { Clicked = OnResetClicked } - }; - } - - Element Part_Preview() - { - if (state.ResetMode) - { - return new FlexRowCentered(SizeFull) - { - new LoadingIcon { Color = Theme.Blue700 } + Size(20, 20) - }; - } - - if (state.TypeOfTargetComponent is null) - { - return new pre - { - "Target type not specified yet" - }; - } - - return (Element)Activator.CreateInstance(state.TypeOfTargetComponent); - } - - class ResetButton : Component - { - const double size = 24; - - public MouseEventHandler Clicked; - - protected override Element render() - { - return new Tooltip - { - x => - { - x.arrow = true; - x.title = "Restart app"; - }, - - new FlexRowCentered(OnClickPreview(() => state.IsRunning = true), OnClick(Clicked), Hover(Border(Solid(0.1, Theme.grey_100)), BorderRadius(5))) - { - state.IsRunning ? new IconLoading() : new IconReset(), - - SpaceX(5), - new span { "Reset", FontSize12 } - } - }; - } - - internal class ResetButtonState - { - public bool IsRunning { get; set; } - } - - class IconLoading : PureComponent - { - protected override Element render() - { - return new LoadingIcon { Color = Theme.Blue700 } + Size(size / 2, size / 2); - } - } - - class IconReset : PureComponent - { - protected override Element render() - { - return new svg(svg.ViewBox(0, 0, size, size), svg.Fill(Theme.Blue400), Size(size / 2, size / 2), Hover(Fill(Theme.Blue700))) - { - new path { d = "M13.8982 5.20844C12.4626 4.88688 10.9686 4.93769 9.55821 5.35604L11.8524 3.06184C11.8989 3.0154 11.9357 2.96028 11.9608 2.89961C11.986 2.83894 11.9989 2.77391 11.9989 2.70824C11.9989 2.64256 11.986 2.57754 11.9608 2.51686C11.9357 2.45619 11.8989 2.40107 11.8524 2.35464L11.1456 1.64784C11.0992 1.60139 11.0441 1.56455 10.9834 1.53942C10.9227 1.51428 10.8577 1.50134 10.792 1.50134C10.7263 1.50134 10.6613 1.51428 10.6006 1.53942C10.54 1.56455 10.4848 1.60139 10.4384 1.64784L6.14571 5.94054C6.00654 6.07969 5.89615 6.2449 5.82083 6.42673C5.74551 6.60855 5.70675 6.80343 5.70675 7.00024C5.70675 7.19704 5.74551 7.39192 5.82083 7.57374C5.89615 7.75557 6.00654 7.92078 6.14571 8.05994L10.4387 12.3529C10.5325 12.4465 10.6595 12.4991 10.792 12.4991C10.9245 12.4991 11.0516 12.4465 11.1453 12.3529L11.8527 11.6455C11.9463 11.5518 11.9989 11.4247 11.9989 11.2922C11.9989 11.1598 11.9463 11.0327 11.8527 10.9389L8.77481 7.86104C9.99795 7.16236 11.415 6.8801 12.8125 7.05678C14.21 7.23347 15.5122 7.85953 16.523 8.84064C17.5338 9.82176 18.1983 11.1048 18.4165 12.4964C18.6347 13.888 18.3947 15.3129 17.7328 16.5562C17.0708 17.7996 16.0227 18.7942 14.7463 19.3902C13.47 19.9861 12.0345 20.1511 10.6563 19.8603C9.27798 19.5695 8.03152 18.8387 7.10469 17.778C6.17786 16.7172 5.62086 15.384 5.51761 13.9791C5.51156 13.8512 5.45689 13.7303 5.36477 13.6413C5.27265 13.5522 5.15001 13.5017 5.02191 13.5H4.02081C3.95297 13.4996 3.88574 13.5129 3.8232 13.5392C3.76065 13.5655 3.70408 13.6042 3.6569 13.6529C3.60972 13.7017 3.57291 13.7595 3.54869 13.8228C3.52448 13.8862 3.51336 13.9538 3.51601 14.0216C3.61349 15.5965 4.1473 17.1132 5.0577 18.4019C5.9681 19.6906 7.21917 20.7006 8.6709 21.3188C10.1226 21.937 11.7178 22.139 13.2778 21.9022C14.8378 21.6654 16.3011 20.9992 17.504 19.978C18.7069 18.9569 19.6019 17.6212 20.0889 16.1203C20.5759 14.6195 20.6356 13.0128 20.2614 11.4799C19.8872 9.94705 19.0938 8.54858 17.97 7.44098C16.8462 6.33339 15.4363 5.56037 13.8982 5.20844V5.20844Z" } - }; - } - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/RenderPreview.cs b/ReactWithDotNet.WebSite/Components/RenderPreview.cs deleted file mode 100644 index 13b1d8b8..00000000 --- a/ReactWithDotNet.WebSite/Components/RenderPreview.cs +++ /dev/null @@ -1,90 +0,0 @@ -using static ReactWithDotNet.WebSite.Components.LivePreview; - -namespace ReactWithDotNet.WebSite.Components; - -sealed class RenderPreview : Component -{ - public string RenderPartOfCSharpCode { get; init; } - - static ScriptManager Scripts => ScriptManager.Instance; - - Func Break { get; } = SM; - - protected override Task constructor() - { - state = new() - { - RenderPartOfCSharpCode = RenderPartOfCSharpCode, - - Guid = Guid.NewGuid().ToString("N") - }; - - if (DesignMode && state.RenderPartOfCSharpCode is null) - { - state = state with - { - RenderPartOfCSharpCode = - """ - new div(Size(100), Border(2, solid, Blue)) - { - "Hello world" - } - """ - }; - } - - Scripts[state.Guid] = new() - { - RenderPartOfCSharpCode = state.RenderPartOfCSharpCode - }; - - return Task.CompletedTask; - } - - protected override Element render() - { - var width = Width(1, 1) + Break([Width(1, 2)]); - var height = Height(1, 2) + Break([Height(1, 1)]); - - return new FlexColumn(SizeFull, BoxShadow(0, 2, 5, 0, rgba(0, 0, 0, .34)), BorderRadius(3), CursorDefault, MinSize(200)) - { - Break([DisplayFlexRow]), - new FlexRowCentered(width, height, BorderRight(Solid(1, rgb(235, 236, 240)))) - { - new CSharpCodeEditor - { - valueBind = () => state.RenderPartOfCSharpCode, - valueBindDebounceHandler = RenderPartOfCSharpCode_OnEditFinished - } - }, - - new FlexRowCentered(width, height, Background(rgb(246, 247, 249))) - { - new iframe - { - id = state.Guid, - src = Page.LivePreviewUrl(state.Guid), - style = { BorderNone, SizeFull, Padding(8) } - } - } - }; - } - - Task RenderPartOfCSharpCode_OnEditFinished() - { - Scripts[state.Guid] = new() - { - RenderPartOfCSharpCode = state.RenderPartOfCSharpCode - }; - - RefreshComponentPreview(Client, state.Guid); - - return Task.CompletedTask; - } - - internal record Model - { - public string RenderPartOfCSharpCode { get; init; } - public string Guid { get; init; } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Components/_____.cs b/ReactWithDotNet.WebSite/Components/_____.cs deleted file mode 100644 index 448925af..00000000 --- a/ReactWithDotNet.WebSite/Components/_____.cs +++ /dev/null @@ -1,288 +0,0 @@ -using ReactWithDotNet; -using static ReactWithDotNet.Mixin; - -namespace Preview; - -class SampleComponent: Component -{ - protected override Element render() - { - return - // s t a r t - new div(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", paddingBottom = "96px", paddingTop = "96px" }) - { - - new FlexRowCentered(Background(Yellow400), SizeFitContent) - { - PaddingLeft(13*percent), - PaddingTop(56), - PaddingRight(24), - PaddingBottom(28), - new div - { - Margin(67,45,23,34), - PaddingLeft(23), - Background("red"), - "XY", - Size(40), Background(Gray400) - }, - - new div - { - Margin(67,45,23,34), - PaddingLeft(23), - - "XY", - Size(40), BackgroundImage(url(DummySrc(40))) - } - }, - - new FlexRowCentered(Background(Amber300), SizeFitContent) - { - Padding(22,50), - new div{ "Abc" } - }, - - new h1 - { - text = "A simple CMS for your Next.js app", - // disabled = "", - //contentEditable = "false", - style = - { - border = "0px solid rgb(229, 231, 235)", - boxSizing = "border-box", - color = "rgb(55, 65, 81)", - fontSize = "60px", - fontWeight = "800", - lineHeight = "70px", - margin = "24px 0px 0px", - marginTop = "24px", - textAlign = "left" - } - }, - new div(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", marginTop = "12px" }) - { - new p(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(55, 65, 81)", fontSize = "20px", lineHeight = "28px", margin = "20px 0px 0px", marginTop = "20px", textAlign = "left" }) - { - "Suncel is a powerful and versatile content platform, with a simple ", - new strong(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", fontWeight = "700" }) - { - "visual builder" - }, - " for marketers and publishers. It provides an SEO-optimized headless CMS based on Next.js." - } - }, - new div(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", display = "flex", gap = "20px", justifyContent = "flex-start", marginTop = "48px" }) - { - new span(new Style { alignItems = "center", border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(219, 39, 119)", display = "flex", flexDirection = "row", justifyContent = "center" }) - { - new svg(Data("v-1923673d", ""), Width("22"), Height("17"), ViewBox("0 0 33 26"), Fill("currentColor"), new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", display = "block", verticalAlign = "middle" }) - { - new path - { - d = "M32.1452 1.32151C32.9745 2.05115 33.0552 3.3149 32.3256 4.14418L13.8485 25.1442C13.4696 25.5749 12.9239 25.8221 12.3502 25.823C11.7764 25.8239 11.23 25.5784 10.8496 25.1489L1.32669 14.394C0.594444 13.567 0.671236 12.303 1.49821 11.5708C2.32519 10.8385 3.58918 10.9153 4.32143 11.7423L12.3423 20.8007L29.3225 1.5019C30.0522 0.67263 31.3159 0.591865 32.1452 1.32151Z", - style = - { - border = "0px solid rgb(229, 231, 235)", - boxSizing = "border-box", - clipRule = "evenodd", - fillRule = "evenodd" - } - } - }, - new p - { - text = "Free plan", - // disabled = "", - //contentEditable = "false", - style = - { - border = "0px solid rgb(229, 231, 235)", - boxSizing = "border-box", - color = "rgb(17, 24, 39)", - fontSize = "16px", - lineHeight = "24px", - margin = "0px 0px 0px 4px", - marginLeft = "4px", - textAlign = "center" - } - } - }, - new span(new Style { alignItems = "center", border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(219, 39, 119)", display = "flex", flexDirection = "row", justifyContent = "center" }) - { - new svg(Data("v-1923673d", ""), Width("22"), Height("17"), ViewBox("0 0 33 26"), Fill("currentColor"), new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", display = "block", verticalAlign = "middle" }) - { - new path - { - d = "M32.1452 1.32151C32.9745 2.05115 33.0552 3.3149 32.3256 4.14418L13.8485 25.1442C13.4696 25.5749 12.9239 25.8221 12.3502 25.823C11.7764 25.8239 11.23 25.5784 10.8496 25.1489L1.32669 14.394C0.594444 13.567 0.671236 12.303 1.49821 11.5708C2.32519 10.8385 3.58918 10.9153 4.32143 11.7423L12.3423 20.8007L29.3225 1.5019C30.0522 0.67263 31.3159 0.591865 32.1452 1.32151Z", - style = - { - border = "0px solid rgb(229, 231, 235)", - boxSizing = "border-box", - clipRule = "evenodd", - fillRule = "evenodd" - } - } - }, - new p - { - text = "No credit card required", - // disabled = "", - //contentEditable = "false", - style = - { - border = "0px solid rgb(229, 231, 235)", - boxSizing = "border-box", - color = "rgb(17, 24, 39)", - fontSize = "16px", - lineHeight = "24px", - margin = "0px 0px 0px 4px", - marginLeft = "4px", - textAlign = "center" - } - } - }, - new span(new Style { alignItems = "center", border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(219, 39, 119)", display = "flex", flexDirection = "row", justifyContent = "center" }) - { - new svg(Data("v-1923673d", ""), Width("22"), Height("17"), ViewBox("0 0 33 26"), Fill("currentColor"), new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", display = "block", verticalAlign = "middle" }) - { - new path - { - d = "M32.1452 1.32151C32.9745 2.05115 33.0552 3.3149 32.3256 4.14418L13.8485 25.1442C13.4696 25.5749 12.9239 25.8221 12.3502 25.823C11.7764 25.8239 11.23 25.5784 10.8496 25.1489L1.32669 14.394C0.594444 13.567 0.671236 12.303 1.49821 11.5708C2.32519 10.8385 3.58918 10.9153 4.32143 11.7423L12.3423 20.8007L29.3225 1.5019C30.0522 0.67263 31.3159 0.591865 32.1452 1.32151Z", - style = - { - border = "0px solid rgb(229, 231, 235)", - boxSizing = "border-box", - clipRule = "evenodd", - fillRule = "evenodd" - } - } - }, - new p - { - text = "Setup in minutes", - // disabled = "", - //contentEditable = "false", - style = - { - border = "0px solid rgb(229, 231, 235)", - boxSizing = "border-box", - color = "rgb(17, 24, 39)", - fontSize = "16px", - lineHeight = "24px", - margin = "0px 0px 0px 4px", - marginLeft = "4px", - textAlign = "center" - } - } - } - }, - new div(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", marginTop = "48px" }) - { - new div(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", marginLeft = "0px", marginRight = "0px", maxWidth = "576px" }) - { - new div(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", display = "flex", justifyContent = "flex-start" }) - { - new div(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", marginTop = "0px" }) - { - new a(Href("https://app.suncel.io/signup"), TargetBlank, Rel("noreferrer"), new Style { backgroundColor = "rgb(203, 3, 111)", border = "0px solid rgb(229, 231, 235)", borderRadius = "6px", boxShadow = "rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.1) 0px 1px 2px -1px", boxSizing = "border-box", color = "rgb(255, 255, 255)", display = "block", fontWeight = "500", paddingBottom = "12px", paddingLeft = "16px", paddingRight = "16px", paddingTop = "12px", textAlign = "center", textDecoration = "none solid rgb(255, 255, 255)", width = "100%" }) - { - new span - { - text = "Get started", - // disabled = "", - //contentEditable = "false", - style = { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box" } - } - } - }, - new FlexRowCentered(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(17, 24, 39)", cursor = "pointer", marginLeft = "32px", marginTop = "0px" }) - { - new svg(Data("v-1923673d", ""), Width("40"), Height("28"), ViewBox("0 0 60 42"), Fill("currentColor"), new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", display = "block", verticalAlign = "middle" }) - { - new path { d = "M-26.7-51.9a7.515,7.515,0,0,0-5.3-5.3c-4.679-1.254-23.442-1.254-23.442-1.254s-18.762,0-23.442,1.254a7.515,7.515,0,0,0-5.3,5.3c-1.254,4.679-1.254,14.442-1.254,14.442s0,9.763,1.254,14.442a7.514,7.514,0,0,0,5.3,5.3c4.679,1.254,23.442,1.254,23.442,1.254s18.762,0,23.442-1.254a7.514,7.514,0,0,0,5.3-5.3C-25.45-27.7-25.45-37.461-25.45-37.461S-25.45-47.224-26.7-51.9ZM-61.45-28.461v-18l15.588,9Z", /* transform = "translate(85.45 58.461)"*/ style = { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box" } } - }, - new p - { - text = "product video", - // disabled = "", - //contentEditable = "false", - style = { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", marginLeft = "4px" } - } - } - }, - new p - { - text = "Publish content faster, improve page speed and SEO ranking.", - // disabled = "", - //contentEditable = "false", - style = - { - border = "0px solid rgb(229, 231, 235)", - boxSizing = "border-box", - color = "rgb(107, 114, 128)", - fontSize = "14px", - lineHeight = "20px", - margin = "16px 0px 0px", - marginTop = "16px", - textAlign = "left" - } - } - }, - new div(new Style { alignItems = "center", border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", display = "flex", justifyContent = "flex-start", marginTop = "48px" }) - { - new a(Href("https://www.capterra.com/p/275259/Suncel/"), TargetBlank, Rel("noopener noreferrer"), new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(17, 24, 39)", textDecoration = "none solid rgb(17, 24, 39)" }) - { - new img(Data("nimg", "1")) - { - alt = "capterra 5 stars", - loading = "lazy", - - // decoding = "async", - src = "https://assets.suncel.io/61bf5e233c962a862faf209f/7R0uh-capterra-logo.svg", - style = - { - border = "0px solid rgb(229, 231, 235)", - boxSizing = "border-box", - display = "block", - height = "auto", - maxWidth = "100%", - verticalAlign = "middle" - } - }, - new FlexRow(new Style { alignItems = "center", border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", marginLeft = "8px", marginTop = "8px" }) - { - new svg(Stroke("currentColor"), Fill("currentColor"), ViewBox("0 0 1024 1024"), Height("1em"), Width("1em"), new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(250, 204, 21)", display = "block", fontSize = "20px", lineHeight = "28px", strokeWidth = "0", verticalAlign = "middle" }) - { - new path { d = "M908.1 353.1l-253.9-36.9L540.7 86.1c-3.1-6.3-8.2-11.4-14.5-14.5-15.8-7.8-35-1.3-42.9 14.5L369.8 316.2l-253.9 36.9c-7 1-13.4 4.3-18.3 9.3a32.05 32.05 0 0 0 .6 45.3l183.7 179.1-43.4 252.9a31.95 31.95 0 0 0 46.4 33.7L512 754l227.1 119.4c6.2 3.3 13.4 4.4 20.3 3.2 17.4-3 29.1-19.5 26.1-36.9l-43.4-252.9 183.7-179.1c5-4.9 8.3-11.3 9.3-18.3 2.7-17.5-9.5-33.7-27-36.3z", style = { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box" } } - }, - new svg(Stroke("currentColor"), Fill("currentColor"), ViewBox("0 0 1024 1024"), Height("1em"), Width("1em"), new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(250, 204, 21)", display = "block", fontSize = "20px", lineHeight = "28px", marginLeft = "8px", marginRight = "0px", strokeWidth = "0", verticalAlign = "middle" }) - { - new path { d = "M908.1 353.1l-253.9-36.9L540.7 86.1c-3.1-6.3-8.2-11.4-14.5-14.5-15.8-7.8-35-1.3-42.9 14.5L369.8 316.2l-253.9 36.9c-7 1-13.4 4.3-18.3 9.3a32.05 32.05 0 0 0 .6 45.3l183.7 179.1-43.4 252.9a31.95 31.95 0 0 0 46.4 33.7L512 754l227.1 119.4c6.2 3.3 13.4 4.4 20.3 3.2 17.4-3 29.1-19.5 26.1-36.9l-43.4-252.9 183.7-179.1c5-4.9 8.3-11.3 9.3-18.3 2.7-17.5-9.5-33.7-27-36.3z", style = { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box" } } - }, - new svg(Stroke("currentColor"), Fill("currentColor"), ViewBox("0 0 1024 1024"), Height("1em"), Width("1em"), new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(250, 204, 21)", display = "block", fontSize = "20px", lineHeight = "28px", marginLeft = "8px", marginRight = "0px", strokeWidth = "0", verticalAlign = "middle" }) - { - new path { d = "M908.1 353.1l-253.9-36.9L540.7 86.1c-3.1-6.3-8.2-11.4-14.5-14.5-15.8-7.8-35-1.3-42.9 14.5L369.8 316.2l-253.9 36.9c-7 1-13.4 4.3-18.3 9.3a32.05 32.05 0 0 0 .6 45.3l183.7 179.1-43.4 252.9a31.95 31.95 0 0 0 46.4 33.7L512 754l227.1 119.4c6.2 3.3 13.4 4.4 20.3 3.2 17.4-3 29.1-19.5 26.1-36.9l-43.4-252.9 183.7-179.1c5-4.9 8.3-11.3 9.3-18.3 2.7-17.5-9.5-33.7-27-36.3z", style = { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box" } } - }, - new svg(Stroke("currentColor"), Fill("currentColor"), ViewBox("0 0 1024 1024"), Height("1em"), Width("1em"), new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(250, 204, 21)", display = "block", fontSize = "20px", lineHeight = "28px", marginLeft = "8px", marginRight = "0px", strokeWidth = "0", verticalAlign = "middle" }) - { - new path { d = "M908.1 353.1l-253.9-36.9L540.7 86.1c-3.1-6.3-8.2-11.4-14.5-14.5-15.8-7.8-35-1.3-42.9 14.5L369.8 316.2l-253.9 36.9c-7 1-13.4 4.3-18.3 9.3a32.05 32.05 0 0 0 .6 45.3l183.7 179.1-43.4 252.9a31.95 31.95 0 0 0 46.4 33.7L512 754l227.1 119.4c6.2 3.3 13.4 4.4 20.3 3.2 17.4-3 29.1-19.5 26.1-36.9l-43.4-252.9 183.7-179.1c5-4.9 8.3-11.3 9.3-18.3 2.7-17.5-9.5-33.7-27-36.3z", style = { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box" } } - }, - new svg(Stroke("currentColor"), Fill("currentColor"), ViewBox("0 0 1024 1024"), Height("1em"), Width("1em"), new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(250, 204, 21)", display = "block", fontSize = "20px", lineHeight = "28px", marginLeft = "8px", marginRight = "0px", strokeWidth = "0", verticalAlign = "middle" }) - { - new path { d = "M908.1 353.1l-253.9-36.9L540.7 86.1c-3.1-6.3-8.2-11.4-14.5-14.5-15.8-7.8-35-1.3-42.9 14.5L369.8 316.2l-253.9 36.9c-7 1-13.4 4.3-18.3 9.3a32.05 32.05 0 0 0 .6 45.3l183.7 179.1-43.4 252.9a31.95 31.95 0 0 0 46.4 33.7L512 754l227.1 119.4c6.2 3.3 13.4 4.4 20.3 3.2 17.4-3 29.1-19.5 26.1-36.9l-43.4-252.9 183.7-179.1c5-4.9 8.3-11.3 9.3-18.3 2.7-17.5-9.5-33.7-27-36.3z", style = { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box" } } - }, - new div(new Style { border = "0px solid rgb(229, 231, 235)", boxSizing = "border-box", color = "rgb(55, 65, 81)", fontSize = "18px", fontWeight = "600", lineHeight = "28px", marginLeft = "8px", marginRight = "0px" }) - { - "4.9" - } - } - } - } - } - } - // e n d - ; - } -} diff --git a/ReactWithDotNet.WebSite/Deneme45.cs b/ReactWithDotNet.WebSite/Deneme45.cs deleted file mode 100644 index 2a92546c..00000000 --- a/ReactWithDotNet.WebSite/Deneme45.cs +++ /dev/null @@ -1,513 +0,0 @@ -using System.Runtime.InteropServices; - -namespace ReactWithDotNet.WebSite; - -class Deneme45 -{ - //public string FF1; - - //public Deneme45(string a) - //{ - // FF1 = a+"u"; - //} - - //void CallNonStaticMethod(string abc) - //{ - // FF1 = "a" + "b"; - //} - - //public string GetA() - //{ - // return FF1; - //} - - //class GenericClass1 - //{ - // public A a; - // public B b; - - // public string P; - - // public GenericClass1(string p1) - // { - // P = p1; - // } - //} - - public static string Compare(int a, ref long b) - { - return a == b ? "Equal" : "Not Equal"; - } - - static void TestCase_Try_Catch_In_Current_Method() - { - var result = "0"; - - var e = new Exception("success"); - - try - { - throw e; - } - catch (Exception exception) - { - result = exception.Message; - } - - // console.log(result); - - - } - - - - static class ExternalCallTest - { - public static void Static_Void_Call() - { - console.log("success"); - } - - public static void Static_NonVoid_Call() - { - var result = Math.max(1, 2); - if (result ==2) - { - console.log("success"); - } - else - { - console.log("fail"); - } - - } - } - - static void LdInd() - { - sbyte v0 = 1; - byte v1 = 1; - short v2 = 1; - int v3 = 1; - float v4 = 1; - long v5 = 1; - - var response = refSByte(ref v0); - if (response == "0") - { - throw new Exception(nameof(LdInd)); - } - response = refByte(ref v1); - if (response == "0") - { - throw new Exception(nameof(LdInd)); - } - - response = refShort(ref v2); - if (response == "0") - { - throw new Exception(nameof(LdInd)); - } - - response = refInt32(ref v3); - if (response == "0") - { - throw new Exception(nameof(LdInd)); - } - - response = refFloat(ref v4); - if (response == "0") - { - throw new Exception(nameof(LdInd)); - } - response = refLong(ref v5); - if (response == "0") - { - throw new Exception(nameof(LdInd)); - } - - console.log("success"); - - return; - - static string refSByte(ref sbyte value) - { - if (value == 0) - { - return "0"; - } - - return "1"; - } - static string refByte(ref byte value) - { - if (value == 0) - { - return "0"; - } - - return "1"; - } - - static string refShort(ref short value) - { - if (value == 0) - { - return "0"; - } - - return "1"; - } - - - static string refInt32(ref int value) - { - if (value == 0) - { - return "0"; - } - - return "1"; - } - - static string refFloat(ref float value) - { - if (value == 0) - { - return "0"; - } - - return "1"; - } - - static string refLong(ref long value) - { - if (value == 0) - { - return "0"; - } - - return "1"; - } - } - - - - - - - - static void TryCatchFinaly_0() - { - string value = "0"; - try - { - value += "1"; - } - catch (Exception) - { - value += "2"; - } - finally - { - value += "3"; - } - - if (value == "013") - { - console.log("success"); - } - else - { - console.log("fail"); - } - } - - static void TryCatchFinaly_1() - { - string value = "0"; - - try - { - try - { - value += "1"; - } - catch (Exception) - { - value +="2"; - } - finally - { - value += "3"; - } - } - catch (Exception) - { - value += "4"; - } - finally - { - value += "5"; - } - - if (value == "0135") - { - console.log("success"); - } - else - { - console.log("fail"); - } - } - - static void TryCatch_0() - { - var trace = "0"; - - try - { - trace += "1"; - - throw new Exception("-abc-"); - } - catch (Exception exception) - { - trace += "2"; - - trace += exception.Message; - } - - - if (trace == "012-abc-") - { - console.log("success"); - } - else - { - console.log("fail"); - } - } - - static void TryCatch_HandlerType() - { - Exception instance = null; - - var trace = "0"; - - try - { - trace += "1"; - - instance.Message.ToString(); - - trace += "2"; - } - catch (ArgumentOutOfRangeException) - { - trace += "3"; - } - catch (ArgumentException) - { - trace += "4"; - } - catch (NullReferenceException e) - { - trace += "5"; - } - - - if (trace == "015") - { - console.log("success"); - } - else - { - console.log("fail"); - } - } - - static void TryCatch_1() - { - var trace = "0"; - try - { - trace += "1"; - - trace += Call1455("t"); - } - catch (Exception exception) - { - trace += "2"; - - trace += exception.Message; - } - - - if (trace == "012-abc-") - { - console.log("success"); - } - else - { - console.log("fail"); - } - - return; - - static string Call1455(string a) - { - throw new Exception("-abc-"); - } - } - - static void BoxTest1() - { - int a = 5; - - object obj = a; - - if (obj is 5) - { - console.log("success"); - return; - } - - console.log("fail"); - } - - static void AutomaticallyLoadType() - { - var instance = new InvalidProgramException("abc"); - - var instance2 = new InvalidComObjectException("a", instance); - - if (instance2.Message =="a" && instance2.InnerException?.Message == "abc") - { - console.log("success"); - return; - } - - console.log("fail"); - } - - static void NullableIntTest() - { - int? nullableInt = 5; - - if (nullableInt.HasValue == false) - { - console.log("fail"); - return; - } - - if (nullableInt == null) - { - console.log("fail"); - return; - } - - if (nullableInt != 5) - { - console.log("fail"); - return; - } - - console.log("success"); - - } - - struct MyStruct - { - public int F0; - public string F1; - } - - struct MyStructGeneric - { - public int F0; - public string F1; - public A F2; - public B F3; - } - - static void StructCreationTest() - { - var myStruct = new MyStruct - { - F0 = 4, - F1 = "abc" - }; - - if (myStruct.F1 != "abc") - { - console.log("fail"); - return; - } - - if (myStruct.F0 != 4) - { - console.log("fail"); - return; - } - - console.log("success"); - } - - static void StructCreationGenericTest() - { - var myStruct = new MyStructGeneric - { - F0 = 4, - F1 = "abc", - F2 = 6, - F3 = "a" - }; - - if (myStruct.F0 != 4) - { - console.log("fail"); - return; - } - - if (myStruct.F1 != "abc") - { - console.log("fail"); - return; - } - - if (myStruct.F2 != 6) - { - console.log("fail"); - return; - } - - if (myStruct.F3 != "a") - { - console.log("fail"); - return; - } - - console.log("success"); - } - - public static string Abc5() - { - StructCreationTest(); - StructCreationGenericTest(); - - BoxTest1(); - ExternalCallTest.Static_Void_Call(); - ExternalCallTest.Static_NonVoid_Call(); - LdInd(); - NullableIntTest(); - TryCatch_0(); - TryCatch_1(); - TryCatch_HandlerType(); - TryCatchFinaly_0(); - TryCatchFinaly_1(); - AutomaticallyLoadType(); - - return "E N D"; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Dummy.cs b/ReactWithDotNet.WebSite/Dummy.cs deleted file mode 100644 index 38bf72da..00000000 --- a/ReactWithDotNet.WebSite/Dummy.cs +++ /dev/null @@ -1,12 +0,0 @@ -using ReactWithDotNet.WebSite.HeaderComponents; - -namespace ReactWithDotNet.WebSite; - -static class Dummy -{ - public static Menu Menu => MenuAccess.MenuList.First(); - - public static MenuItem MenuItem => Menu.Children.First(); - - public static string VideoUrl => "https://uploads.codesandbox.io/uploads/user/fb7bd72f-ef17-4810-9e14-ca854fb0f56e/9GBo-mountain-video.mp4"; -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/DynamicCode.cs b/ReactWithDotNet.WebSite/DynamicCode.cs deleted file mode 100644 index 0bb03e07..00000000 --- a/ReactWithDotNet.WebSite/DynamicCode.cs +++ /dev/null @@ -1,105 +0,0 @@ -using System.IO; -using System.Reflection; -using System.Runtime.Loader; -using Microsoft.CodeAnalysis; -using Microsoft.CodeAnalysis.CSharp; -using Microsoft.CodeAnalysis.Text; - -namespace ReactWithDotNet.WebSite; - -static class DynamicCode -{ - public static (bool isCompiledSuccessfully, byte[] bytesOfAssembly, string compileError) Compile(string assemblyName, IReadOnlyList sourceCodes) - { - using (var peStream = new MemoryStream()) - { - var result = GenerateCode(assemblyName, sourceCodes).Emit(peStream); - - if (!result.Success) - { - var compileErrors = result.Diagnostics - .Where(diagnostic => diagnostic.IsWarningAsError || diagnostic.Severity == DiagnosticSeverity.Error) - .Select(x => x.GetMessage()); - - return (default, default, string.Join(Environment.NewLine, compileErrors)); - } - - peStream.Seek(0, SeekOrigin.Begin); - - return (isCompiledSuccessfully: true, peStream.ToArray(), default); - } - } - - public static (bool isTypeFound, Type type, AssemblyLoadContext assemblyLoadContext, bool sourceCodeHasError, string sourceCodeError) - LoadAndFindType(string assemblyName, IReadOnlyList sourceCodes, string fullTypeName) - { - var (isCompiledSuccessfully, bytesOfAssembly, compileError) = Compile(assemblyName, sourceCodes); - if (!isCompiledSuccessfully) - { - return (isTypeFound: default, type: default, assemblyLoadContext: default, sourceCodeHasError: true, sourceCodeError: compileError); - } - - using (var asm = new MemoryStream(bytesOfAssembly)) - { - var assemblyLoadContext = new SimpleUnloadableAssemblyLoadContext(); - - var assembly = assemblyLoadContext.LoadFromStream(asm); - - var type = assembly.GetType(fullTypeName); - if (type == null) - { - assemblyLoadContext.Unload(); - - return default; - } - - return (isTypeFound: true, type, assemblyLoadContext, default, default); - } - } - - static CSharpCompilation GenerateCode(string assemblyName, IReadOnlyList sourceCodes) - { - var options = CSharpParseOptions.Default.WithLanguageVersion(LanguageVersion.Preview); - - var references = new List - { - MetadataReference.CreateFromFile(typeof(object).Assembly.Location), - MetadataReference.CreateFromFile(typeof(Console).Assembly.Location), - MetadataReference.CreateFromFile(typeof(Component).Assembly.Location), - MetadataReference.CreateFromFile(typeof(div).Assembly.Location) - }; - - Assembly.GetEntryAssembly()?.GetReferencedAssemblies().ToList() - .ForEach(a => references.Add(MetadataReference.CreateFromFile(Assembly.Load(a).Location))); - - const string globalUsings = """ - global using System; - global using System.Linq.Expressions; - global using ReactWithDotNet; - global using System.Collections.Generic; - global using System.Linq; - global using static ReactWithDotNet.Mixin; - global using System.Threading.Tasks; - """; - - return CSharpCompilation.Create(assemblyName, - sourceCodes.Select(sourceCode => SyntaxFactory.ParseSyntaxTree(SourceText.From(globalUsings + sourceCode), options)).ToArray(), - references, - new(OutputKind.DynamicallyLinkedLibrary, - optimizationLevel: OptimizationLevel.Release, - assemblyIdentityComparer: DesktopAssemblyIdentityComparer.Default)); - } - - class SimpleUnloadableAssemblyLoadContext : AssemblyLoadContext - { - public SimpleUnloadableAssemblyLoadContext() - : base(true) - { - } - - protected override Assembly Load(AssemblyName assemblyName) - { - return null; - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Extensions.cs b/ReactWithDotNet.WebSite/Extensions.cs deleted file mode 100644 index 54386abe..00000000 --- a/ReactWithDotNet.WebSite/Extensions.cs +++ /dev/null @@ -1,85 +0,0 @@ -using System.IO; - -namespace ReactWithDotNet.WebSite; - -static partial class Extensions -{ - public static string text_primary => "#1A2027"; - - public static readonly ReactContextKey ThemeKey = new(nameof(ThemeKey), _=>new()); - - - public static StyleModifier BorderRadiusForPaper => BorderRadius(4); - - public static StyleModifier DisplayNoneWhenMobile => WhenMediaMaxWidth(MD,DisplayNone); - public static StyleModifier DisplayNoneWhenNotMobile => MD(DisplayNone); - - - - - - - - public static string GetArticleHtmlContent(string filePathInContentFolder) - { - var path = Path.Combine("Content", filePathInContentFolder); - - return File.ReadAllText(path); - } - - public static List ToListOf(this IEnumerable enumerable, Func convert) - { - if (enumerable == null) - { - throw new ArgumentNullException(nameof(enumerable)); - } - - if (convert == null) - { - throw new ArgumentNullException(nameof(convert)); - } - - return enumerable.Select(convert).ToList(); - } - - static readonly Dictionary svgFileCache = new(); - - public static PureComponent GetSvgByClassName(string className) - { - className = className.Replace(".svg",""); - - if (svgFileCache.TryGetValue(className, out var instance)) - { - return instance; - } - - var type = typeof(Extensions).Assembly.GetType($"ReactWithDotNet.WebSite.SvgFiles.{className}",false); - if (type == null) - { - throw new TypeLoadException(className); - } - - instance = (PureComponent)Activator.CreateInstance(type); - - svgFileCache.TryAdd(className, instance); - - - return instance; - } - - public const int ContainerMaxWidth = 1200; - - public static Style ContainerStyle => - [ - WidthFull, - MaxWidth(ContainerMaxWidth), - DisplayFlexRow, - JustifyContentCenter, - - PaddingLeftRight(24) - ]; - - - - -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/GlobalUsings.cs b/ReactWithDotNet.WebSite/GlobalUsings.cs deleted file mode 100644 index 5cf510ed..00000000 --- a/ReactWithDotNet.WebSite/GlobalUsings.cs +++ /dev/null @@ -1,15 +0,0 @@ -global using System; -global using System.Linq.Expressions; -global using ReactWithDotNet; -global using System.Collections.Generic; -global using System.Linq; -global using static ReactWithDotNet.Mixin; -global using static ReactWithDotNet.WebSite.Extensions; -global using ReactWithDotNet.WebSite.Components; -global using System.Threading.Tasks; - - - -using System.Runtime.CompilerServices; - -[assembly: InternalsVisibleTo("ReactWithDotNet.WebSite.Test")] \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/HeaderComponents/HeaderMenuBar.cs b/ReactWithDotNet.WebSite/HeaderComponents/HeaderMenuBar.cs deleted file mode 100644 index 85b047f1..00000000 --- a/ReactWithDotNet.WebSite/HeaderComponents/HeaderMenuBar.cs +++ /dev/null @@ -1,146 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.MUI.Material; - -namespace ReactWithDotNet.WebSite.HeaderComponents; - -sealed class HeaderMenuBar : PureComponent -{ - static StyleModifier BorderRadius => BorderRadius(10); - - protected override Element render() - { - return new FlexRow(WidthFull, JustifyContentSpaceBetween, AlignItemsCenter, Height(60)) - { - new FlexRow(AlignItemsCenter) - { - new Logo(), - SpaceX(24), - new nav(DisplayFlex, AlignItemsCenter, WhenMediaMaxWidth(MD, DisplayNone)) - { - MenuAccess.MenuList.Select(x => new MenuView { Model = x }) - } - }, - - new MobileMenu(), - - new SocialMediaLinks() - }; - } - - sealed class SocialMediaLinks : PureComponent - { - protected override Element render() - { - var socialMediaLinks = new[] - { - new - { - Text = "GitHub", - Link = "https://github.com/beyaz/ReactWithDotNet", - Svg = "M12 1.27a11 11 0 00-3.48 21.46c.55.09.73-.28.73-.55v-1.84c-3.03.64-3.67-1.46-3.67-1.46-.55-1.29-1.28-1.65-1.28-1.65-.92-.65.1-.65.1-.65 1.1 0 1.73 1.1 1.73 1.1.92 1.65 2.57 1.2 3.21.92a2 2 0 01.64-1.47c-2.47-.27-5.04-1.19-5.04-5.5 0-1.1.46-2.1 1.2-2.84a3.76 3.76 0 010-2.93s.91-.28 3.11 1.1c1.8-.49 3.7-.49 5.5 0 2.1-1.38 3.02-1.1 3.02-1.1a3.76 3.76 0 010 2.93c.83.74 1.2 1.74 1.2 2.94 0 4.21-2.57 5.13-5.04 5.4.45.37.82.92.82 2.02v3.03c0 .27.1.64.73.55A11 11 0 0012 1.27" - }, - - new - { - Text = "Twitter", - Link = "https://x.com/ReactWithDotNet", - Svg = "M19.633 7.997c.013.175.013.349.013.523 0 5.325-4.053 11.461-11.46 11.461-2.282 0-4.402-.661-6.186-1.809.324.037.636.05.973.05a8.07 8.07 0 0 0 5.001-1.721 4.036 4.036 0 0 1-3.767-2.793c.249.037.499.062.761.062.361 0 .724-.05 1.061-.137a4.027 4.027 0 0 1-3.23-3.953v-.05c.537.299 1.16.486 1.82.511a4.022 4.022 0 0 1-1.796-3.354c0-.748.199-1.434.548-2.032a11.457 11.457 0 0 0 8.306 4.215c-.062-.3-.1-.611-.1-.923a4.026 4.026 0 0 1 4.028-4.028c1.16 0 2.207.486 2.943 1.272a7.957 7.957 0 0 0 2.556-.973 4.02 4.02 0 0 1-1.771 2.22 8.073 8.073 0 0 0 2.319-.624 8.645 8.645 0 0 1-2.019 2.083z" - } - }; - - return new FlexRow(Gap(15), AlignItemsCenter, MarginRight(50), WhenMediaMaxWidth(MD, DisplayNone)) - { - socialMediaLinks.Select(x => new a(Href(x.Link)) - { - DisplayFlex, FlexDirectionRow, AlignItemsCenter, JustifyContentCenter, - Border(Solid(1, Theme.grey_50)), - BorderRadius, - Padding(7), - Transition(BackgroundColor, 200, cubic_bezier(0.4, 0, 0.2, 1), 0), - Hover(Border(Solid(1, Theme.grey_300)), Background(Theme.grey_50)), - - new Tooltip - { - arrow = true, - title = x.Text, - - children = - { - new svg(Size(20), svg.Fill(Theme.Blue700), svg.ViewBox(0, 0, 24, 24)) - { - new path { d = x.Svg } - } - } - } - }) - }; - } - } - - sealed class MenuItemView : PureComponent - { - public MenuItem Model { get; init; } - - protected override Element render() - { - return new a(PaddingTopBottom(20), BorderRadius, PaddingLeft(20), PaddingRight(30), TextDecorationNone, CursorDefault) - { - WidthFull, - Href(Model.PageLink), - - LetterSpacingNormal, - BackgroundForPaper, - Border(1,solid,transparent), - Hover(Background(Gray50), BorderColor(Gray100)), - - new FlexRow(AlignItemsCenter, Gap(20), BorderRadius) - { - new img { Src(Asset(Model.SvgFileName)), Size(36) }, - new FlexColumn - { - FontFamily_IBM_Plex_Sans, - LineHeight21, - FontSize14, - Color(text_primary), - - new div(FontWeight600) { Model.Title }, - new div(FontWeight400) { Model.Description } - } - } - }; - } - } - - sealed class MenuView : PureComponent - { - public Menu Model { get; init; } - - protected override Element render() - { - return new Tooltip - { - classes = - { - { "tooltip", [Background(Theme.common_background), Padding(0), BorderRadius] } - }, - title = new FlexColumn(BorderRadius, Border(Solid(1, Theme.grey_200)), Width(400), BoxShadow(rgba(170, 180, 190, 0.3), 0, 4, 20)) - { - Model.Children.ToListOf(x => new MenuItemView { Model = x }) - }, - children = - { - new div - { - Text(Model.Title), - Padding(10), - Border(1,solid,transparent), - Hover(Background(Gray50), BorderColor(Gray200)), - BorderRadius, - FontSize14, - FontWeight700, - CursorDefault - } - } - }; - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/HeaderComponents/Logo.cs b/ReactWithDotNet.WebSite/HeaderComponents/Logo.cs deleted file mode 100644 index 2401b97f..00000000 --- a/ReactWithDotNet.WebSite/HeaderComponents/Logo.cs +++ /dev/null @@ -1,26 +0,0 @@ -namespace ReactWithDotNet.WebSite.HeaderComponents; - -sealed class Logo : PureComponent -{ - protected override Element render() - { - return new a(DisplayFlexColumn, TextDecorationNone, Color(inherit), Width(140), Href(Page.Home.Url), AlignItemsStretch, Padding(8)) - { - new FlexRow - { - SpaceX(12), - new img { Src(Asset("react.svg")), Size(24), Alt("React js") }, - SpaceX(60), - new img { Src(Asset("net_core_logo.svg")), Size(24), Alt(".Net") } - }, - - new FlexRow - { - new GradientText{"React",FontWeight500}, - new GradientText{" with ",FontWeight400 ,FontSize(15)}, - new GradientText{"DotNet",FontWeight500} - } - }; - } -} - diff --git a/ReactWithDotNet.WebSite/HeaderComponents/MainPageFooter.cs b/ReactWithDotNet.WebSite/HeaderComponents/MainPageFooter.cs deleted file mode 100644 index cbc37b5e..00000000 --- a/ReactWithDotNet.WebSite/HeaderComponents/MainPageFooter.cs +++ /dev/null @@ -1,18 +0,0 @@ -namespace ReactWithDotNet.WebSite.HeaderComponents; - -sealed class MainPageFooter : PureComponent -{ - protected override Element render() - { - return new footer - { - PaddingY(8), - DisplayFlexRowCentered, - WidthFull, - BorderTop(1, solid, Gray100), - Background(White), - - "React ", new GradientText { "♥", FontSize20 }, " .Net" - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/HeaderComponents/MainPageHeader.cs b/ReactWithDotNet.WebSite/HeaderComponents/MainPageHeader.cs deleted file mode 100644 index 737c0448..00000000 --- a/ReactWithDotNet.WebSite/HeaderComponents/MainPageHeader.cs +++ /dev/null @@ -1,17 +0,0 @@ -namespace ReactWithDotNet.WebSite.HeaderComponents; - -sealed class MainPageHeader : PureComponent -{ - protected override Element render() - { - return new header(DisplayFlex, WidthFull, Zindex2, JustifyContentCenter, BoxShadow(inset, 0,-1,1,0,rgb(231, 235, 240))) - { - PositionSticky, Top(0), BackgroundColor(rgba(255, 255, 255, 0.8)), BackdropFilterBlur(6), - - new div(ContainerStyle) - { - new HeaderMenuBar() - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/HeaderComponents/MenuAccess.cs b/ReactWithDotNet.WebSite/HeaderComponents/MenuAccess.cs deleted file mode 100644 index 3afe4073..00000000 --- a/ReactWithDotNet.WebSite/HeaderComponents/MenuAccess.cs +++ /dev/null @@ -1,69 +0,0 @@ -namespace ReactWithDotNet.WebSite.HeaderComponents; - -public class Menu -{ - public string Title { get; set; } - public IReadOnlyList Children { get; set; } -} -public class MenuItem -{ - public string Title { get; set; } - public string Description { get; set; } - public string PageLink { get; set; } - public string SvgFileName { get; set; } = "doc.svg"; -} - -static class MenuAccess -{ - public static IReadOnlyList MenuList => - [ - new() - { - Title = "Technical", - Children = - [ - new() - { - Title = "Technical Detail", - PageLink = Page.TechnicalDetail.Url, - Description = "Technical details of ReactWithDotnet" - }, - new() - { - Title = "Modifiers", - PageLink = Page.Modifiers.Url, - Description = "What is modifier" - }, - new() - { - Title = "React Context", - PageLink = Page.ReactContexts.Url, - Description = "How to implement react contexts" - } - ] - }, - - new() - { - Title = "Helper App", - Children = - [ - new() - { - Title = "Designer", - PageLink = Page.Designer.Url, - Description = "Preview components in hotreload mode", - SvgFileName = "design.svg" - }, - new() - { - Title = "Import Html", - PageLink = Page.LiveEditor.Url, - Description = "Import any html / Live Editor", - SvgFileName = "import.svg" - } - ] - } - ]; - -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/HeaderComponents/MobileMenu.cs b/ReactWithDotNet.WebSite/HeaderComponents/MobileMenu.cs deleted file mode 100644 index 18fe5a4e..00000000 --- a/ReactWithDotNet.WebSite/HeaderComponents/MobileMenu.cs +++ /dev/null @@ -1,97 +0,0 @@ -using static ReactWithDotNet.WebSite.HeaderComponents.MobileMenu; - -namespace ReactWithDotNet.WebSite.HeaderComponents; - -sealed class MobileMenu : Component -{ - protected override Element render() - { - return new div - { - new HamburgerButton { IsOpen = state.IsOpen, Click = ToggleIsOpen } + MD(DisplayNone), - - new FlexColumn(PositionFixed, Top(60), LeftRight(0), DisplayNoneWhenNotMobile, BoxShadow(rgba(170, 180, 190, 0.3), 0, 4, 20)) - { - AnimateHeightAndOpacity(state.IsOpen), - - When(state.IsOpen, MinHeight(20)), - BackgroundForPaper, - Padding(20), - Zindex(5), - - MenuAccess.MenuList.Select(m => new MenuView - { - Model = m, - children = - { - m.Children.Select(x => new a - { - Href(x.PageLink), - TextDecorationNone, - Color(Theme.text_secondary), - Padding(10), - - new div { x.Title, FontWeight700, FontSize14 }, - new div { x.Description, FontWeight400, FontSize14 } - }) - } - }) - } - }; - } - - static StyleModifier AnimateHeightAndOpacity(bool isVisible) - { - return Transition(nameof(Style.all), 300) + - Transition(nameof(Style.opacity), 300) + - (isVisible - ? VisibilityVisible + Opacity1 + HeightAuto - : VisibilityCollapse + Opacity0 + Height0); - } - - Task ToggleIsOpen(MouseEvent _) - { - state = state with { IsOpen = !state.IsOpen }; - - return Task.CompletedTask; - } - - sealed class MenuView : Component - { - public Menu Model { get; init; } - - protected override Element render() - { - return new div(Padding(10)) - { - new FlexRow(AlignItemsCenter, PaddingBottom(10)) - { - new span { Model.Title, FontSize14, FontWeight600, Color(Theme.text_secondary) }, - new ArrowUpDownIcon { IsArrowUp = state.IsOpen } + OnClick(ToggleIsOpen) - }, - new FlexColumn(JustifyContentSpaceEvenly, BorderLeft(Solid(1, Theme.grey_100)), PaddingLeft(10)) - { - AnimateHeightAndOpacity(state.IsOpen), - children - } - }; - } - - Task ToggleIsOpen(MouseEvent _) - { - state = state with { IsOpen = !state.IsOpen }; - - return Task.CompletedTask; - } - - internal sealed record State - { - public bool IsOpen { get; init; } - } - } - - internal record MobileMenuState - { - public bool IsOpen { get; init; } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/HelperApps/HtmlToCSharpView.cs b/ReactWithDotNet.WebSite/HelperApps/HtmlToCSharpView.cs deleted file mode 100644 index 3a96ee19..00000000 --- a/ReactWithDotNet.WebSite/HelperApps/HtmlToCSharpView.cs +++ /dev/null @@ -1,291 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries._react_split_; -using ReactWithDotNet.ThirdPartyLibraries.PrimeReact; -using ReactWithDotNet.ThirdPartyLibraries.ReactFreeScrollbar; -using static ReactWithDotNet.WebSite.Components.LivePreview; - -namespace ReactWithDotNet.WebSite.HelperApps; - -record HtmlToCSharpViewModel -{ - public string RenderPartOfCSharpCode { get; init; } - public int EditCount { get; init; } - public string HtmlText { get; init; } - public string StatusMessage { get; init; } - public string Guid { get; init; } -} - -class HtmlToCSharpView : Component -{ - static ScriptManager Scripts => ScriptManager.Instance; - - public Task Refresh() - { - return Task.CompletedTask; - } - - protected override Task constructor() - { - const string htmlText - = """ -
-
Latest News
-
    -
  • -
    Aenean euismod elementum
    -
    Vitae turpis massa sed elementum tempus egestas sed sed risus. In metus vulputate eu scelerisque felis imperdiet proin.
    -
    • -
  • -
    In iaculis nunc sed augue lacus
    -
    Viverra vitae congue. Nisi scelerisque eu ultrices vitae auctor eu augue ut lectus. Elementum eu facilisis sed odio morbi.
    -
    • -
  • -
    Proin sagittis nisl rhoncus
    -
    In pellentesque massa placerat duis ultricies lacus. Ac feugiat sed lectus vestibulum mattis ullamcorper.
    -
    • -
-
-
- - """; - - state = new() - { - HtmlText = htmlText, - Guid = Guid.NewGuid().ToString("N") - }; - - CalculateOutput(); - - return Task.CompletedTask; - } - - protected override Element render() - { - var htmlEditor = new CSharpCodeEditor - { - valueBind = () => state.HtmlText, - valueBindDebounceHandler = HtmlText_OnEditFinished - }; - - var csharpEditor = new CSharpCodeEditor - { - valueBind = () => state.RenderPartOfCSharpCode, - valueBindDebounceHandler = RenderPartOfCSharpCode_OnEditFinished - }; - - var statusMessageEditor = new Message - { - severity = "success", - text = state.StatusMessage, - style = { position = "fixed", zIndex = "5", bottom = "25px", right = "25px", display = state.StatusMessage is null ? "none" : "" } - }; - - return new FlexColumn - { - SizeFull, - Padding(10), - FontSize13, - - new FlexRow(FontSize23, Padding(10), WidthFull, JustifyContentSpaceBetween) - { - "Html to ReactWithDotNet", - new FlexRow(AlignItemsCenter, FontSize12) - { - new b(FontWeight500) - { - "Usage Info" - }, - ": Paste any html input panel then c# code will be genered automatically.", - - SpaceX(4), - new PlayButton - { - Label = "Play tutorial (2 min)", - VideoUrl = Asset("HtmlToCSharpView.mp4") - } - } - }, - new FlexRow(SizeFull) - { - new TwoRowSplittedForm - { - new FlexColumn(SizeFull, Gap(8)) - { - new GroupBox - { - Title = "Html input", - children = - { - new FreeScrollBar - { - htmlEditor - } - } - }, - - new GroupBox - { - Title = "c# output", - children = - { - new FreeScrollBar - { - new FlexColumn(HeightFull) - { - csharpEditor - } - } - } - } - }, - - new GroupBox - { - Title = "Preview", - children = - { - new FlexColumn(SizeFull, Padding(8)) - { - new iframe - { - id = state.Guid, - src = Page.LivePreviewUrl(state.Guid), - style = { BorderNone, SizeFull }, - title = "Live Editor Preview" - } - } - }, - style = - { - // paper - BackgroundImage("radial-gradient(#a5a8ed 0.5px, #f8f8f8 0.5px)"), - BackgroundSize("10px 10px") - } - } - } - }, - - statusMessageEditor - }; - } - - void CalculateOutput() - { - try - { - state = state with - { - RenderPartOfCSharpCode = HtmlToReactWithDotNetCsharpCodeConverter.HtmlToCSharp(state.HtmlText) - }; - - Scripts[state.Guid] = new() - { - RenderPartOfCSharpCode = state.RenderPartOfCSharpCode - }; - - RefreshComponentPreview(Client, state.Guid); - } - catch (Exception exception) - { - state = state with { StatusMessage = "Error occured: " + exception.Message }; - } - } - - Task HtmlText_OnEditFinished() - { - OnHtmlValueChanged(state.HtmlText); - return Task.CompletedTask; - } - - void OnHtmlValueChanged(string htmlText) - { - state = state with - { - EditCount = state.EditCount + 1, - StatusMessage = null, - HtmlText = htmlText - }; - - if (string.IsNullOrWhiteSpace(htmlText)) - { - state = state with - { - RenderPartOfCSharpCode = null - }; - - Scripts[state.Guid] = null; - - return; - } - - CalculateOutput(); - } - - Task RenderPartOfCSharpCode_OnEditFinished() - { - Scripts[state.Guid] = new() - { - RenderPartOfCSharpCode = state.RenderPartOfCSharpCode - }; - - RefreshComponentPreview(Client, state.Guid); - - return Task.CompletedTask; - } - - class GroupBox : PureComponent - { - public string Title { get; init; } - - protected override Element render() - { - return new fieldset(SizeFull, Border(Solid(0.8, rgb(226, 232, 240))), BorderRadius(4)) - { - new legend(MarginLeftRight(8), DisplayFlexRowCentered, Border(Solid(0.8, rgb(226, 232, 240))), BorderRadius(4)) - { - new label(FontWeight600, PaddingLeftRight(4)) - { - Title - } - }, - - children - }; - } - } - - class TwoRowSplittedForm : PureComponent - { - protected override Element render() - { - return new FlexRow(SizeFull) - { - new style - { - new("gutter", - [ - BackgroundRepeatNoRepeat, - BackgroundPosition("50%") - ]), - new("gutter.gutter-horizontal", - [ - BackgroundImage("url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==')"), - Cursor("col-resize") - ]) - }, - - new Split - { - sizes = [40, 60], - gutterSize = 12, - style = { WidthFull, DisplayFlexRow }, - - children = - { - children - } - } - }; - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/HelperApps/HtmlToReactWithDotNetCsharpCodeConverter.cs b/ReactWithDotNet.WebSite/HelperApps/HtmlToReactWithDotNetCsharpCodeConverter.cs deleted file mode 100644 index 1dffc7ab..00000000 --- a/ReactWithDotNet.WebSite/HelperApps/HtmlToReactWithDotNetCsharpCodeConverter.cs +++ /dev/null @@ -1,1412 +0,0 @@ -using System.Diagnostics; -using System.Reflection; -using System.Text; -using System.Text.Encodings.Web; -using System.Web; -using HtmlAgilityPack; -using PropertyInfo = System.Reflection.PropertyInfo; - -namespace ReactWithDotNet.WebSite.HelperApps; - -static class HtmlToReactWithDotNetCsharpCodeConverter -{ - static readonly IReadOnlyDictionary AttributeRealNameMap = new Dictionary - { - { "class", "className" }, - { "for", "htmlFor" }, - { "rowspan", "rowSpan" }, - { "colspan", "colSpan" }, - { "cellspacing", "cellSpacing" }, - { "cellpadding", "cellPadding" }, - { "tabindex", "tabIndex" }, - { "preserveaspectratio", "preserveAspectRatio" } - }; - - static readonly List ignoredTags = ["rect", "path", "circle", "line"]; - - public static string HtmlToCSharp(string htmlRootNode) - { - if (string.IsNullOrWhiteSpace(htmlRootNode)) - { - return null; - } - - htmlRootNode = AgilityPackageOverride.Encode(htmlRootNode); - - var document = new HtmlDocument(); - - document.LoadHtml(htmlRootNode.Trim()); - - return ToCSharpCode(ToCSharpCode(document.DocumentNode.FirstChild)); - } - - static string CamelCase(string str) - { - if (string.IsNullOrEmpty(str)) - { - return str; - } - - if (str.IndexOf('-') > 0) - { - return string.Join(string.Empty, str.Split("-").Select(CamelCase)); - } - - if (str == "lowercase") - { - return "LowerCase"; - } - - if (str == "uppercase") - { - return "UpperCase"; - } - - return char.ToUpper(str[0], new("en-US")) + str.Substring(1); - } - - static string ConvertToCSharpString(string value) - { - if (value == null) - { - return null; - } - - if (value.Contains('\u2028')) - { - value = value.Replace('\u2028', '\n'); - } - - if (value.Contains('\n')) - { - value = value.Replace("\"", "\"\""); - } - else - { - value = value.Replace("\"", "\\\""); - } - - if (value.Contains(" ")) - { - return string.Join(", nbsp, ", value.Split([" "], StringSplitOptions.None).Select(ConvertToCSharpString)); - } - - value = '"' + value + '"'; - - if (value.Contains('\n')) - { - value = '@' + value; - } - - return value; - } - - static bool EndsWithPixel(this string value) - { - return value?.EndsWith("px", StringComparison.OrdinalIgnoreCase) == true; - } - - static string GetName(this HtmlAttribute htmlAttribute) - { - var name = htmlAttribute.Name; - - if (htmlAttribute.OriginalName != name) - { - if (name.All(char.IsLower) && htmlAttribute.OriginalName.Any(char.IsUpper)) - { - name = htmlAttribute.OriginalName; - } - } - - if (AttributeRealNameMap.ContainsKey(name)) - { - return AttributeRealNameMap[name]; - } - - if (name.Contains(":")) - { - var parts = name.Split(":"); - if (parts.Length == 2) - { - return parts[0] + char.ToUpper(parts[1][0]) + parts[1][1..]; - } - } - - return name; - } - - static string GetTagName(this HtmlAttribute htmlAttribute) - { - return htmlAttribute.OwnerNode.Name; - } - - static bool HasValue(this string value) - { - return !string.IsNullOrWhiteSpace(value); - } - - static bool IsEndsWithPixel(string x) - { - return x.EndsWith("px", StringComparison.OrdinalIgnoreCase); - } - - static bool IsGlobalDeclaredStringVariable(string value) - { - if (value == none || - value == auto || - value == inset || - value == inherit || - value == transparent || - value == solid || - value == dotted) - { - return true; - } - - return false; - } - - static IReadOnlyList RemoveAll(this HtmlAttributeCollection htmlAttributeCollection, Func match) - { - var items = htmlAttributeCollection.Where(match).ToList(); - - foreach (var htmlAttribute in items) - { - htmlAttributeCollection.Remove(htmlAttribute); - } - - return items; - } - - static void RemoveAll(this HtmlNodeCollection htmlNodeCollection, Func match) - { - var nodes = htmlNodeCollection.Where(match).ToList(); - - foreach (var node in nodes) - { - htmlNodeCollection.Remove(node); - } - } - - /// - /// Removes from end. - /// - static string RemoveFromEnd(this string data, string value, StringComparison comparison = StringComparison.OrdinalIgnoreCase) - { - if (data.EndsWith(value, comparison)) - { - return data.Substring(0, data.Length - value.Length); - } - - return data; - } - - /// - /// Removes value from start of str - /// - static string RemoveFromStart(this string data, string value, StringComparison comparison = StringComparison.OrdinalIgnoreCase) - { - if (data == null) - { - return null; - } - - if (data.StartsWith(value, comparison)) - { - return data.Substring(value.Length, data.Length - value.Length); - } - - return data; - } - - class AgilityPackageOverride - { - public static string Encode(string styleText) - { - var index = 0; - while (true) - { - var (hasChange, newIndex, styleTextNewValue) = EncodeUrl(styleText,index); - if (hasChange is false) - { - return styleText; - } - - index = newIndex; - - styleText = styleTextNewValue; - } - } - - static (bool hasChange, int newIndex, string styleTextNewValue) EncodeUrl(string styleText, int startIndex) - { - var beginIndex = styleText.IndexOf("url(", startIndex, StringComparison.OrdinalIgnoreCase); - if (beginIndex > 0) - { - var endIndex = styleText.IndexOf(")", beginIndex, StringComparison.OrdinalIgnoreCase); - if (endIndex > 0) - { - var value = styleText.Substring(beginIndex, endIndex - beginIndex + 1); - - var partBegin = styleText.Substring(0, beginIndex); - var partEnd = styleText.Substring(endIndex+1, styleText.Length - endIndex -1); - - return (hasChange: true, newIndex: endIndex+1, styleTextNewValue: partBegin + EncodeValue(value) + partEnd); - } - } - - return default; - } - - static string EncodeValue(string value) => UrlEncoder.Default.Encode(value); - public static string DecodeValue(string value) => HttpUtility.UrlDecode(value); - - } - - static string RemovePixelFromEnd(this string value) - { - return value?.RemoveFromEnd("px"); - } - - static string ToCSharpCode(IEnumerable lines) - { - var sb = new StringBuilder(); - - var padding = 0; - - foreach (var line in lines) - { - var paddingAsString = "".PadRight(padding * 4, ' '); - if (line == "{") - { - sb.AppendLine(paddingAsString + line); - padding++; - continue; - } - - if (line == "}" || line == "},") - { - if (padding == 0) - { - throw new InvalidOperationException("Padding is already zero."); - } - - padding--; - paddingAsString = "".PadRight(padding * 4, ' '); - sb.AppendLine(paddingAsString + line); - - continue; - } - - sb.AppendLine(paddingAsString + line); - } - - return sb.ToString().Trim(); - } - - static List ToCSharpCode(HtmlNode htmlNode) - { - if (htmlNode.HasAttributes) - { - htmlNode.Attributes.Remove("onclick"); - } - - return ToCSharpCode(new Data - { - htmlNode = htmlNode - }); - } - - static List ToCSharpCode(Data data) - { - data = initHtmlNodeName(data); - - if (data.htmlNodeName == "#text") - { - if (string.IsNullOrWhiteSpace(data.htmlNode.InnerText)) - { - return []; - } - - if (data.htmlNode.InnerText == " ") - { - return ["nbsp"]; - } - - return [ConvertToCSharpString(data.htmlNode.InnerText)]; - } - - if (data.htmlNodeName == "br") - { - return ["br"]; - } - - data = data with { modifiers = [] }; - - data = grabStyleAttribute(data); - data = arrangeSvgSizeAttribute(data); - data = moveStylableAttributesToStyleForSvgAndPath(data); - data = tryArrangeInnerNodeText(data); - data = arrangeFlex(data); - data = arrangeShortwayStyle(data); - data = removeComments(data); - data = convertAllAttributesToModifiers(data); - data = moveStyleToModifiers(data); - data = moveClassNameModifierToFirst(data); - - if (data.htmlNode.ChildNodes.Count == 0) - { - return leafElementToString(data); - } - - if (data.htmlNode.ChildNodes.Count == 1 && data.htmlNode.ChildNodes[0].Name == "#text") - { - if (data.htmlNode.Attributes.Count == 0 && data.style is null) - { - return [$"({data.htmlNodeName})" + ConvertToCSharpString(data.htmlNode.ChildNodes[0].InnerText)]; - } - - return - [ - $"new {data.htmlNodeName}({JoinModifiers(data.modifiers)})", - "{", - ConvertToCSharpString(data.htmlNode.ChildNodes[0].InnerText), - "}" - ]; - } - - return exportMultiLine(data); - - static Data moveClassNameModifierToFirst(Data data) - { - var classNameModifierCode = data.modifiers.FirstOrDefault(x => x.Success && x.PartName == "ClassName"); - if (classNameModifierCode is not null) - { - data.modifiers.Remove(classNameModifierCode); - - data.modifiers.Insert(0, classNameModifierCode.PartParameterWithoutParanthesis); - } - - return data; - } - - static List leafElementToString(Data data) - { - Debug.Assert(data.htmlNode.ChildNodes.Count == 0); - - var sb = new StringBuilder(); - sb.Append($"new {data.htmlNodeName}"); - - var textModifierCode = data.modifiers.FirstOrDefault(x => x.Success && x.PartName == "Text"); - if (textModifierCode is not null) - { - data.modifiers.Remove(textModifierCode); - } - - var isBodyWritten = false; - var isConstructorWritten = false; - - if (data.modifiers.Count > 0) - { - isConstructorWritten = true; - - sb.Append("("); - sb.Append(JoinModifiers(data.modifiers)); - sb.Append(")"); - } - - var lines = new List { sb.ToString() }; - - if (textModifierCode is not null) - { - isBodyWritten = true; - - lines.Add("{"); - - lines.Add(textModifierCode.PartParameterWithoutParanthesis.RemoveFromStart("\"").RemoveFromEnd("\"")); - - lines.Add("}"); - } - - if (data.htmlNode.Attributes.Any()) - { - isBodyWritten = true; - - lines.Add("{"); - - foreach (var list in data.htmlNode.Attributes.Select(attributeToString)) - { - if (list.Count > 0) - { - lines.AddRange(list); - } - else - { - lines.Add(list[0]); - } - - lines[^1] += ","; - } - - lines[^1] = lines[^1].RemoveFromEnd(","); - lines.Add("}"); - } - - if (isConstructorWritten is false && isBodyWritten is false) - { - lines[^1] += "()"; - } - - return lines; - - List attributeToString(HtmlAttribute attribute) - { - if (attribute.Name == "style" && data.style is not null) - { - if (canStyleExportInOneLine(data.style)) - { - return [string.Join(", ", data.style.ToDictionary().Select(p => TryConvertToModifier_From_Mixin_Extension(p.Key, p.Value)).Where(x => x.success).Select(x => x.modifierCode))]; - } - - var returnList = new List - { - "style =", - "{" - }; - - returnList.AddRange(data.style.ToDictionary().Select(toLine)); - - returnList[^1] = returnList[^1].RemoveFromEnd(","); - - returnList.Add("}"); - - return returnList; - - static string toLine(KeyValuePair kv) - { - if (IsGlobalDeclaredStringVariable(kv.Value)) - { - return kv.Key + " = " + kv.Value + ","; - } - - return kv.Key + " = \"" + kv.Value + "\","; - } - } - - var propertyInfo = TryFindProperty(attribute.GetTagName(), attribute.GetName()); - if (propertyInfo is not null) - { - if (propertyInfo.PropertyType.IsGenericType) - { - if (propertyInfo.PropertyType.GetGenericTypeDefinition().Name.StartsWith("UnionProp`")) - { - var genericArguments = propertyInfo.PropertyType.GetGenericArguments(); - - if (genericArguments.Contains(typeof(double)) || - genericArguments.Contains(typeof(double)) || - genericArguments.Contains(typeof(double?))) - { - if (double.TryParse(attribute.Value.Replace(".", ""), out _)) - { - return [$"{propertyInfo.Name} = {attribute.Value}"]; - } - } - } - } - - if (IsGlobalDeclaredStringVariable(attribute.Value)) - { - return [$"{propertyInfo.Name} = {attribute.Value}"]; - } - - return [$"{propertyInfo.Name} = {(attribute.Value?.Contains(Environment.NewLine) is true ? "@" : null)}\"{attribute.Value}\""]; - } - - if (canBeExportInOneLine(data)) - { - return [$"/* {attribute.GetName()} = \"{attribute.Value}\"*/"]; - } - - return [$"// {attribute.GetName()} = \"{attribute.Value}\""]; - } - } - - static Data grabStyleAttribute(Data data) - { - var styleAttribute = data.htmlNode.Attributes["style"]; - if (styleAttribute != null) - { - if (!string.IsNullOrWhiteSpace(styleAttribute.Value)) - { - data = data with { style = Style.ParseCss(styleAttribute.Value) }; - - if (data.style.backgroundImage.HasValue()) - { - data.style.backgroundImage = AgilityPackageOverride.DecodeValue(data.style.backgroundImage); - } - } - - data.htmlNode.Attributes.Remove("style"); - } - - return data; - } - - static List exportMultiLine(Data data) - { - var partConstructor = ""; - if (data.modifiers.Count > 0) - { - partConstructor = $"({JoinModifiers(data.modifiers)})"; - } - - var lines = new List - { - $"new {data.htmlNodeName}{partConstructor}", - "{" - }; - - foreach (var items in data.htmlNode.ChildNodes.Select(ToCSharpCode)) - { - if (items.Count > 0) - { - items[^1] += ","; - } - - lines.AddRange(items); - } - - if (lines[^1].EndsWith(",", StringComparison.OrdinalIgnoreCase)) - { - lines[^1] = lines[^1].Remove(lines[^1].Length - 1); - } - - lines.Add("}"); - - return lines; - } - - static Data convertAllAttributesToModifiers(Data data) - { - if (!ignoredTags.Contains(data.htmlNode.Name)) - { - var attributes = new List(data.htmlNode.Attributes); - - foreach (var htmlAttribute in attributes) - { - var (success, modifierCode) = TryConvertToModifier(htmlAttribute); - if (success) - { - data.modifiers.Add(modifierCode); - - data.htmlNode.Attributes.Remove(htmlAttribute); - } - } - } - - return data; - } - - static bool canBeExportInOneLine(Data data) - { - if (data.htmlNode.Attributes.Contains("text")) - { - return false; - } - - if (data.style is not null) - { - if (canStyleExportInOneLine(data.style) is false) - { - return false; - } - } - - if (data.htmlNode.ChildNodes.Count == 0 && data.modifiers.Count > 0) - { - return false; - } - - if (data.htmlNode.Attributes.Count > 0) - { - return false; - } - - return true; - } - - static Data moveStyleToModifiers(Data data) - { - if (data.style is not null) - { - data.modifiers.AddRange(data.style.ToDictionary().Select(p => TryConvertToModifier_From_Mixin_Extension(p.Key, p.Value)).Select(ModifierCode.From)); - - data = data with { style = null }; - } - - return data; - } - - static Data removeComments(Data data) - { - data.htmlNode.ChildNodes.RemoveAll(childNode => childNode.Name == "#comment"); - - return data; - } - - static Data arrangeShortwayStyle(Data data) - { - if (data.style is null) - { - return data; - } - - // border - foreach (var prefix in new[] { "borderTop", "borderRight", "borderLeft", "borderBottom" }) - { - var xStyle = data.style[$"{prefix}Style"]; - var xWidth = data.style[$"{prefix}Width"]; - var xColor = data.style[$"{prefix}Color"]; - - if (data.style[prefix] is null) - { - if (string.IsNullOrWhiteSpace(xStyle) is false && - string.IsNullOrWhiteSpace(xWidth) is false && - string.IsNullOrWhiteSpace(xColor) is false) - { - data.style[prefix] = $"{xWidth} {xStyle} {xColor}"; - - data.style[$"{prefix}Style"] = data.style[$"{prefix}Width"] = data.style[$"{prefix}Color"] = null; - } - - if (string.IsNullOrWhiteSpace(xStyle) is false && - string.IsNullOrWhiteSpace(xWidth) is false && - string.IsNullOrWhiteSpace(xColor)) - { - data.style[prefix] = $"{xWidth} {xStyle}"; - - data.style[$"{prefix}Style"] = data.style[$"{prefix}Width"] = data.style[$"{prefix}Color"] = null; - } - } - } - - // p a d d i n g - if (data.style.paddingTop.HasValue() && - data.style.paddingRight.HasValue() && - data.style.paddingBottom.HasValue() && - data.style.paddingLeft.HasValue()) - { - data.style.padding = $"{data.style.paddingTop} {data.style.paddingRight} {data.style.paddingBottom} {data.style.paddingLeft}"; - - data.style.paddingTop = data.style.paddingRight = data.style.paddingBottom = data.style.paddingLeft = null; - } - - // m a r g i n - if (data.style.marginTop.HasValue() && - data.style.marginRight.HasValue() && - data.style.marginBottom.HasValue() && - data.style.marginLeft.HasValue()) - { - data.style.margin = $"{data.style.marginTop} {data.style.marginRight} {data.style.marginBottom} {data.style.marginLeft}"; - - data.style.marginTop = data.style.marginRight = data.style.marginBottom = data.style.marginLeft = null; - } - - // padding: TopBottom - if (data.style.paddingTop.EndsWithPixel() && - data.style.paddingBottom.EndsWithPixel() && - data.style.paddingTop == data.style.paddingBottom) - { - data.style.padding = MarkAsAlreadyCalculatedModifier($"PaddingTopBottom({data.style.paddingTop.RemovePixelFromEnd()})"); - - data.style.paddingTop = data.style.paddingBottom = null; - } - - // padding: LeftRight - if (data.style.paddingLeft.EndsWithPixel() && - data.style.paddingRight.EndsWithPixel() && - data.style.paddingLeft == data.style.paddingRight) - { - data.style.padding = MarkAsAlreadyCalculatedModifier($"PaddingLeftRight({data.style.paddingLeft.RemovePixelFromEnd()})"); - - data.style.paddingLeft = data.style.paddingRight = null; - } - - // margin: TopBottom - if (data.style.marginTop.EndsWithPixel() && - data.style.marginBottom.EndsWithPixel() && - data.style.marginTop == data.style.marginBottom) - { - data.style.margin = MarkAsAlreadyCalculatedModifier($"MarginTopBottom({data.style.marginTop.RemovePixelFromEnd()})"); - - data.style.marginTop = data.style.marginBottom = null; - } - - // margin: LeftRight - if (data.style.marginLeft.EndsWithPixel() && - data.style.marginRight.EndsWithPixel() && - data.style.marginLeft == data.style.marginRight) - { - data.style.margin = MarkAsAlreadyCalculatedModifier($"MarginLeftRight({data.style.marginLeft.RemovePixelFromEnd()})"); - - data.style.marginLeft = data.style.marginRight = null; - } - - // padding: SizeFull - if (data.style.width == "100%" && data.style.height == "100%") - { - data.style.width = MarkAsAlreadyCalculatedModifier("SizeFull"); - - data.style.height = null; - } - - // margin: WidthHeight - if (data.style.width.EndsWithPixel() && - data.style.height.EndsWithPixel() && - data.style.width == data.style.height) - { - data.style.width = MarkAsAlreadyCalculatedModifier($"Size({data.style.width.RemovePixelFromEnd()})"); - - data.style.height = null; - } - - return data; - } - - static Data arrangeFlex(Data data) - { - if (data.htmlNodeName != "div") - { - return data; - } - - var style = data.style; - - if (style is null) - { - return data; - } - - // c o l u m n s - if (style.display == "inline-flex" && - style.flexDirection == "column" && - style.justifyContent == "center" && - style.alignItems == "center") - { - data = data with { htmlNodeName = "InlineFlexColumnCentered" }; - - style.display = style.flexDirection = style.justifyContent = style.alignItems = null; - } - - if (style.display == "inline-flex" && - style.flexDirection == "column") - { - data = data with { htmlNodeName = "InlineFlexColumn" }; - - style.display = style.flexDirection = null; - } - - if (style.display == "flex" && - style.flexDirection == "column" && - style.justifyContent == "center" && - style.alignItems == "center") - { - data = data with { htmlNodeName = "FlexColumnCentered" }; - - style.display = style.flexDirection = style.justifyContent = style.alignItems = null; - } - - if (style.display == "flex" && style.flexDirection == "column") - { - data = data with { htmlNodeName = "FlexColumn" }; - - style.display = style.flexDirection = null; - } - - // r o w - if (style.display == "inline-flex" && - (style.flexDirection is null || style.flexDirection == "row") && - style.justifyContent == "center" && - style.alignItems == "center") - { - data = data with { htmlNodeName = "InlineFlexRowCentered" }; - - style.display = style.flexDirection = style.justifyContent = style.alignItems = null; - } - - if (style.display == "inline-flex" && - (style.flexDirection is null || style.flexDirection == "row")) - { - data = data with { htmlNodeName = "InlineFlexRow" }; - - style.display = style.flexDirection = null; - } - - if (style.display == "flex" && - (style.flexDirection is null || style.flexDirection == "row") && - style.justifyContent == "center" && - style.alignItems == "center") - { - data = data with { htmlNodeName = "FlexRowCentered" }; - - style.display = style.flexDirection = style.justifyContent = style.alignItems = null; - } - - if (style.display == "flex" && (style.flexDirection is null || style.flexDirection == "row")) - { - data = data with { htmlNodeName = "FlexRow" }; - - style.display = style.flexDirection = null; - } - - return data; - } - - static Data tryArrangeInnerNodeText(Data data) - { - if (data.htmlNode.ChildNodes.Count == 1 && data.htmlNode.ChildNodes[0].Name == "#text") - { - var text = data.htmlNode.ChildNodes[0].InnerText.Trim(); - - if (string.IsNullOrWhiteSpace(text) is false) - { - data.modifiers.Insert(0, $"Text(\"{ConvertToCSharpString(text)}\")"); - } - - data.htmlNode.ChildNodes.RemoveAt(0); - } - - return data; - } - - static Data moveStylableAttributesToStyleForSvgAndPath(Data data) - { - var htmlNode = data.htmlNode; - - if (htmlNode.Name == "svg" || htmlNode.Name == "path") - { - foreach (var htmlAttribute in htmlNode.Attributes.RemoveAll(x => isStyleAttribute(htmlNode, x))) - { - data = data with { style = data.style ?? new() }; - - data.style[htmlAttribute.Name] = htmlAttribute.Value; - } - } - - return data; - - static bool isStyleAttribute(HtmlNode htmlNode, HtmlAttribute htmlAttribute) - { - if (htmlNode.Name == "svg" && "size".Equals(htmlAttribute.Name, StringComparison.OrdinalIgnoreCase)) - { - return false; - } - - if (TryFindProperty(htmlNode.Name, htmlAttribute.Name) is null) - { - if (typeof(Style).GetProperty(htmlAttribute.Name.Replace("-", ""), BindingFlags.Public | BindingFlags.Instance | BindingFlags.IgnoreCase) is not null) - { - return true; - } - } - - return false; - } - } - - static Data arrangeSvgSizeAttribute(Data data) - { - if (data.htmlNode.Name == "svg") - { - if (data.htmlNode.Attributes.Contains("xmlns") && data.htmlNode.Attributes["xmlns"].Value == "http://www.w3.org/2000/svg") - { - data.htmlNode.Attributes.Remove("xmlns"); - } - - if (data.htmlNode.Attributes.Contains("width") && - data.htmlNode.Attributes.Contains("height") && - data.htmlNode.Attributes["width"].Value == data.htmlNode.Attributes["height"].Value) - { - data.htmlNode.Attributes.Add("size", data.htmlNode.Attributes["width"].Value); - - data.htmlNode.Attributes.Remove("width"); - data.htmlNode.Attributes.Remove("height"); - } - } - - return data; - } - - static Data initHtmlNodeName(Data data) - { - var htmlNodeName = data.htmlNode.OriginalName; - if (htmlNodeName == "clippath") - { - htmlNodeName = "clipPath"; - } - - return data with { htmlNodeName = htmlNodeName }; - } - - static bool canStyleExportInOneLine(Style style) - { - return style.ToDictionary().Count <= 3; - } - - static string JoinModifiers(IReadOnlyList modifiers) - { - return string.Join(" ", modifiers.Where(ModifierCode.IsFail).Select(x => x.Code)) + - string.Join(", ", modifiers.Where(ModifierCode.IsSuccess).Select(x => x.Code)); - } - } - - static (bool success, string modifierCode) TryConvertToModifier(HtmlAttribute htmlAttribute) - { - var name = htmlAttribute.GetName(); - var value = htmlAttribute.Value; - var tagName = htmlAttribute.OwnerNode.Name; - - var success = (string modifierCode) => (true, modifierCode); - - if ((tagName == "iframe" || tagName == "script") && name.Equals("src", StringComparison.OrdinalIgnoreCase)) - { - return success($"{tagName}.Src({value})"); - } - - if (tagName == "svg" && name.Equals("size", StringComparison.OrdinalIgnoreCase) && double.TryParse(value.RemovePixelFromEnd(), out _)) - { - return success($"svg.Size({value.RemovePixelFromEnd()})"); - } - - if (tagName == "symbol" && name.Equals("viewBox", StringComparison.OrdinalIgnoreCase)) - { - return success($"symbol.ViewBox(\"{value}\")"); - } - - if (tagName == "source" && name.Equals("src", StringComparison.OrdinalIgnoreCase)) - { - return success($"source.Src(\"{value}\")"); - } - - if (tagName == "svg" && name.Equals("width", StringComparison.OrdinalIgnoreCase) && double.TryParse(value, out _)) - { - return success($"svg.Width({value})"); - } - - if (tagName == "svg" && name.Equals("height", StringComparison.OrdinalIgnoreCase) && double.TryParse(value, out _)) - { - return success($"svg.Height({value})"); - } - - if (name == "focusable" && tagName == "svg") - { - if ("true".Equals(value, StringComparison.OrdinalIgnoreCase)) - { - return success($"svg.{nameof(svg.FocusableTrue)}"); - } - - if ("false".Equals(value, StringComparison.OrdinalIgnoreCase)) - { - return success($"svg.{nameof(svg.FocusableFalse)}"); - } - - if ("auto".Equals(value, StringComparison.OrdinalIgnoreCase)) - { - return success($"svg.{nameof(svg.FocusableAuto)}"); - } - - return success($"svg.Focusable(\"{value}\")"); - } - - if (name == "type" && tagName == "button") - { - return success($"button.Type(\"{value}\")"); - } - - if (name.Equals("viewbox", StringComparison.OrdinalIgnoreCase) && tagName == "svg") - { - var parseResponse = tryParseViewBoxValues(value); - if (parseResponse.success) - { - return success($"ViewBox({string.Join(", ", parseResponse.parameters)})"); - } - - return success($"ViewBox(\"{value}\")"); - } - - var response = TryConvertToModifier_From_Mixin_Extension(name, value); - if (response.success) - { - return response; - } - - var propertyInfo = TryFindProperty(tagName, name); - if (propertyInfo is not null) - { - if (propertyInfo.PropertyType == typeof(double?) || propertyInfo.PropertyType == typeof(double)) - { - if (double.TryParse(value, out var valueAsDouble)) - { - return success($"{tagName}.{UpperCaseFirstChar(propertyInfo.Name)}({valueAsDouble})"); - } - } - - if (propertyInfo.PropertyType == typeof(int?)) - { - if (int.TryParse(value, out var valueAsInt32)) - { - return success($"{tagName}.{UpperCaseFirstChar(propertyInfo.Name)}({valueAsInt32})"); - } - } - - return success($"{tagName}.{UpperCaseFirstChar(propertyInfo.Name)}(\"{value}\")"); - } - - return (success: false, modifierCode: $"/* {tagName}.{name} = \"{value}\"*/"); - - static string UpperCaseFirstChar(string str) - { - return char.ToUpper(str[0], new("en-US")) + str.Substring(1); - } - - static (bool success, string[] parameters) tryParseViewBoxValues(string value) - { - var parameters = value.Split(' ', StringSplitOptions.RemoveEmptyEntries).ToArray(); - if (parameters.Length == 4) - { - return (true, parameters); - } - - return default; - } - } - - static (bool success, string modifierCode) TryConvertToModifier_From_Mixin_Extension(string name, string value) - { - var success = (string modifierCode) => (true, modifierCode); - - value ??= string.Empty; - - // data- or aria- - { - if (isAriaAttribute(name)) - { - return success(toAriaModifier(name, value)); - } - - if (isDataAttribute(name)) - { - return success(toDataModifier(name, value)); - } - - static bool isDataAttribute(string name) - { - return name.StartsWith("data-", StringComparison.OrdinalIgnoreCase); - } - - static string toDataModifier(string name, string value) - { - return $"Data(\"{name.RemoveFromStart("data-")}\", \"{value}\")"; - } - - static bool isAriaAttribute(string name) - { - return name.StartsWith("aria-", StringComparison.OrdinalIgnoreCase); - } - - static string toAriaModifier(string name, string value) - { - return $"Aria(\"{name.RemoveFromStart("aria-")}\", \"{value}\")"; - } - } - - if (name == "target" && value == "_blank") - { - return success("TargetBlank"); - } - - if (name.Equals("Width", StringComparison.OrdinalIgnoreCase) && value == "100%") - { - return success("WidthFull"); - } - - if (name.Equals("Height", StringComparison.OrdinalIgnoreCase) && value == "100%") - { - return success("HeightFull"); - } - - if (name.Equals("boxShadow", StringComparison.OrdinalIgnoreCase)) - { - var parseResponse = TryParseBoxShadow(value); - if (parseResponse.success) - { - return success($"BoxShadow({string.Join(", ", parseResponse.parameters)})"); - } - - return success($"{CamelCase(name)}(\"{value}\")"); - } - - if (name == "borderLeft" || name == "borderRight" || name == "borderTop" || name == "borderBottom") - { - var parameterList = value.Split(' ', StringSplitOptions.RemoveEmptyEntries).Select(x => x.Trim()).ToList(); - - if (parameterList.Count == 3 && parameterList[0].EndsWithPixel()) - { - return success($"{CamelCase(name)}({parameterList[0].RemovePixelFromEnd()}, {asParameter(parameterList[1])}, {asParameter(parameterList[2])})"); - - static string asParameter(string parameter) - { - if (parameter == "solid") - { - return "solid"; - } - - return '"' + parameter + '"'; - } - } - } - - if (IsMarkedAsAlreadyCalculatedModifier(value)) - { - return success(UnMarkAsAlreadyCalculatedModifier(value)); - } - - if (name == nameof(Style.padding) || name == nameof(Style.margin) || name == nameof(Style.borderRadius)) - { - var parameters = value.Split(' ', StringSplitOptions.RemoveEmptyEntries).Select(x => x.Trim()).ToList(); - - if (parameters.TrueForAll(IsEndsWithPixel)) - { - var methodName = CamelCase(name); - - var joinAllParameters = () => { return $"{methodName}({string.Join(", ", parameters.Select(x => x.RemovePixelFromEnd()))})"; }; - - switch (parameters.Count) - { - // 5px 5px - case 2 when parameters[0] == parameters[1]: - return success($"{methodName}({parameters[0].RemovePixelFromEnd()})"); - - // 5px 5px 5px 5px - case 4 when parameters[0] == parameters[1] && - parameters[0] == parameters[2] && - parameters[0] == parameters[3]: - return success($"{methodName}({parameters[0].RemovePixelFromEnd()})"); - - // 5px 6px 5px 6px - case 4 when parameters[0] == parameters[2] && - parameters[1] == parameters[3]: - return success($"{methodName}({parameters[0].RemovePixelFromEnd()}, {parameters[1].RemovePixelFromEnd()})"); - - // 5px 6px - // 5px 6px 8px - // 5px 6px 7px 8px - - case 1: - case 2: - case 3: - case 4: - return success(joinAllParameters()); - } - } - } - - if (name == "flex") - { - var parameters = value.Split(' ', StringSplitOptions.RemoveEmptyEntries).Select(x => x.Trim()).ToList(); - if (parameters.Count == 3 && parameters.TrueForAll(x => double.TryParse(x, out _))) - { - return success($"Flex({parameters[0]}, {parameters[1]}, {parameters[2]})"); - } - - if (parameters.Count == 3 && double.TryParse(parameters[0], out _) && double.TryParse(parameters[1], out _) && parameters[2] == "auto") - { - return success($"Flex({parameters[0]}, {parameters[1]}, {parameters[2]})"); - } - } - - var modifierFullName = $"{CamelCase(name)}{CamelCase(value.RemovePixelFromEnd())}"; - - if (typeof(Mixin).GetProperty(modifierFullName) is not null) - { - return success(modifierFullName); - } - - if (typeof(Mixin).GetMethod(CamelCase(name), [typeof(string)]) is not null) - { - if (typeof(Mixin).GetMethod(CamelCase(name), [typeof(double)]) is not null && - value.EndsWithPixel() && value.IndexOf(' ') < 0) - { - return success($"{CamelCase(name)}({value.RemovePixelFromEnd()})"); - } - - if (value.StartsWith("rgb(", StringComparison.OrdinalIgnoreCase) && - value.EndsWith(")", StringComparison.OrdinalIgnoreCase)) - { - return success($"{CamelCase(name)}({value})"); - } - - if (IsGlobalDeclaredStringVariable(value)) - { - return success($"{CamelCase(name)}({value})"); - } - - if (typeof(Mixin).GetMethod(CamelCase(name), [typeof(int)]) is not null && - int.TryParse(value, out _)) - { - return success($"{CamelCase(name)}({value})"); - } - - if (typeof(Mixin).GetMethod(CamelCase(name), [typeof(double)]) is not null && - double.TryParse(value, out _)) - { - return success($"{CamelCase(name)}({value})"); - } - - return success($"{CamelCase(name)}(\"{value}\")"); - } - - return default; - - static (bool success, IReadOnlyList parameters) TryParseBoxShadow(string boxShadow) - { - // sample: "0.1px 1px 2px rgba(28, 43, 61, 0.12)" - - if (boxShadow is null) - { - return default; - } - - var index = boxShadow.IndexOf("rgba", StringComparison.OrdinalIgnoreCase); - if (index <= 0) - { - index = boxShadow.IndexOf("rgb", StringComparison.OrdinalIgnoreCase); - } - - if (index > 0) - { - var firstPart = boxShadow.Substring(0, index); - - var list = firstPart.Split(' ', StringSplitOptions.RemoveEmptyEntries).ToList(); - if (list.TrueForAll(x => x.EndsWithPixel())) - { - var parameters = list.Select(x => x.RemovePixelFromEnd()).ToList(); - parameters.Add(boxShadow.Substring(index)); - return (success: true, parameters); - } - } - - return default; - } - } - - static PropertyInfo TryFindProperty(string htmlTagName, string attributeName) - { - var propertyName = string.Join(string.Empty, attributeName.Split(":-".ToCharArray(), StringSplitOptions.RemoveEmptyEntries).Select(x => x.Trim())); - - return TryFindTypeOfHtmlTag(htmlTagName)?.GetProperty(propertyName, BindingFlags.IgnoreCase | BindingFlags.Public | BindingFlags.Instance); - } - - static Type TryFindTypeOfHtmlTag(string htmlTagName) - { - return typeof(div).Assembly.GetType(nameof(ReactWithDotNet) + "." + htmlTagName, false, true); - } - - sealed class ModifierCode - { - public string Code { get; private init; } - - public string PartName - { - get - { - var leftParanthesisIndex = Code.IndexOf('(', StringComparison.OrdinalIgnoreCase); - if (leftParanthesisIndex <= 0) - { - return Code; - } - - return Code[..leftParanthesisIndex]; - } - } - - public string PartParameterWithoutParanthesis - { - get - { - var leftParanthesisIndex = Code.IndexOf('(', StringComparison.OrdinalIgnoreCase); - if (leftParanthesisIndex > 0) - { - var rightParanthesisIndex = Code.LastIndexOf(')'); - if (rightParanthesisIndex > 0) - { - return Code.Substring(leftParanthesisIndex + 1, rightParanthesisIndex - leftParanthesisIndex - 1); - } - } - - return null; - } - } - - public bool Success { get; private init; } - - public static ModifierCode From((bool success, string modifierCode) tuple) - { - return new() { Code = tuple.modifierCode, Success = tuple.success }; - } - - public static bool IsFail(ModifierCode item) - { - return item.Success is false; - } - - public static bool IsSuccess(ModifierCode item) - { - return item.Success; - } - - public static implicit operator ModifierCode(string code) - { - return FromString(code); - } - - public override string ToString() - { - return Success ? Code : "fail"; - } - - static ModifierCode FromString(string code) - { - return new() { Code = code, Success = true }; - } - } - - record Data - { - public HtmlNode htmlNode { get; init; } - - public string htmlNodeName { get; init; } - - public Style style { get; init; } - public List modifiers { get; init; } - } - - #region already calculated modifier - - static string MarkAsAlreadyCalculatedModifier(string modifierCode) - { - return "|" + modifierCode; - } - - static string UnMarkAsAlreadyCalculatedModifier(string modifierCode) - { - return modifierCode.Substring(1); - } - - static bool IsMarkedAsAlreadyCalculatedModifier(string modifierCode) - { - return modifierCode?.Length > 2 && modifierCode[0] == '|'; - } - - #endregion -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Infrastructure/Page.cs b/ReactWithDotNet.WebSite/Infrastructure/Page.cs deleted file mode 100644 index 955d238a..00000000 --- a/ReactWithDotNet.WebSite/Infrastructure/Page.cs +++ /dev/null @@ -1,48 +0,0 @@ -using ReactWithDotNet.WebSite.HelperApps; -using ReactWithDotNet.WebSite.Pages; - -namespace ReactWithDotNet.WebSite; - -sealed record PageRouteInfo(string Url, Type page); - -static class Page -{ - // H o m e - public static readonly PageRouteInfo Home = new("/", typeof(PageMain)); - - // H o m e b u t t o n s - public static readonly PageRouteInfo Milestones = new($"/{nameof(Milestones)}", typeof(PageMilestones)); - public static readonly PageRouteInfo Showcase = new($"/{nameof(Showcase)}", typeof(PageShowcase)); - - // T e c h n i c a l - public static readonly PageRouteInfo TechnicalDetail = new($"/{nameof(TechnicalDetail)}", typeof(PageTechnicalDetail)); - public static readonly PageRouteInfo Modifiers = new($"/{nameof(Modifiers)}", typeof(PageModifiers)); - public static readonly PageRouteInfo ReactContexts = new($"/{nameof(ReactContexts)}", typeof(PageReactContexts)); - - // D o c - public static readonly PageRouteInfo DocStart = new("/doc/start", typeof(PageDocumentation_Start)); - public static readonly PageRouteInfo DocSetup = new("/doc/setup", typeof(PageDocumentation_Setup)); - - // H e l p e r A p p s - public static readonly PageRouteInfo LiveEditor = new("/LiveEditor", typeof(HtmlToCSharpView)); - public static readonly PageRouteInfo LivePreview = new($"/{nameof(LivePreview)}", typeof(LivePreview)); - public static readonly PageRouteInfo Designer = new($"/{nameof(Designer)}", typeof(PageDesigner)); - - // i n t e r n a l - public static readonly PageRouteInfo DemoPreview = new($"/{nameof(DemoPreview)}", typeof(DemoPreview)); - - - public static string DemoPreviewUrl(string fullTypeName) - { - return DemoPreview.Url + $"?{Pages.DemoPreview.QueryParameterNameOfFullTypeName}={fullTypeName}"; - } - - public static string LivePreviewUrl(string guid) - { - return LivePreview.Url + $"?{Components.LivePreview.QueryParameterNameOfGuid}={guid}"; - } - - - - -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Infrastructure/Program.cs b/ReactWithDotNet.WebSite/Infrastructure/Program.cs deleted file mode 100644 index ed8b1b6e..00000000 --- a/ReactWithDotNet.WebSite/Infrastructure/Program.cs +++ /dev/null @@ -1,78 +0,0 @@ -using System.IO.Compression; -using Microsoft.AspNetCore.Builder; -using Microsoft.AspNetCore.Http; -using Microsoft.AspNetCore.ResponseCompression; -using Microsoft.AspNetCore.StaticFiles; -using Microsoft.Extensions.DependencyInjection; -using Microsoft.Extensions.Hosting; - -namespace ReactWithDotNet.WebSite; - -public class Program -{ - public static void Main(string[] args) - { - var builder = WebApplication.CreateBuilder(args); - - var services = builder.Services; - - // C O N F I G U R E S E R V I C E S - services.Configure(options => { options.Level = CompressionLevel.Fastest; }); - services.Configure(options => { options.Level = CompressionLevel.Optimal; }); - services.AddResponseCompression(options => - { - options.EnableForHttps = true; - options.Providers.Add(); - options.Providers.Add(); - }); - - // C O N F I G U R E A P P L I C A T I O N - var app = builder.Build(); - - if (!app.Environment.IsDevelopment()) - { - app.UseDeveloperExceptionPage(); - } - - app.UseHttpsRedirection(); - - app.UseRouting(); - - app.ConfigureReactWithDotNet(); - - app.UseStaticFiles(new StaticFileOptions - { - RequestPath = new("/wwwroot"), - ContentTypeProvider = new Utf8CharsetContentTypeProvider(), - OnPrepareResponse = ctx => { ctx.Context.Response.Headers.Append("Cache-Control", $"public, max-age={TimeSpan.FromMinutes(5).TotalSeconds}"); } - }); - - app.UseResponseCompression(); - - app.Run(); - } - - class Utf8CharsetContentTypeProvider : IContentTypeProvider - { - readonly IContentTypeProvider _defaultProvider = new FileExtensionContentTypeProvider(); - - public bool TryGetContentType(string subpath, out string contentType) - { - subpath = subpath.ToLower(); - - if (subpath.EndsWith(".js", StringComparison.OrdinalIgnoreCase)) - { - contentType = "application/javascript; charset=utf-8"; - return true; - } - - if (subpath.EndsWith(".css", StringComparison.OrdinalIgnoreCase)) - { - contentType = "text/css; charset=utf-8"; - return true; - } - - return _defaultProvider.TryGetContentType(subpath, out contentType); - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Infrastructure/ReactWithDotNetIntegration.cs b/ReactWithDotNet.WebSite/Infrastructure/ReactWithDotNetIntegration.cs deleted file mode 100644 index c3f729d7..00000000 --- a/ReactWithDotNet.WebSite/Infrastructure/ReactWithDotNetIntegration.cs +++ /dev/null @@ -1,132 +0,0 @@ -using System.IO; -using System.Reflection; -using Microsoft.AspNetCore.Builder; -using Microsoft.AspNetCore.Http; -using Microsoft.Net.Http.Headers; -using ReactWithDotNet.UIDesigner; - -namespace ReactWithDotNet.WebSite; - -public static class ReactWithDotNetIntegration -{ - public static void ConfigureReactWithDotNet(this WebApplication app) - { - app.UseMiddleware(); - - var map = typeof(Page) - .GetFields(BindingFlags.Static | BindingFlags.Public) - .Where(f => f.FieldType == typeof(PageRouteInfo)) - .Select(f => (PageRouteInfo)f.GetValue(null)) - .Where(x => x is not null) - .ToDictionary(x => x.Url, x => x, StringComparer.OrdinalIgnoreCase); - - RequestHandlerPath = "/" + nameof(HandleReactWithDotNetRequest); - - MetadataRequestHandlerPath = "/" + nameof(GetMetadata); - - app.Use(async (httpContext, next) => - { - var path = httpContext.Request.Path.Value ?? string.Empty; - - if (path == RequestHandlerPath) - { - await HandleReactWithDotNetRequest(httpContext); - return; - } - - if (map.TryGetValue(path, out var routeInfo)) - { - await WriteHtmlResponse(httpContext, typeof(MainLayout), routeInfo.page); - return; - } - - if (path == "/UploadFile") - { - await UploadFileAndWriteResponse(httpContext); - return; - } - -#if DEBUG - if (path == ReactWithDotNetDesigner.UrlPath) - { - await WriteHtmlResponse(httpContext, typeof(MainLayout), typeof(ReactWithDotNetDesigner)); - return; - } -#endif - - if (path == MetadataRequestHandlerPath) - { - await GetMetadata(httpContext); - return; - } - - await next(); - }); - } - - static Task HandleReactWithDotNetRequest(HttpContext httpContext) - { - httpContext.Response.ContentType = "application/json; charset=utf-8"; - - return ProcessReactWithDotNetComponentRequest(new() - { - HttpContext = httpContext, - OnReactContextCreated = OnReactContextCreated - }); - } - - static Task OnReactContextCreated(ReactContext context) - { - return Task.CompletedTask; - } - - static async Task UploadFile(HttpContext httpContext) - { - var request = httpContext.Request; - if (!request.HasFormContentType) - { - return Results.BadRequest("The request doesn't contain form content type"); - } - - var form = await request.ReadFormAsync(); - var file = form.Files["file"]; - if (file == null || file.Length == 0) - { - return Results.BadRequest("The file is empty or not provided"); - } - - var filePath = Path.Combine(@"C:\Users\beyaz\Downloads\", file.FileName); - - await using (var stream = new FileStream(filePath, FileMode.Create)) - { - await file.CopyToAsync(stream); - } - - return Results.Ok(new { FilePath = filePath }); - } - - static async Task UploadFileAndWriteResponse(HttpContext httpContext) - { - var uploadResult = await UploadFile(httpContext); - - await uploadResult.ExecuteAsync(httpContext); - } - - static Task WriteHtmlResponse(HttpContext httpContext, Type layoutType, Type mainContentType) - { - httpContext.Response.ContentType = "text/html; charset=UTF-8"; - - httpContext.Response.Headers[HeaderNames.CacheControl] = "no-cache, no-store, must-revalidate"; - httpContext.Response.Headers[HeaderNames.Expires] = "0"; - httpContext.Response.Headers[HeaderNames.Pragma] = "no-cache"; - - return ProcessReactWithDotNetPageRequest(new() - { - LayoutType = layoutType, - MainContentType = mainContentType, - HttpContext = httpContext, - QueryString = httpContext.Request.QueryString.ToString(), - OnReactContextCreated = OnReactContextCreated - }); - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Layouts/BlogPageLayout.cs b/ReactWithDotNet.WebSite/Layouts/BlogPageLayout.cs deleted file mode 100644 index 3199307e..00000000 --- a/ReactWithDotNet.WebSite/Layouts/BlogPageLayout.cs +++ /dev/null @@ -1,38 +0,0 @@ -using ReactWithDotNet.WebSite.HeaderComponents; - -namespace ReactWithDotNet.WebSite; - -sealed class PageLayout : PureComponent -{ - protected override Element render() - { - return new FlexColumn(SizeFull) - { - new MainPageHeader(), - - new div(FlexGrow(1)) - { - children - }, - - new MainPageFooter() - }; - } -} - -sealed class BlogPageLayout : PureComponent -{ - protected override Element render() - { - return new PageLayout - { - new main(PaddingY(48), Background("#f9f9fa"), DisplayFlexRow, JustifyContentCenter) - { - new FlexColumn(MaxWidth(820), SizeFull, PaddingX(24)) - { - children - } - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Layouts/CommonPageLayout.cs b/ReactWithDotNet.WebSite/Layouts/CommonPageLayout.cs deleted file mode 100644 index 905b9596..00000000 --- a/ReactWithDotNet.WebSite/Layouts/CommonPageLayout.cs +++ /dev/null @@ -1,21 +0,0 @@ -namespace ReactWithDotNet.WebSite; - -sealed class CommonPageLayout : Component -{ - protected override Element render() - { - return new PageLayout - { - new main(PaddingY(48)) - { - new FlexRowCentered(WidthFull) - { - new FlexColumn(ContainerStyle) - { - children - } - } - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Layouts/MainLayout.cs b/ReactWithDotNet.WebSite/Layouts/MainLayout.cs deleted file mode 100644 index 064dcec9..00000000 --- a/ReactWithDotNet.WebSite/Layouts/MainLayout.cs +++ /dev/null @@ -1,119 +0,0 @@ -namespace ReactWithDotNet.WebSite; - -sealed class MainLayout : PureComponent, IPageLayout -{ - public string ContainerDomElementId => "app"; - - public ComponentRenderInfo RenderInfo { get; set; } - - protected override Element render() - { - return new html - { - Lang("tr"), - DirLtr, - - // Global Styles - Margin(0), - Color(Theme.text_primary), - FontFamily("'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'"), - WebkitFontSmoothingAntialiased, - MozOsxFontSmoothingGrayScale, - FontWeight400, - FontSize(1 * rem), - LineHeight(1.5 * CssUnit.em), - - new head - { - new meta { charset = "utf-8" }, - new meta { name = "viewport", content = "width=device-width, initial-scale=1" }, - new title { "React with DotNet" }, - - new link - { - rel = "stylesheet", - type = "text/css", - href = IndexCssFilePath - }, - - new style - { - """ - - * { - margin: 0; - padding: 0; - box-sizing: border-box; - } - - """ - }, - - arrangeFonts(), - - new link { href = "https://fonts.googleapis.com/icon?family=Material+Icons", rel = "stylesheet" } - }, - new body(Margin(0), Height100vh) - { - new div(Id(ContainerDomElementId), SizeFull), - - // After page first rendered in client then connect with react system in background. - // So user first iteraction time will be minimize. - - new script - { - type = "module", - - text = - $$""" - import {ReactWithDotNet} from '{{IndexJsFilePath}}'; - - ReactWithDotNet.StrictMode = false; - - ReactWithDotNet.RequestHandlerPath = '{{RequestHandlerPath}}'; - ReactWithDotNet.MetadataRequestHandlerPath = '{{MetadataRequestHandlerPath}}'; - - ReactWithDotNet.RenderComponentIn({ - idOfContainerHtmlElement: '{{ContainerDomElementId}}', - renderInfo: {{RenderInfo.ToJsonString()}} - }); - """ - } - }, - - new script - { - type = "text/javascript", - src = "long.js" - }, - new script - { - type = "text/javascript", - src = "clr.js" - } - }; - - IEnumerable arrangeFonts() - { - return - [ - new link { href = "https://fonts.gstatic.com", rel = "preconnect" }, - - new link { href = "https://fonts.googleapis.com", rel = "preconnect" }, - - new link { href = "https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;1,400&display=swap", rel = "stylesheet" }, - - new link { href = "https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Wix+Madefor+Text:ital,wght@0,400..800;1,400..800&display=swap", rel = "stylesheet" }, - - new link { href = "https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Wix+Madefor+Text:ital,wght@0,400..800;1,400..800&display=swap", rel = "stylesheet" } - - ]; - } - } -} - -partial class Extensions -{ - public static StyleModifier FontFamily_IBM_Plex_Sans => FontFamily("'IBM Plex Sans'"); - public static StyleModifier FontFamily_PlusJakartaSans_ExtraBold => FontFamily("'Plus Jakarta Sans'"); -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/DemoPreview.cs b/ReactWithDotNet.WebSite/Pages/DemoPreview.cs deleted file mode 100644 index 88e69dee..00000000 --- a/ReactWithDotNet.WebSite/Pages/DemoPreview.cs +++ /dev/null @@ -1,52 +0,0 @@ -using System.Web; -using Microsoft.Net.Http.Headers; - -namespace ReactWithDotNet.WebSite.Pages; - -sealed class DemoPreview : Component -{ - public const string QueryParameterNameOfFullTypeName = "fullTypeName"; - - protected override Element render() - { - var fullTypeName = GetQuery(QueryParameterNameOfFullTypeName); - if (fullTypeName is null) - { - return "Element is empty"; - } - - var elementType = Type.GetType(fullTypeName); - if (elementType is null) - { - return $"Element not found @fullTypeName: {fullTypeName}"; - } - - try - { - return (Element)Activator.CreateInstance(elementType); - } - catch (Exception exception) - { - return new pre(Color(Red)) { exception.ToString() }; - } - } - - string GetQuery(string name) - { - var value = Context.HttpContext.Request.Query[name].FirstOrDefault(); - if (value != null) - { - return value; - } - - var referer = Context.HttpContext.Request.Headers[HeaderNames.Referer]; - if (string.IsNullOrWhiteSpace(referer)) - { - return null; - } - - var nameValueCollection = HttpUtility.ParseQueryString(new Uri(referer).Query); - - return nameValueCollection[name]; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/PageAboutUs.cs b/ReactWithDotNet.WebSite/Pages/PageAboutUs.cs deleted file mode 100644 index 8566b30a..00000000 --- a/ReactWithDotNet.WebSite/Pages/PageAboutUs.cs +++ /dev/null @@ -1,36 +0,0 @@ - -namespace ReactWithDotNet.WebSite.Pages; - -class PageAboutUs : PureComponent -{ - protected override Element render() - { - - return new BlogPageLayout{new FlexColumn(AlignItemsCenter) - { - SpaceY(70), - new MainContentContainer(JustifyContentCenter, WidthFull, FlexDirectionColumn) - { - new h2(new Style { boxSizing = "border-box", color = "rgb(0, 127, 255)", fontFamily = "'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", fontSize = "14px", fontWeight = "700", letterSpacing = "normal", lineHeight = "21px", margin = "0px 0px 8px", scrollMarginTop = "92px", textAlign = "center" }) - { - "About us" - }, - - SpaceY(30), - - new FlexRowCentered(FontSize30, FontWeight600,Color(rgb(31, 38, 46))) - { - "Build better UI by ",new GradientText{"c#"}," and ",new GradientText{"react"} - }, - - SpaceY(30), - new FlexRowCentered - { - "Contact with us for special web apps" - } - - - } - }}; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/PageDesigner.cs b/ReactWithDotNet.WebSite/Pages/PageDesigner.cs deleted file mode 100644 index b2ef284e..00000000 --- a/ReactWithDotNet.WebSite/Pages/PageDesigner.cs +++ /dev/null @@ -1,51 +0,0 @@ -namespace ReactWithDotNet.WebSite.Pages; - -using h1 = BlogH1; -using p = BlogP; - -sealed class PageDesigner : PureComponent -{ - protected override Element render() - { - return new BlogPageLayout - { - new h1 { "How to preview component and edit hotreload mode?" }, - SpaceY(8), - new p - { - "Preview and design is very important in component driven development style. There are many tools for designing like no code low code.", - br, - "What is the main problem with this tools? How to deal with?", - br, - "Problem is connect data with this tools. Data can be any format.", - br, - "Second problem is this tools have borders. You cannot apply your custom code styles." - }, - - SpaceY(16), - - new p { "What is the solution?" }, - - SpaceY(30), - new h1 { "What is ReactWithDotNet Designer" }, - SpaceY(8), - new p - { - "In Debug mode, goto url '/$'", - br, - "Yo wil see this form", - new img { Src(Asset("design.png")), WidthFull, Padding(16) }, - "When you edit code in hotreload mode then designer updates component preview." - }, - - SpaceY(24), - new PlayButton - { - Label = "Play tutorial (1 min)", - VideoUrl = Asset("Designer.mp4") - }, - - SpaceY(80) - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/PageFrequendlyAskedQuestions.cs b/ReactWithDotNet.WebSite/Pages/PageFrequendlyAskedQuestions.cs deleted file mode 100644 index 97fd3618..00000000 --- a/ReactWithDotNet.WebSite/Pages/PageFrequendlyAskedQuestions.cs +++ /dev/null @@ -1,188 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.FramerMotion; - -namespace ReactWithDotNet.WebSite.Pages; - -using h1 = BlogH1; -using p = BlogP; - -sealed class PageFrequendlyAskedQuestions : PureComponent -{ - protected override Element render() - { - return new BlogPageLayout - { - new section(DisplayFlexRowCentered) - { - new InlineFlexColumn(AlignItemsFlexStart, Flex(1, 1, 0), Gap(12), JustifyContentFlexStart) - { - new h1 - { - "Frequendly Asked Questions" - }, - new FlexColumn(AlignItemsFlexStart, AlignSelfStretch, Gap(16), JustifyContentFlexStart) - { - new Accordion - { - new p - { - "What is ReactWithDotNet? What is the target? What problems does it solve?" - }, - new p - { - "It is a project that is partly on the server and partly on the browser.", - "It is not only js or c# library." - } - }, - new Accordion - { - new p - { - "Can you explain ReactWithDotNet working mechanism in simple way?" - }, - new p - { - "Imagine you are building react UI nodes in c# server then ReactWithDotNet serialize this nodes to browser.", - "After this nodes come to browser then ReactWithDotNet integrates this incoming nodes to React.js system.", - "When any action occurs then this engine transfer only required states to server then recalculates UI nodes." - } - }, - new Accordion - { - new p - { - "What is modifiers?" - }, - new p - { - "Modifiers are small functions that modify html node or css properties." - } - }, - new Accordion - { - new p - { - "What is the differences between Blazor?" - }, - new p - { - "Blazor and ReactWithDowNet are different mechanism." - } - }, - new Accordion - { - new p - { - "How is bindings working?" - }, - new p - { - "İf you are on the server you should binding system." - } - } - } - } - } - }; - } - - sealed class Accordion : Component - { - public bool IsExpanded { get; init; } - - protected override Task constructor() - { - state = new() - { - IsExpanded = IsExpanded - }; - - return Task.CompletedTask; - } - - protected override Element render() - { - return new FlexColumn(AlignItemsFlexStart, AlignSelfStretch, Background(White), Border(1, solid, Gray200), BorderRadius(8), Gap(16), JustifyContentFlexStart, Padding(20)) - { - state.IsExpanded ? null : OnClick(ToggleCollapse), - - new FlexRow(AlignItemsFlexStart, AlignSelfStretch, JustifyContentSpaceBetween, Gap(8), CursorDefault) - { - FontWeight500, - state.IsExpanded ? OnClick(ToggleCollapse) : null, - - children[0], - - new ArrowUpDownIcon { IsDirectionUp = !state.IsExpanded, Size = 18 } - }, - new div(SizeFull, state.IsExpanded ? null : DisplayNone) - { - children[1] - } - }; - } - - Task ToggleCollapse(MouseEvent _) - { - state = state with { IsExpanded = !state.IsExpanded }; - - return Task.CompletedTask; - } - - sealed class ArrowUpDownIcon : PureComponent - { - public required bool IsDirectionUp { get; init; } - - public int? Size { get; init; } - - protected override Element render() - { - var element = new IconArrowUp - { - Size = Size - }; - - element.style.Add(style); - - if (IsDirectionUp is false) - { - return new motion.div - { - initial = - { - rotate = -180 - }, - animate = - { - rotate = 0 - }, - children = - { - element - } - }; - } - - return new motion.div - { - initial = - { - rotate = 0 - }, - animate = - { - rotate = -180 - }, - children = - { - element - } - }; - } - } - - internal record State - { - public bool IsExpanded { get; init; } - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/PageMain.cs b/ReactWithDotNet.WebSite/Pages/PageMain.cs deleted file mode 100644 index dc1c7c37..00000000 --- a/ReactWithDotNet.WebSite/Pages/PageMain.cs +++ /dev/null @@ -1,105 +0,0 @@ -using System.IO; - -namespace ReactWithDotNet.WebSite.Pages; - -class PageMain : PureComponent -{ - protected override Element render() - { - return new CommonPageLayout - { - new FlexColumn(Gap(20)) - { - new MainPageContentDescription(), - - SpaceY(15), - - new MainPageContentSample() - } - }; - } - - class MainPageContentDescription : PureComponent - { - protected override Element render() - { - return new FlexColumn(AlignItemsCenter) - { - new div(FontFamily_PlusJakartaSans_ExtraBold, FontSize40, LG(FontSize50), FontWeight800, WhenMediaMaxWidth(MD, TextAlignCenter)) - { - LineHeight(50), LG(LineHeight(60)), - - "Write ", new GradientText { "react.js" }, " application in ", new GradientText { "c#" }, " language" - }, - - SpaceY(20), - new div - { - LineHeight30, - Color(Gray700), - FontWeight400, - """ - ReactWithDotNet is a new way to build web applications. - Build component tree in server side on .Net Core (c#) then sends component tree to react client side. - When any component has any action then React client communicates serverside only required parts of application. - Does not hold any state at .Net Core server side. - Thousend of users can be handle at same time. - In summary, combines power of c#, .net and react.js - """ - }, - SpaceY(40), - - new FlexRow(JustifyContentFlexStart, WidthFull, FlexWrap, Gap(32)) - { - new PrimaryLinkButton { Text = "Documentation", Href = Page.DocStart.Url } + WidthFull + SM(Width(auto)), - new PrimaryLinkButton { Text = "Showcase", Href = Page.Showcase.Url } + WidthFull + SM(Width(auto)), - new PrimaryLinkButton { Text = "Project Milestones", Href = Page.Milestones.Url } + WidthFull + SM(Width(auto)) - } - }; - } - - sealed class PrimaryLinkButton : PureComponent - { - public string Href { get; init; } - public string Text { get; init; } - - protected override Element render() - { - return new a(Href(Href), DisplayFlexRowCentered, SizeFitContent) - { - Text ?? "Button", - - new Style - { - Padding(15,45), - BackgroundImage("linear-gradient(to right, #DA22FF 0%, #9733EE 51%, #DA22FF 100%)"), - BoxShadow(0,0,20,"#eee"), - BorderRadius(10), - Color(White), - TextDecorationNone, - Transition("all 0.5s"), - BackgroundSize("200% auto"), - Hover([ - BackgroundPosition("right center") - ]) - } - }; - } - } - } - - class MainPageContentSample : PureComponent - { - protected override Element render() - { - string[] files = [Path.Combine(nameof(Components), nameof(HomePageDemoComponent) + ".cs")]; - - return new Playground - { - TypeOfTargetComponent = typeof(HomePageDemoComponent), - - Files = files.Select(fi => (Path.GetFileName(fi), File.ReadAllText(fi))).ToList() - }; - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/PageMileStones.cs b/ReactWithDotNet.WebSite/Pages/PageMileStones.cs deleted file mode 100644 index f434b851..00000000 --- a/ReactWithDotNet.WebSite/Pages/PageMileStones.cs +++ /dev/null @@ -1,93 +0,0 @@ -namespace ReactWithDotNet.WebSite.Pages; - -using h1 = BlogH1; -using p = BlogP; - -sealed class PageMilestones : PureComponent -{ - protected override Element render() - { - return new BlogPageLayout - { - new h1 - { - "Project Milestones" - }, - SpaceY(16), - new p - { - "The main milestones of this project are listed below." - }, - SpaceY(16), - new MilestoneContainer - { - new h5 { "Milestone 1: Core Concept" }, - new Progressbar { Value = 95 }, - new p - { - "Core react conceps like Functional components, Class components, PureComponents and communication react js client and .net core server." - } - }, - SpaceY(32), - new MilestoneContainer - { - new h5 { "Milestone 2: Creating wrapper classes of popular react libraries like MUI, AntDesign." }, - new Progressbar { Value = 5 }, - new p - { - "When this milestone completed, you can use MUI, or other famous components in your project. This insfrastructure is ready to use. We are plan to generate wrapper classes automatically." - } - }, - SpaceY(32), - new MilestoneContainer - { - new h5 { "Milestone 3: Use Client option" }, - new Progressbar { Value = 10 }, - new p - { - "After this part finished, you can write js code in c# language. I'm planning mini .net runtime in js language. My plan is not to build a new c# to js compiler. My plan is creating a new MSIL code interpreter in js language. Not getting all .net core assemblies. Only required part of MSIL codes will be downloaded into client side." - } - }, - SpaceY(32), - new MilestoneContainer - { - new h5 { "Milestone 4: React Native Integration" }, - new Progressbar { Value = 0 }, - new p - { - "React native user interfaces will be build by server driven ui." - } - } - }; - } - - class MilestoneContainer : PureComponent - { - protected override Element render() - { - return new FlexColumn(Gap(4), Padding(32), Background(White), BorderRadius(8), Border(1, solid, Gray200), Hover(BorderColor(Gray300))) - { - children - }; - } - } - - class Progressbar : PureComponent - { - public int Value { get; init; } = 10; - - protected override Element render() - { - return new div(SizeFull, BorderRadius(4), Border(1, solid, Blue300), Size(200, 25), WhenMediaMinWidth(450, Width(300))) - { - new FlexRowCentered(Width(Value, 100), Background(linear_gradient(90, Blue100, Blue300)), HeightFull, FontSize11, BorderRadius(4)), - - PositionRelative, - new FlexRowCentered(PositionAbsolute, Inset0, FontWeight500, FontSize12) - { - "%" + Value - } - }; - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/PageModifiers.cs b/ReactWithDotNet.WebSite/Pages/PageModifiers.cs deleted file mode 100644 index 0b51086f..00000000 --- a/ReactWithDotNet.WebSite/Pages/PageModifiers.cs +++ /dev/null @@ -1,189 +0,0 @@ -namespace ReactWithDotNet.WebSite.Pages; - -using h1 = BlogH1; -using p = BlogP; - -sealed class PageModifiers : PureComponent -{ - protected override Element render() - { - return new BlogPageLayout - { - new h1 { "Modifiers" }, - SpaceY(8), - new FlexColumn - { - new p - { - "Clasical way to create element" - }, - - SpaceY(8), - - new div(Height(360)) - { - new RenderPreview - { - RenderPartOfCSharpCode = - """ - - new button - { - text = "button", - style = - { - display = "flex", - justifyContent = "center", - alignItems = "center", - paddingLeft = "12px", - paddingRight = "12px", - paddingTop = "8px", - paddingBottom = "8px", - border = "1px solid blue", - fontSize = "15px", - borderRadius = "3px", - background = "White", - hover = - { - background = "WhiteSmoke", - borderColor = "Red" - } - } - } - - """ - } - } - }, - - SpaceY(50), - - new FlexColumn - { - new p - { - "We suggest better alternatives" - }, - SpaceY(8), - new div(Height(200)) - { - new RenderPreview - { - RenderPartOfCSharpCode = - """ - - new button - { - "button", - DisplayFlexRowCentered, - Padding(8, 12), - Border(1, solid, Blue), - BorderRadius(3), - FontSize15, - Background(White), - Hover(Background(WhiteSmoke), BorderColor(Red)) - } - - """ - } - }, - SpaceY(50), - new p - { - "Also you can move any modifiers to constructor" - }, - SpaceY(8), - new div(Height(170)) - { - new RenderPreview - { - RenderPartOfCSharpCode = - """ - - new button(DisplayFlexRowCentered, Padding(8, 12)) - { - "button", - Border(1, solid, Blue), - BorderRadius(3), - FontSize15, - Background(White), - Hover(Background(WhiteSmoke), BorderColor(Red)) - } - - """ - } - } - - }, - SpaceY(80), - new p - { - "Custom modifier can be declared as below and can be use anywhere.", - }, - SpaceY(8), - new div(Height(300)) - { - new CSharpCodePanel - { - Code = """ - - static class SharedStyles - { - public static Style SectionStyle => - [ - Background(White), - BorderRadius(8), - Padding(6) - ]; - } - - static Element CreateUserSection(string userName) - { - return new div(SharedStyles.SectionStyle) - { - userName - }; - } - - """ - } - }, - - SpaceY(80), - new p - { - "Tailwind like library class names be can use like ", - }, - SpaceY(8), - new div(Height(100)) - { - new CSharpCodePanel - { - Code = """ - - new div("w-full text-gray-600", FontSize15) - { - "Any text" - } - - """ - } - }, - - SpaceY(50) - }; - } -} - -class PageDocuments : PureComponent -{ - - - protected override Element render() - { - return new FlexRow(Gap(150), WidthFull, JustifyContentSpaceAround) - { - "PageDocuments" - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/PageReactContexts.cs b/ReactWithDotNet.WebSite/Pages/PageReactContexts.cs deleted file mode 100644 index 8ec45956..00000000 --- a/ReactWithDotNet.WebSite/Pages/PageReactContexts.cs +++ /dev/null @@ -1,145 +0,0 @@ -namespace ReactWithDotNet.WebSite.Pages; - -using h1 = BlogH1; -using p = BlogP; - -sealed class PageReactContexts : PureComponent -{ - protected override Element render() - { - return new BlogPageLayout - { - new h1 { "React context" }, - SpaceY(8), - new FlexColumn - { - new p - { - "React Context is a powerful feature that allows you to manage and share state or data across a component tree without having to pass props down manually at every level.", - br, - br, - "ReactWithDotNet has only one context. Every component can access this context", - br, - "Let's show you on an example how to manage db connection." - }, - - SpaceY(16), - - new CodeViewer(CodeViewer.LangCSharp, Height(70), MD(Width(550))) - { - """ - /// - /// Defines a key for access db connection instance - /// - static ReactContextKey DbConnection = new(nameof(DbConnection)); - """ - }, - SpaceY(16), - new p - { - "When request started" - }, - - new CodeViewer(CodeViewer.LangCSharp, Height(240), MD(Width(550))) - { - """ - /// - /// Every component request enter this method. - /// - static Task HandleReactWithDotNetRequest(HttpContext httpContext) - { - httpContext.Response.ContentType = "application/json; charset=utf-8"; - - return ProcessReactWithDotNetComponentRequest(new() - { - HttpContext = httpContext, - OnReactContextCreated = OnReactContextCreated, - OnReactContextDisposed = OnReactContextDisposed - }); - } - """ - }, - - SpaceY(16), - - new p - { - "initialize db connection" - }, - - new CodeViewer(CodeViewer.LangCSharp, Height(140), MD(Width(550))) - { - """ - static Task OnReactContextCreated(ReactContext context) - { - var httpContext = context.HttpContext; - - context.Set(DbConnection, CreateDbConnection(httpContext)); - - return Task.CompletedTask; - } - """ - }, - - SpaceY(16), - new p - { - "Before send response to client" - }, - - new CodeViewer(CodeViewer.LangCSharp, Height(290), MD(Width(550))) - { - """ - static Task OnReactContextDisposed(ReactContext context, Exception exception) - { - var dbConnection = DbConnection[context]; - - if (exception == null) - { - // commit - } - else - { - // rollback - } - - dbConnection?.Dispose(); - - return Task.CompletedTask; - } - """ - }, - - - SpaceY(32), - new p - { - "You can use this connection object in component" - }, - - new CodeViewer(CodeViewer.LangCSharp, Height(150), MD(Width(550))) - { - """ - protected override Task componentDidMount() - { - var dbConnection = DbConnection[Context]; - - dbConnection..... - - return Task.CompletedTask; - } - """ - } - - }, - SpaceY(32), - new p - { - "You can manage session, theme or other futures that you want as just like in this sample" - }, - - SpaceY(50) - }; - } -} - diff --git a/ReactWithDotNet.WebSite/Pages/PageShowcase.cs b/ReactWithDotNet.WebSite/Pages/PageShowcase.cs deleted file mode 100644 index d745d693..00000000 --- a/ReactWithDotNet.WebSite/Pages/PageShowcase.cs +++ /dev/null @@ -1,266 +0,0 @@ -using System.IO; -using ReactWithDotNet.ThirdPartyLibraries.MUI.Material; -using ReactWithDotNet.WebSite.Showcases; - -namespace ReactWithDotNet.WebSite.Pages; - -sealed class PageShowcase : Component -{ - static IReadOnlyList DemoList => - [ - new() - { - TargetType = typeof(MuiCardDemo), - Height = 400, - Label = "Mui Card" - }, - new() - { - TargetType = typeof(MuiTextFieldDemo), - Height = 150, - Label = "Mui Text Field" - }, - new() - { - TargetType = typeof(PrimeReactTabViewDemo), - Height = 300, - Label = "PrimeReact Tab" - }, - new() - { - TargetType = typeof(RSuiteAutoCompleteDemo), - Height = 200, - Label = "RSuite AutoComplete" - }, - new() - { - TargetType = typeof(SwiperGalleryDemo), - Height = 500, - Label = "Swiper Galery" - }, - new() - { - TargetType = typeof(ReactPlayerDemo), - Height = 500, - Label = "React Player" - }, - new() - { - TargetType = typeof(MonacoEditorDemo), - Height = 500, - Label = "Monaco Editor" - } - ]; - - protected override Task constructor() - { - state = new() - { - SelectedTypeFullName = DemoList[0].TargetType.FullName - }; - - return Task.CompletedTask; - } - - protected override Element render() - { - var boxShadowOfWindow = BoxShadow(0, 2, 10, 2, rgba(0, 0, 0, 0.1)); - - return new CommonPageLayout - { - new FlexColumn(WidthFull, MinHeight(500), boxShadowOfWindow, BorderRadius(4)) - { - new FlexRow(PaddingLeft(16), PaddingTopBottom(8)) - { - (h4)"Showcases", - - FontWeight400, - FontSize15, - BorderBottom(1, solid, rgba(5, 5, 5, 0.1)) - }, - new FlexRow(WidthFull, Padding(10)) - { - LeftMenu, - - new div(Padding(10), WidthFull, OverflowAuto) - { - new DemoPanel - { - DemoInfo = DemoList.First(x => x.TargetType.FullName == state.SelectedTypeFullName) - } - } - } - } - }; - } - - Element LeftMenu() - { - var menuItems = DemoList; - - if (string.IsNullOrWhiteSpace(state.SearchValue) is false) - { - menuItems = menuItems.Where(t => t.Label.Contains(state.SearchValue, StringComparison.OrdinalIgnoreCase)).ToList(); - } - - return new FlexColumn(Padding(8)) - { - new FlexRow - { - new IconFilter { Size = 24 }, - SpaceX(8), - new TextField - { - size = "small", - valueBind = () => state.SearchValue, - valueBindDebounceTimeout = 700, - valueBindDebounceHandler = OnSearchFinished, - style = { WidthFull } - } - }, - SpaceY(8), - new FlexColumn(Gap(8)) - { - menuItems.Select(asMenuItem) - } - }; - - Element asMenuItem(DemoInfo demoInfo, int index) - { - var isSelected = state.SelectedTypeFullName == demoInfo.TargetType.FullName; - - return new FlexRowCentered - { - Id(demoInfo.TargetType.FullName), - Text(demoInfo.Label), - BorderRadius(6), - PaddingTopBottom(5), - PaddingLeftRight(15), - Border(1, solid, Gray200), - CursorDefault, - When(isSelected, Background(Gray100)), - When(!isSelected, Hover(Background(Gray50))), - OnClick(e => - { - state = state with { SelectedTypeFullName = e.target.id }; - - return Task.CompletedTask; - }) - }; - } - } - - Task OnSearchFinished() - { - return Task.CompletedTask; - } - - class DemoPanel : Component - { - public required DemoInfo DemoInfo { get; init; } - - protected override Task OverrideStateFromPropsBeforeRender() - { - if (DemoInfo.TargetType != state.DemoInfo?.TargetType) - { - state = new() - { - DemoInfo = DemoInfo - }; - } - - return Task.CompletedTask; - } - - protected override Element render() - { - return new FlexColumn(WidthFull, Padding(8), Gap(8), BorderRadius(4), BoxShadow(0, 2, 5, 0, rgba(0, 0, 0, 0.34))) - { - new FlexRowCentered(Height(DemoInfo.Height), BackgroundColor(Gray200), Padding(40), WidthFull, BorderRadius(8), PositionRelative, MinWidth(250)) - { - creatElement, - - new FlexRow(PositionAbsolute, RightBottom(1)) - { - ShowHideButton - } - }, - state.IsSourceCodeVisible is false ? null : new FlexRow(WidthFull, OverflowAuto, Height(300), MarginTop(-8)) - { - new SourceCodeView { CSharpCode = File.ReadAllText("Showcases\\" + DemoInfo.TargetType.FullName?.Split('.').Last() + ".cs") } - } - }; - - Element creatElement() - { - return new iframe - { - src = Page.DemoPreviewUrl(DemoInfo.TargetType.FullName), - style = { BorderNone, SizeFull, DisplayFlexRowCentered } - }; - } - - Element ShowHideButton() - { - return new FormControlLabel - { - label = (span)(state.IsSourceCodeVisible ? "Hide Source Code" : "Show Source Code") + FontSize12, - control = new Switch - { - size = "small", - value = (!state.IsSourceCodeVisible).ToString(), - @checked = state.IsSourceCodeVisible, - onChange = _ => - { - state = state with { IsSourceCodeVisible = !state.IsSourceCodeVisible }; - - return Task.CompletedTask; - } - } - }; - } - } - - sealed class SourceCodeView : PureComponent - { - public string CSharpCode { get; init; } - - protected override Element render() - { - return new fieldset(Border(1, solid, Gray200), SizeFull, OverflowScroll) - { - new legend(DisplayFlexColumnCentered, MarginLeft(8), MarginBottom(-8)) - { - new img { Src(Asset("csharp.svg")), Size(20), PaddingX(4), Zindex2, Height(16) } - }, - - new FlexRowCentered(SizeFull, Padding(0, 4, 4, 4)) - { - new CSharpCodePanel { Code = CSharpCode } - } - }; - } - } - } - - internal record State - { - public string SelectedTypeFullName { get; init; } - - public string SearchValue { get; init; } - } - - record DemoPanelState - { - public bool IsSourceCodeVisible { get; init; } - - public DemoInfo DemoInfo { get; init; } - } - - record DemoInfo - { - public Type TargetType { get; init; } - public double Height { get; init; } - public string Label { get; init; } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/PageTechnicalDetail.cs b/ReactWithDotNet.WebSite/Pages/PageTechnicalDetail.cs deleted file mode 100644 index bd8c4583..00000000 --- a/ReactWithDotNet.WebSite/Pages/PageTechnicalDetail.cs +++ /dev/null @@ -1,72 +0,0 @@ -namespace ReactWithDotNet.WebSite.Pages; - -using h1 = BlogH1; -using p = BlogP; - -sealed class PageTechnicalDetail : PureComponent -{ - protected override Element render() - { - return new BlogPageLayout - { - new h1{"Technical Details"}, - SpaceY(16), - new p - { - "How does it work? How are React and C# languages connected?" - }, - - new p - { - "ReactWithDotNet is working on the .net core. Creates ReactNode hierarchy in c# language then serialize to client.", - br,br, - "ReactWithDotNet client engine recalculates React nodes from incoming c# generated nodes.", - br,br, - "If any react event occurs then serialize only sub react node informations to server." - }, - - SpaceY(50), - new img(WidthFull, ObjectFitContain) - { - Src(Asset("TechnicalDetail1.drawio.png")) - }, - - SpaceY(50), - new p - { - "Lets see what is incoming from server to client" - }, - - SpaceY(20), - new img(WidthFull, ObjectFitContain) - { - Src(Asset("TechnicalDetail.I.drawio.png")) - }, - - SpaceY(50), - new p - { - "Lets see what is outgoing from client to server" - }, - - SpaceY(20), - new img(WidthFull, ObjectFitContain) - { - Src(Asset("TechnicalDetail.O.drawio.png")) - }, - SpaceY(20), - new p - { - "As you can see at images, main idea is server driven UI, just like react server components.", - br,br, - "Main differences server is not nodejs, language is not typescript or js.", - br, - "Server is .NetCore server and language is c# language.", - br,br, - "As a result; power of two technology is combined. " + - "We have many benefits of c# language and serverside approach and react components flexibility." - }, - SpaceY(50) - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/doc/Documentation.cs b/ReactWithDotNet.WebSite/Pages/doc/Documentation.cs deleted file mode 100644 index 09af99dc..00000000 --- a/ReactWithDotNet.WebSite/Pages/doc/Documentation.cs +++ /dev/null @@ -1,146 +0,0 @@ -namespace ReactWithDotNet.WebSite.Pages; - -abstract class PageDocumentation : Component -{ - - protected static Element Space => SpaceY(8); - - protected override Task componentDidMount() - { - if (!Client.WidthHasMatch(MD)) - { - state = state with { LeftMenuIsCollapsed = true }; - } - - return Task.CompletedTask; - } - - protected abstract Element CreateContent(); - - protected override Element render() - { - return new PageLayout - { - new main(DisplayFlexRow, HeightFull) - { - new LeftMenuView - { - RequestPath = Context.Request.Path, - LeftMenuIsCollapsed = state.LeftMenuIsCollapsed, - ToggleCollapse = ToggleCollapse - }, - - new FlexRow(PaddingX(5 * percent), Background(White), Flex(1.5)) - { - CreateContent() - } + When(state.LeftMenuIsCollapsed is false, Height100vh, OverflowHidden) - } - }; - } - - Task ToggleCollapse(MouseEvent e) - { - if (state.LeftMenuIsCollapsed is null) - { - state = state with { LeftMenuIsCollapsed = false }; - } - - state = state with { LeftMenuIsCollapsed = !state.LeftMenuIsCollapsed }; - - return Task.CompletedTask; - } - - sealed class IconLeft : PureComponent - { - // ReSharper disable once MemberCanBePrivate.Local - public string Color { get; } = "#c5d7e8"; - - protected override Element render() - { - return new svg(ViewBox(0, 0, 50, 50), svg.Size(20)) - { - new path { fill = Color, d = "M25 1C11.767 1 1 11.767 1 25s10.767 24 24 24 24-10.767 24-24S38.233 1 25 1zm0 46C12.869 47 3 37.131 3 25S12.869 3 25 3s22 9.869 22 22-9.869 22-22 22z" }, - new path { fill = Color, d = "M29.293 10.293 14.586 25l14.707 14.707 1.414-1.414L17.414 25l13.293-13.293z" } - }; - } - } - - class LeftMenuView : PureComponent - { - public bool? LeftMenuIsCollapsed { get; init; } - - public string RequestPath { get; init; } - - public MouseEventHandler ToggleCollapse { get; init; } - - protected override Element render() - { - return new FlexRow(JustifyContentCenter, AlignItemsFlexStart, Background("#f8fafc"), PositionRelative) - { - Transition(Width, 300, "ease-in"), - - LeftMenuIsCollapsed is true ? Width(16) : Width(286), - - new IconLeft - { - style = { PositionAbsolute, Right(-10), Top(25), When(LeftMenuIsCollapsed is true, Rotate("180deg")) } - } + OnClick(ToggleCollapse) + MD(DisplayNone), - - LeftMenuIsCollapsed is true ? null : - LeftMenuContent(RequestPath) - }; - } - - static Element LeftMenuContent(string url) - { - var data = new[] - { - new - { - Title = "Introduction", - Links = new[] - { - new { Label = "Getting started", Url = Page.DocStart.Url }, - new { Label = "Setup", Url = Page.DocSetup.Url } - } - } - }; - - return new nav(FontSize14, LineHeight24, PositionSticky, Top(100), PaddingBottom(32)) - { - new ul(DisplayFlexColumn, Gap(2 * rem), Role("list")) - { - data.Select(item => new li(ListStyleNone) - { - new h2(FontWeight500, FontSize14, Color(rgb(15, 23, 42))) - { - item.Title - }, - new ul(Role("list"), BorderLeft(2 * px, solid, rgb(226, 232, 240))) - { - item.Links.Select(link => new li(MarginTop(16), DisplayFlexRow, AlignItemsCenter) - { - isSelected(link.Url) ? BorderLeft(2 * px, solid, rgb(30, 167, 253)) + MarginLeft(-2) : null, - - new a(PaddingLeft(14), TextDecorationNone, Color(rgb(71, 85, 105))) - { - link.Label, Href(link.Url) - } - }) - } - }) - } - }; - - bool isSelected(string uuu) - { - return url?.EndsWith(uuu) == true; - } - } - } - - internal record State - { - public bool? LeftMenuIsCollapsed { get; init; } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/doc/PageDocumentation_Setup.cs b/ReactWithDotNet.WebSite/Pages/doc/PageDocumentation_Setup.cs deleted file mode 100644 index 640468f9..00000000 --- a/ReactWithDotNet.WebSite/Pages/doc/PageDocumentation_Setup.cs +++ /dev/null @@ -1,40 +0,0 @@ -namespace ReactWithDotNet.WebSite.Pages; - -using h1 = BlogH1; -using p = BlogP; - -sealed class PageDocumentation_Setup : PageDocumentation -{ - protected override Element CreateContent() - { - return new article(PaddingTopBottom(4 * rem)) - { - new h1 - { - "Setup" - }, - Space, - new p - { - "Skip long and boring documentations!", - br, - "Stop thinking about js bundle size problems, npm and library dependencies.", - - br, br, - "As always we said that, if you are familiar to c# and react library, you are already know ReactWithDotNet library.", - br, br, - "Best way to learn ReactWithDotNet library is see our 'Counter' sample project", - br, - br, - new a - { - "Counter Sample", - Href("https://github.com/beyaz/ReactWithDotNet.Samples") - } - }, - SpaceY(200) - - - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Pages/doc/PageDocumentation_Start.cs b/ReactWithDotNet.WebSite/Pages/doc/PageDocumentation_Start.cs deleted file mode 100644 index d5157f31..00000000 --- a/ReactWithDotNet.WebSite/Pages/doc/PageDocumentation_Start.cs +++ /dev/null @@ -1,179 +0,0 @@ -namespace ReactWithDotNet.WebSite.Pages; - -using h1 = BlogH1; -using p = BlogP; - -sealed class PageDocumentation_Start : PageDocumentation -{ - protected override Element CreateContent() - { - return new article(PaddingTopBottom(4 * rem)) - { - new h1 - { - "Quick Start" - }, - Space, - new p - { - "c# & react" - }, - Space, - Space, - new p - { - "If you know reactjs and c# language, you already familier to ReactWithDotNet ecosystem.", - br, - "Build react component tree and event handlers in c# language at .net core server afterthat component tree will render in browser." - }, - Space, - Space, - new p - { - "Lets look at component decleration in react" - }, - new CodeViewer(CodeViewer.LangTypeScript, Height(300), MD(Width(400))) - { - """ - class PrintHello extends React.Component - { - constructor(props) - { - super(props); - this.state = { message: 'loading...' }; - } - - componentDidMount() - { - this.setState({ message: "hello world" }); - } - - render () - { - return
{this.state.message}
- } - } - """ - }, - Space, Space, Space, Space, - new p - { - "In ReactWithDotNet system, the c# version of this component is" - }, - new CodeViewer(CodeViewer.LangCSharp, Height(400), MD(Width(400))) - { - """ - record PrintHelloState - { - public string Message { get; init; } - } - class PrintHello : Component - { - protected override Task constructor() - { - state = new (){ Message = "loading..." }; - - return Task.CompletedTask; - } - - protected override Task componentDidMount() - { - state = state with { Message = "hello world" }; - - return Task.CompletedTask; - } - - protected override Element render() - { - return new div { this.state.message }; - } - } - """ - }, - Space, Space, Space, Space, - new p - { - "Let's create simple functional component" - }, - new CodeViewer(CodeViewer.LangTypeScript, Height(200), MD(Width(400))) - { - """ - const HelloWorld = () => { - return ( -
-

Hello World!

-
- ); - }; - - // sample usage -
- -
- """ - }, - Space, Space, Space, Space, - new p - { - "Here is c# version" - }, - new CodeViewer(CodeViewer.LangTypeScript, Height(210), MD(Width(400))) - { - """ - Element HelloWorld() - { - return new div(FontSize14, Color("gray")) - { - new h1 { "Hello World!" } - }; - } - - // sample usage - new div(ClassName("App")) - { - HelloWorld - } - """ - }, - Space, Space, Space, Space, - new p - { - "Here is c# async version" - }, - new CodeViewer(CodeViewer.LangTypeScript, Height(330), MD(Width(400))) - { - """ - async Task GetMessageFromDb() - { - await Task.Delay(1); - - return "Hello World!"; - } - - async Task HelloWorld() - { - return new div(ClassName("App")) - { - new h1 { await GetMessageFromDb() } - }; - } - - // sample usage - new div(ClassName("App")) - { - HelloWorld - } - """ - }, - Space, Space, Space, Space, - new p - { - "As you can see, main idea is writing react components in c# language at serverside.", - br, - "Our aim is to combine the strengths of both platforms (C# and ReactJS) to provide an easier web development environment.", - br, - "You dont need to import or compile any js library. All you need to reference ReactWithDotNet.dll to your .net core webapi project." - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Properties/launchSettings.json b/ReactWithDotNet.WebSite/Properties/launchSettings.json deleted file mode 100644 index c9709fef..00000000 --- a/ReactWithDotNet.WebSite/Properties/launchSettings.json +++ /dev/null @@ -1,24 +0,0 @@ -{ - "$schema": "http://json.schemastore.org/launchsettings.json", - "iisSettings": { - "windowsAuthentication": false, - "anonymousAuthentication": true, - "iisExpress": { - "applicationUrl": "http://localhost:55026", - "sslPort": 44305 - } - }, - "profiles": { - "IIS Express": { - "commandName": "IISExpress", - "launchUrl": "index.html", - "environmentVariables": { - "ASPNETCORE_ENVIRONMENT": "Development" - }, - "dotnet": { - "commandName": "Project", - "hotReloadProfile": "aspnetcore" - } - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/QueryStringStore.cs b/ReactWithDotNet.WebSite/QueryStringStore.cs deleted file mode 100644 index abcef88a..00000000 --- a/ReactWithDotNet.WebSite/QueryStringStore.cs +++ /dev/null @@ -1,73 +0,0 @@ -global using static ReactWithDotNet.WebSite.QueryStringStore; -using System.Text.Json; -using System.Text.Json.Serialization; -using Microsoft.AspNetCore.Http.Extensions; - -namespace ReactWithDotNet.WebSite; - -static class QueryStringStore -{ - const string QueryName = "q"; - - public static string CalculateUrl(string path, T queryData) - { - if (queryData is null) - { - return path; - } - var queryBuilder = new QueryBuilder { { QueryName, Json.Serialize(queryData) } }; - - return path + queryBuilder.ToQueryString(); - } - - public static void Route(this IReactComponent component, TModel model) - { - var context = component.Context; - var client = component.Client; - - var queryCollection = context.Request.Query; - - var queryBuilder = new QueryBuilder(queryCollection.Where(x=>!QueryName.Equals(x.Key, StringComparison.OrdinalIgnoreCase))) - { - { QueryName, Json.Serialize(model) } - }; - - var queryString = queryBuilder.ToQueryString(); - - var requestPath = context.Request.Path; - - client.HistoryReplaceState(null, null, requestPath + queryString); - } - - public static TModel TryReadFromQueryString(ReactContext context) - { - var json = context.Request.Query[QueryName]; - - if (string.IsNullOrWhiteSpace(json)) - { - return default; - } - - return Json.Deserialize(json); - } - - static class Json - { - static readonly JsonSerializerOptions Options = new() - { - WriteIndented = false, - DefaultIgnoreCondition = JsonIgnoreCondition.WhenWritingNull, - IncludeFields = true, - }; - - public static T Deserialize(string json) - { - return JsonSerializer.Deserialize(json, Options); - } - - public static string Serialize(T value) - { - return JsonSerializer.Serialize(value, Options); - } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/ReactWithDotNet.WebSite.csproj b/ReactWithDotNet.WebSite/ReactWithDotNet.WebSite.csproj deleted file mode 100644 index fa73de39..00000000 --- a/ReactWithDotNet.WebSite/ReactWithDotNet.WebSite.csproj +++ /dev/null @@ -1,50 +0,0 @@ - - - - preview - net8.0 - CS8981 - - - - - - - - - - - - - - - - Always - - - Always - - - Always - - - Always - - - Always - - - Always - - - Always - - - Always - - - - - - - diff --git a/ReactWithDotNet.WebSite/ScriptManager.cs b/ReactWithDotNet.WebSite/ScriptManager.cs deleted file mode 100644 index f2ba6d66..00000000 --- a/ReactWithDotNet.WebSite/ScriptManager.cs +++ /dev/null @@ -1,83 +0,0 @@ -using System.Collections.Concurrent; -using System.Runtime.Loader; -using System.Threading; -using Microsoft.Extensions.Hosting; - -namespace ReactWithDotNet.WebSite; - -record ScriptItem -{ - public string RenderPartOfCSharpCode { get; init; } - public AssemblyLoadContext AssemblyLoadContext { get; init; } - public Type Type { get; init; } - public DateTime CreationTime { get; } = DateTime.Now; -} - -sealed class ScriptManager -{ - readonly ConcurrentDictionary Map = []; - - public static ScriptManager Instance { get; set; } = new(); - - public ScriptItem this[string key] - { - get => Map.GetValueOrDefault(key); - set => Update(key, value); - } - - // ReSharper disable once UnusedMember.Local - public void RemoveOlderItems(TimeSpan duration) - { - foreach (var key in Map.Keys) - { - tryRemove(key); - } - - return; - - bool shouldRemove(ScriptItem cacheItem) - { - return cacheItem.CreationTime - DateTime.Now > duration; - } - - void tryRemove(string key) - { - if (shouldRemove(Map[key])) - { - if (Map.TryRemove(key, out var cacheItem)) - { - cacheItem.AssemblyLoadContext?.Unload(); - } - } - } - } - - void Update(string key, ScriptItem newScriptItem) - { - if (Map.TryRemove(key, out var existingValue)) - { - existingValue.AssemblyLoadContext?.Unload(); - } - - if (newScriptItem is null) - { - return; - } - - Map.TryAdd(key, newScriptItem); - } -} - -class ScriptCleanerBackgroundService : BackgroundService -{ - protected override async Task ExecuteAsync(CancellationToken stoppingToken) - { - while (true) - { - await Task.Delay(10, stoppingToken); - - ScriptManager.Instance.RemoveOlderItems(TimeSpan.FromMinutes(10)); - } - // ReSharper disable once FunctionNeverReturns - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Showcases/MonacoEditorDemo.cs b/ReactWithDotNet.WebSite/Showcases/MonacoEditorDemo.cs deleted file mode 100644 index 28e1c477..00000000 --- a/ReactWithDotNet.WebSite/Showcases/MonacoEditorDemo.cs +++ /dev/null @@ -1,84 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.MonacoEditorReact; - -namespace ReactWithDotNet.WebSite.Showcases; - -sealed class MonacoEditorDemo : Component -{ - protected override Task constructor() - { - const string sampleJsonContent = - """ - { - "name": "xyz", - "year": 6, - "hasValue": false - } - """; - - state = new() - { - Content = sampleJsonContent - }; - - return Task.CompletedTask; - } - - protected override Element render() - { - return new FlexRowCentered - { - new FlexColumn(SizeFull, AlignItemsCenter) - { - new link { href = "https://fonts.cdnfonts.com/css/ibm-plex-mono-3", rel = "stylesheet" }, - new FlexRowCentered(Height(250), Width(70, 100)) - { - new Editor - { - width = "100%", - height = "100%", - defaultLanguage = "json", - - valueBind = () => state.Content, - valueBindDebounceTimeout = 500, - valueBindDebounceHandler = OnKeypressFinished, - - options = - { - renderLineHighlight = none, - fontFamily = "'IBM Plex Mono Medium', 'Courier New', monospace", - minimap = new - { - enabled = false - }, - unicodeHighlight = new - { - showExcludeOptions = false - } - } - } - }, - new FlexRow - { - (b)"Letter Count: ", state.LetterCount - } - } - }; - } - - Task OnKeypressFinished() - { - state = state with - { - LetterCount = state.Content.Length - }; - - return Task.CompletedTask; - } - - internal sealed record State - { - public string Content { get; init; } - - public int LetterCount { get; init; } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Showcases/MuiCardDemo.cs b/ReactWithDotNet.WebSite/Showcases/MuiCardDemo.cs deleted file mode 100644 index 0196835e..00000000 --- a/ReactWithDotNet.WebSite/Showcases/MuiCardDemo.cs +++ /dev/null @@ -1,49 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.MUI.Material; - -namespace ReactWithDotNet.WebSite.Showcases; - -class MuiCardDemo : PureComponent -{ - protected override Element render() - { - return new FlexRowCentered - { - new Card - { - sx = { maxWidth = 345 }, - children = - { - new CardMedia - { - sx = { height = 140 }, - image = "https://mui.com/static/images/cards/contemplative-reptile.jpg", - title = "green iguana" - }, - new CardContent - { - new Typography - { - variant = "h5", gutterBottom = true, component = "div", children = { "Lizard" } - }, - new Typography - { - variant = "body2", color = "text.secondary", children = - { - """ - Lizards are a widespread group of squamate reptiles, with over 6,000 species, - ranging across all continents except Antarctica - """ - } - } - }, - - new CardActions - { - new Button { size = "small", children = { "Share" } }, - new Button { size = "small", children = { "Learn More" } } - } - } - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Showcases/MuiTextFieldDemo.cs b/ReactWithDotNet.WebSite/Showcases/MuiTextFieldDemo.cs deleted file mode 100644 index 5689d3ab..00000000 --- a/ReactWithDotNet.WebSite/Showcases/MuiTextFieldDemo.cs +++ /dev/null @@ -1,31 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.MUI.Material; - -namespace ReactWithDotNet.WebSite.Showcases; - -class MuiTextFieldDemo : PureComponent -{ - protected override Element render() - { - return new FlexRowCentered - { - new Paper - { - component = "form", - sx = { p = "2px 4px", display = "flex", alignItems = "center", width = 400 }, - children = - { - new TextField { sx = { ml = 1, flex = 1 }, size = "small" }, - new IconButton - { - type = "button", - sx = { p = "10px" }, - children = - { - new span { className = "material-icons", text = "search" } - } - } - } - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Showcases/PrimeReactTabViewDemo.cs b/ReactWithDotNet.WebSite/Showcases/PrimeReactTabViewDemo.cs deleted file mode 100644 index 9a6a75fe..00000000 --- a/ReactWithDotNet.WebSite/Showcases/PrimeReactTabViewDemo.cs +++ /dev/null @@ -1,86 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.PrimeReact; - -namespace ReactWithDotNet.WebSite.Showcases; - -class PrimeReactTabViewDemo : PureComponent -{ - protected override Element render() - { - return new div(SizeFull) - { - new TabView - { - new TabPanel - { - header = "Header I", - leftIcon = "pi pi-calendar mr-2", - children = - { - new p - { - text = """ - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo - consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. - Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. - - """, - className = "m-0" - } - } - }, - new TabPanel - { - header = "Header II", - closable = true, - children = - { - new p - { - text = """ - - Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, - eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo - enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui - ratione voluptatem sequi nesciunt. Consectetur, adipisci velit, sed quia non numquam eius modi. - - """, - className = "m-0" - } - } - }, - new TabPanel - { - headerTemplate = new FlexRowCentered(CursorPointer, ClassName("p-tabview-nav-link"), Height(50), Gap(8)) - { - new Avatar - { - image = "https://primefaces.org/cdn/primereact/images/avatar/amyelsner.png", - shape = "circle", - className = "mx-2", - style = { Size(28) } - }, - "Amy Elsner" - }, - header = "Header III", - children = - { - new p - { - text = """ - - At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti - quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in - culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. - Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus. - - """, - className = "m-0" - } - } - } - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Showcases/RSuiteAutoCompleteDemo.cs b/ReactWithDotNet.WebSite/Showcases/RSuiteAutoCompleteDemo.cs deleted file mode 100644 index bf8d537e..00000000 --- a/ReactWithDotNet.WebSite/Showcases/RSuiteAutoCompleteDemo.cs +++ /dev/null @@ -1,56 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.ReactSuite; - -namespace ReactWithDotNet.WebSite.Showcases; - -sealed class RSuiteAutoCompleteDemo : Component -{ - protected override Element render() - { - string[] dataSource = - [ - "Eugenia", - "Bryan", - "Linda", - "Nancy", - "Lloyd", - "Alice", - "Julia", - "Albert", - "Louisa", - "Lester", - "Lola", - "Lydia", - "Hal", - "Hannah", - "Harriet", - "Hattie", - "Hazel", - "Hilda" - ]; - - return new div(SizeFull) - { - new AutoComplete - { - onChange = e => - { - state = state with { SelectedValue = e }; - - return Task.CompletedTask; - }, - - placeholder = "Search in names", - - data = dataSource, - - style = { Width(250) } - }, - new div { $"Hello {state.SelectedValue}" } - }; - } - - internal record State - { - public string SelectedValue { get; init; } - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Showcases/ReactPlayerDemo.cs b/ReactWithDotNet.WebSite/Showcases/ReactPlayerDemo.cs deleted file mode 100644 index 7c2956f3..00000000 --- a/ReactWithDotNet.WebSite/Showcases/ReactPlayerDemo.cs +++ /dev/null @@ -1,26 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries.React_Player; - -namespace ReactWithDotNet.WebSite.Showcases; - -sealed class ReactPlayerDemo : PureComponent -{ - protected override Element render() - { - return new FlexRowCentered - { - new div(Size(640, 360)) - { - new ReactPlayer - { - url = "https://uploads.codesandbox.io/uploads/user/fb7bd72f-ef17-4810-9e14-ca854fb0f56e/9GBo-mountain-video.mp4", - - width = "100%", - height = "100%", - volume = 0, - controls = true, - playsinline = true - } - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/Showcases/SwiperGalleryDemo.cs b/ReactWithDotNet.WebSite/Showcases/SwiperGalleryDemo.cs deleted file mode 100644 index 6d0018e7..00000000 --- a/ReactWithDotNet.WebSite/Showcases/SwiperGalleryDemo.cs +++ /dev/null @@ -1,36 +0,0 @@ -using ReactWithDotNet.ThirdPartyLibraries._Swiper_; - -namespace ReactWithDotNet.WebSite.Showcases; - -sealed class SwiperGalleryDemo : PureComponent -{ - protected override Element render() - { - var slides = Enumerable.Range(1, 8).Select(i => new SwiperSlide - { - new img - { - src = $"https://swiperjs.com/demos/images/nature-{i}.jpg", - style = - { - WidthFull, - Height(350), - ObjectFitCover - } - } - }); - - return new div(WidthFull, HeightAuto) - { - new Swiper(slides) - { - navigation = { enabled = true }, - modules = ["FreeMode", "Navigation"], - breakpoints = - { - {500,new (){ slidesPerView = 1}} - } - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/SvgFiles/twitter_30_30.cs b/ReactWithDotNet.WebSite/SvgFiles/twitter_30_30.cs deleted file mode 100644 index 530cd28d..00000000 --- a/ReactWithDotNet.WebSite/SvgFiles/twitter_30_30.cs +++ /dev/null @@ -1,19 +0,0 @@ -namespace ReactWithDotNet.WebSite.SvgFiles; - - -class twitter_30_30 : PureComponent -{ - public int WidthHeight { get; set; } = 30; - - protected override Element render() - { - return new svg(Size(WidthHeight), svg.ViewBox(0, 0, 24, 24)) - { - new path - { - d = "M19.633 7.997c.013.175.013.349.013.523 0 5.325-4.053 11.461-11.46 11.461-2.282 0-4.402-.661-6.186-1.809.324.037.636.05.973.05a8.07 8.07 0 0 0 5.001-1.721 4.036 4.036 0 0 1-3.767-2.793c.249.037.499.062.761.062.361 0 .724-.05 1.061-.137a4.027 4.027 0 0 1-3.23-3.953v-.05c.537.299 1.16.486 1.82.511a4.022 4.022 0 0 1-1.796-3.354c0-.748.199-1.434.548-2.032a11.457 11.457 0 0 0 8.306 4.215c-.062-.3-.1-.611-.1-.923a4.026 4.026 0 0 1 4.028-4.028c1.16 0 2.207.486 2.943 1.272a7.957 7.957 0 0 0 2.556-.973 4.02 4.02 0 0 1-1.771 2.22 8.073 8.073 0 0 0 2.319-.624 8.645 8.645 0 0 1-2.019 2.083z", - fill = "#00ACEE" - } - }; - } -} \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/SvgFiles/twitter_30_30.svg b/ReactWithDotNet.WebSite/SvgFiles/twitter_30_30.svg deleted file mode 100644 index 998d331f..00000000 --- a/ReactWithDotNet.WebSite/SvgFiles/twitter_30_30.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/1.png b/ReactWithDotNet.WebSite/wwwroot/assets/1.png deleted file mode 100644 index 85adf038..00000000 Binary files a/ReactWithDotNet.WebSite/wwwroot/assets/1.png and /dev/null differ diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/2.png b/ReactWithDotNet.WebSite/wwwroot/assets/2.png deleted file mode 100644 index 3cd6eff9..00000000 Binary files a/ReactWithDotNet.WebSite/wwwroot/assets/2.png and /dev/null differ diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/Designer.mp4 b/ReactWithDotNet.WebSite/wwwroot/assets/Designer.mp4 deleted file mode 100644 index d87ad599..00000000 Binary files a/ReactWithDotNet.WebSite/wwwroot/assets/Designer.mp4 and /dev/null differ diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/HtmlToCSharpView.mp4 b/ReactWithDotNet.WebSite/wwwroot/assets/HtmlToCSharpView.mp4 deleted file mode 100644 index 615f0c5e..00000000 Binary files a/ReactWithDotNet.WebSite/wwwroot/assets/HtmlToCSharpView.mp4 and /dev/null differ diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.I.drawio b/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.I.drawio deleted file mode 100644 index efee1635..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.I.drawio +++ /dev/null @@ -1,67 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.I.drawio.png b/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.I.drawio.png deleted file mode 100644 index 90df7923..00000000 Binary files a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.I.drawio.png and /dev/null differ diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.O.drawio b/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.O.drawio deleted file mode 100644 index 81985f76..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.O.drawio +++ /dev/null @@ -1,52 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.O.drawio.png b/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.O.drawio.png deleted file mode 100644 index 4ef087bf..00000000 Binary files a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail.O.drawio.png and /dev/null differ diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail1.drawio b/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail1.drawio deleted file mode 100644 index e7b14f05..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail1.drawio +++ /dev/null @@ -1,139 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail1.drawio.png b/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail1.drawio.png deleted file mode 100644 index 759d8846..00000000 Binary files a/ReactWithDotNet.WebSite/wwwroot/assets/TechnicalDetail1.drawio.png and /dev/null differ diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/csharp.svg b/ReactWithDotNet.WebSite/wwwroot/assets/csharp.svg deleted file mode 100644 index d0c7f028..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/csharp.svg +++ /dev/null @@ -1,6 +0,0 @@ - - -file_type_csharp - - - \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/design.png b/ReactWithDotNet.WebSite/wwwroot/assets/design.png deleted file mode 100644 index eae8d0ee..00000000 Binary files a/ReactWithDotNet.WebSite/wwwroot/assets/design.png and /dev/null differ diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/design.svg b/ReactWithDotNet.WebSite/wwwroot/assets/design.svg deleted file mode 100644 index 54f51357..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/design.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/doc.svg b/ReactWithDotNet.WebSite/wwwroot/assets/doc.svg deleted file mode 100644 index 7aa9b4b3..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/doc.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/favicon.ico b/ReactWithDotNet.WebSite/wwwroot/assets/favicon.ico deleted file mode 100644 index e19f48f5..00000000 Binary files a/ReactWithDotNet.WebSite/wwwroot/assets/favicon.ico and /dev/null differ diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/four_square_light.svg b/ReactWithDotNet.WebSite/wwwroot/assets/four_square_light.svg deleted file mode 100644 index 7315993c..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/four_square_light.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/import.svg b/ReactWithDotNet.WebSite/wwwroot/assets/import.svg deleted file mode 100644 index 90b7c0ff..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/import.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/net_core_logo.svg b/ReactWithDotNet.WebSite/wwwroot/assets/net_core_logo.svg deleted file mode 100644 index d04bf047..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/net_core_logo.svg +++ /dev/null @@ -1,2 +0,0 @@ - -logo_NETcore \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/play.svg b/ReactWithDotNet.WebSite/wwwroot/assets/play.svg deleted file mode 100644 index f1f24447..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/play.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/ReactWithDotNet.WebSite/wwwroot/assets/react.svg b/ReactWithDotNet.WebSite/wwwroot/assets/react.svg deleted file mode 100644 index d1ec3a75..00000000 --- a/ReactWithDotNet.WebSite/wwwroot/assets/react.svg +++ /dev/null @@ -1 +0,0 @@ -logo \ No newline at end of file diff --git a/ReactWithDotNet.sln b/ReactWithDotNet.sln index eb36ab7e..8605cc66 100644 --- a/ReactWithDotNet.sln +++ b/ReactWithDotNet.sln @@ -5,13 +5,9 @@ VisualStudioVersion = 17.0.32014.148 MinimumVisualStudioVersion = 10.0.40219.1 Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "ReactWithDotNet", "ReactWithDotNet\ReactWithDotNet.csproj", "{ABF5AA3B-7A14-4F34-8FE8-54834754D237}" EndProject -Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "ReactWithDotNet.WebSite", "ReactWithDotNet.WebSite\ReactWithDotNet.WebSite.csproj", "{A995C489-B0D2-4E43-80AA-D3E2BDFF9C07}" -EndProject Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "ReactWithDotNet.Test", "ReactWithDotNet.Test\ReactWithDotNet.Test.csproj", "{7C9C7BB7-DD6A-4191-A179-5034F86D27CA}" EndProject -Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "ReactWithDotNet.WebSite.Test", "ReactWithDotNet.WebSite.Test\ReactWithDotNet.WebSite.Test.csproj", "{E0EBAD92-9597-4B9C-A759-EBCEFE400BD1}" -EndProject -Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "ReactWithDotNet.SourceGenerator", "ReactWithDotNet.SourceGenerator\ReactWithDotNet.SourceGenerator.csproj", "{CA74FDCC-5277-4917-9075-2786B8AD29F2}" +Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "ReactWithDotNet.SourceGenerator", "ReactWithDotNet.SourceGenerator\ReactWithDotNet.SourceGenerator.csproj", "{CA74FDCC-5277-4917-9075-2786B8AD29F2}" EndProject Global GlobalSection(SolutionConfigurationPlatforms) = preSolution @@ -23,18 +19,10 @@ Global {ABF5AA3B-7A14-4F34-8FE8-54834754D237}.Debug|Any CPU.Build.0 = Debug|Any CPU {ABF5AA3B-7A14-4F34-8FE8-54834754D237}.Release|Any CPU.ActiveCfg = Release|Any CPU {ABF5AA3B-7A14-4F34-8FE8-54834754D237}.Release|Any CPU.Build.0 = Release|Any CPU - {A995C489-B0D2-4E43-80AA-D3E2BDFF9C07}.Debug|Any CPU.ActiveCfg = Debug|Any CPU - {A995C489-B0D2-4E43-80AA-D3E2BDFF9C07}.Debug|Any CPU.Build.0 = Debug|Any CPU - {A995C489-B0D2-4E43-80AA-D3E2BDFF9C07}.Release|Any CPU.ActiveCfg = Release|Any CPU - {A995C489-B0D2-4E43-80AA-D3E2BDFF9C07}.Release|Any CPU.Build.0 = Release|Any CPU {7C9C7BB7-DD6A-4191-A179-5034F86D27CA}.Debug|Any CPU.ActiveCfg = Debug|Any CPU {7C9C7BB7-DD6A-4191-A179-5034F86D27CA}.Debug|Any CPU.Build.0 = Debug|Any CPU {7C9C7BB7-DD6A-4191-A179-5034F86D27CA}.Release|Any CPU.ActiveCfg = Release|Any CPU {7C9C7BB7-DD6A-4191-A179-5034F86D27CA}.Release|Any CPU.Build.0 = Release|Any CPU - {E0EBAD92-9597-4B9C-A759-EBCEFE400BD1}.Debug|Any CPU.ActiveCfg = Debug|Any CPU - {E0EBAD92-9597-4B9C-A759-EBCEFE400BD1}.Debug|Any CPU.Build.0 = Debug|Any CPU - {E0EBAD92-9597-4B9C-A759-EBCEFE400BD1}.Release|Any CPU.ActiveCfg = Release|Any CPU - {E0EBAD92-9597-4B9C-A759-EBCEFE400BD1}.Release|Any CPU.Build.0 = Release|Any CPU {CA74FDCC-5277-4917-9075-2786B8AD29F2}.Debug|Any CPU.ActiveCfg = Debug|Any CPU {CA74FDCC-5277-4917-9075-2786B8AD29F2}.Debug|Any CPU.Build.0 = Debug|Any CPU {CA74FDCC-5277-4917-9075-2786B8AD29F2}.Release|Any CPU.ActiveCfg = Release|Any CPU diff --git a/ReactWithDotNet/a.cs b/ReactWithDotNet/a.cs index e210cc8e..2508203d 100644 --- a/ReactWithDotNet/a.cs +++ b/ReactWithDotNet/a.cs @@ -2,8 +2,6 @@ partial class Mixin { - - /// /// a.target = '_blank' ///