Skip to content

Commit

Permalink
Tooltip: global options (#5704)
Browse files Browse the repository at this point in the history
* Tooltip: global options

* Update docs

* Separate Delay parameters

* Move options to subfolder and separate files
  • Loading branch information
stsrki authored Aug 24, 2024
1 parent d21fb82 commit 4146080
Show file tree
Hide file tree
Showing 8 changed files with 51 additions and 8 deletions.
2 changes: 1 addition & 1 deletion Documentation/Blazorise.Docs/Models/Snippets.generated.cs
Original file line number Diff line number Diff line change
Expand Up @@ -4740,7 +4740,7 @@ private RenderFragment ToastRenderFragment( ToasterPlacement placement ) => __bu
<Button Color=""Color.Primary"">Hover me</Button>
</Tooltip>";

public const string TooltipDelayExample = @"<Tooltip Text=""I'm a Blazorise Tooltip!"" Delay=""(1000, 500)"">
public const string TooltipDelayExample = @"<Tooltip Text=""I'm a Blazorise Tooltip!"" ShowDelay=""1000"" HideDelay=""500"">
<Button Color=""Color.Primary"">Delay: (1000, 500)</Button>
</Tooltip>";

Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<div class="blazorise-codeblock">
<div class="html"><pre>
<span class="htmlTagDelimiter">&lt;</span><span class="htmlElementName">Tooltip</span> <span class="htmlAttributeName">Text</span><span class="htmlOperator">=</span><span class="quot">&quot;</span><span class="htmlAttributeValue">I&#39;m a Blazorise Tooltip!</span><span class="quot">&quot;</span> <span class="htmlAttributeName">Delay</span><span class="htmlOperator">=</span><span class="quot">&quot;</span><span class="htmlAttributeValue">(1000, 500)</span><span class="quot">&quot;</span><span class="htmlTagDelimiter">&gt;</span>
<span class="htmlTagDelimiter">&lt;</span><span class="htmlElementName">Tooltip</span> <span class="htmlAttributeName">Text</span><span class="htmlOperator">=</span><span class="quot">&quot;</span><span class="htmlAttributeValue">I&#39;m a Blazorise Tooltip!</span><span class="quot">&quot;</span> <span class="htmlAttributeName">ShowDelay</span><span class="htmlOperator">=</span><span class="quot">&quot;</span><span class="htmlAttributeValue">1000</span><span class="quot">&quot;</span> <span class="htmlAttributeName">HideDelay</span><span class="htmlOperator">=</span><span class="quot">&quot;</span><span class="htmlAttributeValue">500</span><span class="quot">&quot;</span><span class="htmlTagDelimiter">&gt;</span>
<span class="htmlTagDelimiter">&lt;</span><span class="htmlElementName">Button</span> <span class="htmlAttributeName">Color</span><span class="htmlOperator">=</span><span class="quot">&quot;</span><span class="enum">Color</span><span class="enumValue">.Primary</span><span class="quot">&quot;</span><span class="htmlTagDelimiter">&gt;</span>Delay: (1000, 500)<span class="htmlTagDelimiter">&lt;/</span><span class="htmlElementName">Button</span><span class="htmlTagDelimiter">&gt;</span>
<span class="htmlTagDelimiter">&lt;/</span><span class="htmlElementName">Tooltip</span><span class="htmlTagDelimiter">&gt;</span>
</pre></div>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
@namespace Blazorise.Docs.Docs.Examples

<Tooltip Text="I'm a Blazorise Tooltip!" Delay="(1000, 500)">
<Tooltip Text="I'm a Blazorise Tooltip!" ShowDelay="1000" HideDelay="500">
<Button Color="Color.Primary">Delay: (1000, 500)</Button>
</Tooltip>
Original file line number Diff line number Diff line change
Expand Up @@ -135,7 +135,10 @@
<DocsAttributesItem Name="AppendTo" Type="string" Default="body">
The element to append the tooltip to. If <Code>Interactive = true</Code>, the default behavior is appendTo: "parent".
</DocsAttributesItem>
<DocsAttributesItem Name="Delay" Type="(int Show, int Hide)" Default="(0, 0)">
Specifies the delay in ms once a trigger event is fired before a Tooltip shows or hides.
<DocsAttributesItem Name="ShowDelay" Type="int?" Default="null">
Specifies the delay in ms once a trigger event is fired before a Tooltip shows.
</DocsAttributesItem>
<DocsAttributesItem Name="HideDelay" Type="int?" Default="null">
Specifies the delay in ms once a trigger event is fired before a Tooltip hides.
</DocsAttributesItem>
</DocsAttributes>
Original file line number Diff line number Diff line change
Expand Up @@ -131,6 +131,10 @@
Added an option to delay the tooltip show and hide events. This can be useful if you want to prevent the tooltip from showing immediately after the trigger event.
</Paragraph>

<Paragraph>
Along with the options to define delay on each individual Tooltip, we have also added a global options to define the delay for all tooltips. This can be done by setting the <Code>TooltipOptions</Code> property in the <Code>.AddBlazorise()</Code> during the application start process.
</Paragraph>

<Heading Size="HeadingSize.Is3">
DataGrid
</Heading>
Expand Down
20 changes: 17 additions & 3 deletions Source/Blazorise/Components/Tooltip/Tooltip.razor.cs
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,11 @@ protected override void OnInitialized()
zIndex = ZIndex,
interactive = Interactive,
appendTo = AppendTo,
delay = new { show = Delay.Show, hide = Delay.Hide }
delay = new
{
show = ( ShowDelay ?? Options?.TooltipOptions?.ShowDelay ) ?? 0,
hide = ( HideDelay ?? Options?.TooltipOptions?.HideDelay ) ?? 0,
}
} );
} );

