Tooltip

.gitignore

@@ -234,4 +234,5 @@ _Pvt_Extensions
 .paket/paket.exe
 
 # FAKE - F# Make
-.fake/
+.fake/
+*.DotSettings

Material/src/Material.csproj

@@ -35,6 +35,7 @@
     <ProjectReference Include="..\..\Table\src\Table.csproj" Version="2.0.0" />
     <ProjectReference Include="..\..\Text\src\Text.csproj" Version="2.0.0" />
     <ProjectReference Include="..\..\Toolbar\src\Toolbar.csproj" Version="2.0.0" />
+    <ProjectReference Include="..\..\Tooltip\src\Tooltip.csproj" />
     <ProjectReference Include="..\..\Transition\src\Transition.csproj" Version="2.0.0" />
     <ProjectReference Include="..\..\Typography\src\Typography.csproj" Version="2.0.0" />
     <ProjectReference Include="..\..\Hidden\src\Hidden.csproj" Version="2.0.0" />

Material/src/MaterialScripts.razor

@@ -1,2 +1,3 @@
 <ScriptHelpersScript />
-<DomHelpersScript />
+<DomHelpersScript />
+<TooltipHelpersScript />

Material/src/MaterialStyles.razor

@@ -25,4 +25,5 @@
 <MenuStyles />
 <TabStyles />
 <HiddenStyle />
-<LinkStyle />
+<LinkStyle />
+<TooltipStyle />

Material/src/_Imports.razor

@@ -39,5 +39,6 @@
 @using Skclusive.Material.Menu
 @using Skclusive.Material.Tab
 @using Skclusive.Material.Container
+@using Skclusive.Material.Tooltip
 
-@using Skclusive.Script.DomHelpers
+@using Skclusive.Script.DomHelpers

Skclusive.Material.Component.sln

@@ -131,6 +131,10 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Container", "Container", "{
 EndProject
 Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Container", "Container\src\Container.csproj", "{D3836F1B-3554-4F71-B450-FC23F467CD0A}"
 EndProject
+Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Tooltip", "Tooltip", "{0290CE1B-D02B-4A3A-BA30-8B84D65AFA17}"
+EndProject
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Tooltip", "Tooltip\src\Tooltip.csproj", "{20C5D585-318C-4545-9808-23FFEC7676C6}"
+EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution
 		Debug|Any CPU = Debug|Any CPU
@@ -140,9 +144,6 @@ Global
 		Release|x64 = Release|x64
 		Release|x86 = Release|x86
 	EndGlobalSection
-	GlobalSection(SolutionProperties) = preSolution
-		HideSolutionNode = FALSE
-	EndGlobalSection
 	GlobalSection(ProjectConfigurationPlatforms) = postSolution
 		{95D5904F-C4F1-40A2-A563-31D80424EB90}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
 		{95D5904F-C4F1-40A2-A563-31D80424EB90}.Debug|Any CPU.Build.0 = Debug|Any CPU
@@ -528,6 +529,21 @@ Global
 		{D3836F1B-3554-4F71-B450-FC23F467CD0A}.Release|x64.Build.0 = Release|Any CPU
 		{D3836F1B-3554-4F71-B450-FC23F467CD0A}.Release|x86.ActiveCfg = Release|Any CPU
 		{D3836F1B-3554-4F71-B450-FC23F467CD0A}.Release|x86.Build.0 = Release|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Debug|x64.ActiveCfg = Debug|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Debug|x64.Build.0 = Debug|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Debug|x86.ActiveCfg = Debug|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Debug|x86.Build.0 = Debug|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Release|Any CPU.Build.0 = Release|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Release|x64.ActiveCfg = Release|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Release|x64.Build.0 = Release|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Release|x86.ActiveCfg = Release|Any CPU
+		{20C5D585-318C-4545-9808-23FFEC7676C6}.Release|x86.Build.0 = Release|Any CPU
+	EndGlobalSection
+	GlobalSection(SolutionProperties) = preSolution
+		HideSolutionNode = FALSE
 	EndGlobalSection
 	GlobalSection(NestedProjects) = preSolution
 		{95D5904F-C4F1-40A2-A563-31D80424EB90} = {6AFD1E9C-D89B-4385-8954-2BCEF239FA91}
@@ -562,5 +578,9 @@ Global
 		{B8556016-D55D-4C84-B331-5369129D6A5F} = {91687B8F-58F5-4BD4-ADD5-F5F6D9A643BF}
 		{2D6C4BA5-BA0D-4C6D-BC29-FF5C80D85198} = {FD4AC138-9A66-4E84-B512-319A59FDDC0A}
 		{D3836F1B-3554-4F71-B450-FC23F467CD0A} = {BA2B6EE0-729F-40F7-9B63-8823B69D4571}
+		{20C5D585-318C-4545-9808-23FFEC7676C6} = {0290CE1B-D02B-4A3A-BA30-8B84D65AFA17}
+	EndGlobalSection
+	GlobalSection(ExtensibilityGlobals) = postSolution
+		SolutionGuid = {BFE8C835-5479-476A-A98F-721CC3740275}
 	EndGlobalSection
 EndGlobal

Theme/src/Theme/ThemeBuilder.cs

@@ -30,6 +30,8 @@ public static ThemeConfig BuildCommon()
 
                 ZindexDrawer = "1200",
 
+                ZindexTooltip = "1500",
+
                 Shadow0 = "none",
 
                 Shadow1 = "0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12)",

Theme/src/Theme/ThemeConfig.cs

@@ -18,6 +18,8 @@ public class ThemeConfig
 
         public string ZindexDrawer { set; get; }
 
+        public string ZindexTooltip { set; get; }
+
         public string Shadow0 { set; get; }
 
         public string Shadow1 { set; get; }

Theme/src/Theme/ThemeProducer.cs

@@ -36,6 +36,7 @@ public static string BuildCommon(ThemeConfig theme)
             --theme-html-font-size: {theme.HtmlFontSize};
             --theme-zindex-appbar: {theme.ZindexAppBar};
             --theme-zindex-drawer: {theme.ZindexDrawer};
+            --theme-zindex-tooltip: {theme.ZindexTooltip};
             --theme-font-size-coef: calc(var(--theme-font-size) / 14);
             --theme-font-size-rem-factor: calc(
                 var(--theme-font-size-coef) / var(--theme-html-font-size)

Tooltip/src/Popper/IPopperContext.cs

@@ -0,0 +1,67 @@
+using System;
+using System.Collections.Generic;
+using System.Text;
+using Skclusive.Core.Component;
+
+namespace Skclusive.Material.Tooltip
+{
+    public interface IPopperContext : IComponentContext
+    {
+        bool Open { get; }
+        Action<IReference, bool> OnEnter { get; }
+        Action<IReference> OnExited { get; }
+    }
+
+    public class PopperContextBuilder : ComponentContextBuilder<PopperContextBuilder, IPopperContext>
+    {
+        public class PopperContext : ComponentContext, IPopperContext
+        {
+            public bool Open { get; internal set; }
+            public Action<IReference, bool> OnEnter { get; internal set; }
+            public Action<IReference> OnExited { get; internal set; }
+        }
+
+        protected PopperContext MContext => base.Context as PopperContext;
+
+        public PopperContextBuilder() : base(new PopperContext())
+        {
+        }
+
+        public PopperContextBuilder WithOpen(bool open)
+        {
+            MContext.Open = open;
+
+            return this;
+        }
+
+        public PopperContextBuilder WithOnEnter(Action<IReference, bool> onEnter)
+        {
+            MContext.OnEnter = onEnter;
+
+            return this;
+        }
+
+        public PopperContextBuilder WithOnExited(Action<IReference> onExited)
+        {
+            MContext.OnExited = onExited;
+
+            return this;
+        }
+
+        public override PopperContextBuilder With(IPopperContext context)
+        {
+            base.With(context)
+                .WithOpen(context.Open)
+                .WithRefBack(context.RefBack)
+                .WithOnEnter(context.OnEnter)
+                .WithOnExited(context.OnExited);
+
+            return this;
+        }
+
+        protected override PopperContextBuilder This()
+        {
+            return this;
+        }
+    }
+}

Tooltip/src/Popper/Popper.razor

@@ -0,0 +1,17 @@
+@namespace Skclusive.Material.Tooltip
+@inherits MaterialComponentBase
+
+@if (!KeepMounted && !Open && (!Transition || TransitionExited()))
+{
+}
+else
+{
+    <Portal DisablePortal="@DisablePortal" TargetRef="@Container" Context="PortalContext">
+        <Component class="@_Class"
+                   style="@_Style"
+                   RootRef="@(new DelegateReference("PopperDelegateRef", RootRef, PortalContext.RefBack))"
+                   @attributes="Attributes">
+            @ChildContent.Invoke(GetPopperContext(context))
+        </Component>
+    </Portal>
+}