Expand Down Expand Up @@ -123,6 +127,11 @@ private static string ToTippyTrigger( TooltipTrigger trigger )
/// <inheritdoc/>
protected override bool ShouldAutoGenerateId => true;

/// <summary>
/// Holds the information about the Blazorise global options.
/// </summary>
[Inject] protected BlazoriseOptions Options { get; set; }

/// <summary>
/// Gets or sets the <see cref="IJSTooltipModule"/> instance.
/// </summary>
Expand Down Expand Up @@ -303,9 +312,14 @@ public TooltipTrigger Trigger
[Parameter] public RenderFragment ChildContent { get; set; }

/// <summary>
/// Specifies the delay in ms once a trigger event is fired before a Tooltip shows or hides.
/// Specifies the delay in ms once a trigger event is fired before a Tooltip shows.
/// </summary>
[Parameter] public int? ShowDelay { get; set; }

/// <summary>
/// Specifies the delay in ms once a trigger event is fired before a Tooltip hides.
/// </summary>
[Parameter] public (int Show, int Hide) Delay { get; set; } = (0, 0);
[Parameter] public int? HideDelay { get; set; }

/// <summary>
/// Cascaded theme settings.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -124,5 +124,10 @@ public string LicenseKey
/// </summary>
public bool SafeJsInvoke { get; set; } = true;

/// <summary>
/// Gets or sets the options used to configure the behavior of the Tooltip. This allows you to customize the Tooltip's appearance and timing.
/// </summary>
public BlazoriseTooltipOptions TooltipOptions { get; set; }

#endregion
}
17 changes: 17 additions & 0 deletions Source/Blazorise/Options/BlazoriseTooltipOptions.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
namespace Blazorise;

/// <summary>
/// Represents the options available for configuring the behavior of a Tooltip in Blazorise.
/// </summary>
public class BlazoriseTooltipOptions
{
/// <summary>
/// Specifies the delay in milliseconds (ms) after a trigger event before a Tooltip is shown. Default is <c>null</c> for no delay.
/// </summary>
public int? ShowDelay { get; set; }

/// <summary>
/// Specifies the delay in milliseconds (ms) after a trigger event before a Tooltip is hidden. Default is <c>null</c> for no delay.
/// </summary>
public int? HideDelay { get; set; }
}

0 comments on commit 4146080

Please sign in to comment.