Skip to content

[dev-v5] fluent-text-suggestion Web Component #3129

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 10 commits into
base: dev-v5
Choose a base branch
from

Conversation

dvoituron
Copy link
Collaborator

[dev-v5] fluent-text-suggestion Web Component

Add an HTML Web Component to prepare a future FluentUI-Blazor component.
This web component is inspired by the Smart Components created by Steve Sanderson.

This web component contains:

  1. An anchor attribute to reference the text field where the suggestion should be displayed.
  2. A value attribute containing the suggestion text to display or to update.
  3. A minlength and delay attribute to configure the suggestion process directly from the JS client.
  4. A shadowQuerySelector attribute to locate the field within another Fluent web component.

Example where the suggestion is updated every 2 seconds, by a JS script.
peek_2

<textarea id="my-area" spellcheck="false" />
<fluent-text-suggestion anchor="my-area" value="abc" minlength="3" delay="10" />
<fluent-textarea id="my-field-area" />
<fluent-text-suggestion anchor="my-field-area" shadowQuerySelector="textarea[id='control']" value="abc" />

Copy link

github-actions bot commented Jan 6, 2025

✅ All tests passed successfully

Details on your Workflow / Core Tests page.

Copy link

github-actions bot commented Jan 6, 2025

Summary - Unit Tests Code Coverage

Summary
Generated on: 03/10/2025 - 13:26:41
Coverage date: 03/10/2025 - 13:26:34
Parser: Cobertura
Assemblies: 1
Classes: 80
Files: 100
Line coverage: 99.3% (1857 of 1870)
Covered lines: 1857
Uncovered lines: 13
Coverable lines: 1870
Total lines: 8032
Branch coverage: 93.1% (1122 of 1204)
Covered branches: 1122
Total branches: 1204
Method coverage: Feature is only available for sponsors
Tag: 2942_13765803035

Coverage

Microsoft.FluentUI.AspNetCore.Components - 99.3%
Name Line Branch
Microsoft.FluentUI.AspNetCore.Components 99.3% 93.1%
Microsoft.FluentUI.AspNetCore.Components.AdditionalAttributesExtensions 100% 100%
Microsoft.FluentUI.AspNetCore.Components.DefaultStyles 100%
Microsoft.FluentUI.AspNetCore.Components.Dialog.MessageBox.FluentMessageBox 100% 100%
Microsoft.FluentUI.AspNetCore.Components.DialogEventArgs 100% 92.8%
Microsoft.FluentUI.AspNetCore.Components.DialogInstance 100% 100%
Microsoft.FluentUI.AspNetCore.Components.DialogOptions 100%
Microsoft.FluentUI.AspNetCore.Components.DialogOptionsFooter 100% 100%
Microsoft.FluentUI.AspNetCore.Components.DialogOptionsFooterAction 100% 100%
Microsoft.FluentUI.AspNetCore.Components.DialogOptionsHeader 100%
Microsoft.FluentUI.AspNetCore.Components.DialogResult 100% 100%
Microsoft.FluentUI.AspNetCore.Components.DialogResult`1 100%
Microsoft.FluentUI.AspNetCore.Components.DialogService 98.9% 81.4%
Microsoft.FluentUI.AspNetCore.Components.DialogToggleEventArgs 100%
Microsoft.FluentUI.AspNetCore.Components.Extensions.EnumExtensions 100% 100%
Microsoft.FluentUI.AspNetCore.Components.Extensions.FieldSizeExtensions 100% 100%
Microsoft.FluentUI.AspNetCore.Components.Extensions.FluentInputExtensions 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentAnchorButton 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentAvatar 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentBadge 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentButton 100% 93.1%
Microsoft.FluentUI.AspNetCore.Components.FluentCheckbox 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentComponentBase 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentCounterBadge 100% 96.1%
Microsoft.FluentUI.AspNetCore.Components.FluentDialog 97.4% 89.7%
Microsoft.FluentUI.AspNetCore.Components.FluentDialogBody 100% 91.6%
Microsoft.FluentUI.AspNetCore.Components.FluentDialogInstance 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentDialogProvider 100% 79.1%
Microsoft.FluentUI.AspNetCore.Components.FluentDivider 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentField 100% 96.5%
Microsoft.FluentUI.AspNetCore.Components.FluentFieldCondition 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentFieldConditionItem 100%
Microsoft.FluentUI.AspNetCore.Components.FluentFieldConditionOptions 100%
Microsoft.FluentUI.AspNetCore.Components.FluentFieldExtensions 100%
Microsoft.FluentUI.AspNetCore.Components.FluentFieldParameterSelector 100% 98.7%
Microsoft.FluentUI.AspNetCore.Components.FluentGrid 100% 90%
Microsoft.FluentUI.AspNetCore.Components.FluentGridItem 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentIcon`1 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentInputBase`1 93.3% 25%
Microsoft.FluentUI.AspNetCore.Components.FluentInputImmediateBase`1 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentJSModule 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentLabel 100%
Microsoft.FluentUI.AspNetCore.Components.FluentLayout 100% 71.4%
Microsoft.FluentUI.AspNetCore.Components.FluentLayoutHamburger 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentLayoutItem 100% 89.2%
Microsoft.FluentUI.AspNetCore.Components.FluentLink 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentListBase`1 93.7% 94.7%
Microsoft.FluentUI.AspNetCore.Components.FluentLocalizerExtensions 100%
Microsoft.FluentUI.AspNetCore.Components.FluentLocalizerInternal 100%
Microsoft.FluentUI.AspNetCore.Components.FluentOption 91.6% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentProgressBar 100% 95.4%
Microsoft.FluentUI.AspNetCore.Components.FluentRatingDisplay 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentSelect`1 100%
Microsoft.FluentUI.AspNetCore.Components.FluentServiceBase`1 100%
Microsoft.FluentUI.AspNetCore.Components.FluentServiceProviderException`1 100%
Microsoft.FluentUI.AspNetCore.Components.FluentSpinner 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentStack 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentStatus 100%
Microsoft.FluentUI.AspNetCore.Components.FluentText 100% 100%
Microsoft.FluentUI.AspNetCore.Components.FluentTextArea 100% 66.6%
Microsoft.FluentUI.AspNetCore.Components.FluentTextInput 100% 78.5%
Microsoft.FluentUI.AspNetCore.Components.Icon 100% 89.4%
Microsoft.FluentUI.AspNetCore.Components.IconFromImage 100%
Microsoft.FluentUI.AspNetCore.Components.IconInfo 100%
Microsoft.FluentUI.AspNetCore.Components.IFluentLocalizer 100% 100%
Microsoft.FluentUI.AspNetCore.Components.InternalListContext`1 60%
Microsoft.FluentUI.AspNetCore.Components.Localization.LanguageResource 100% 100%
Microsoft.FluentUI.AspNetCore.Components.MessageBoxOptions 100%
Microsoft.FluentUI.AspNetCore.Components.Migration.AppearanceExtensions 100% 100%
Microsoft.FluentUI.AspNetCore.Components.Migration.FluentInputAppearanceExt
ensions
100% 100%
Microsoft.FluentUI.AspNetCore.Components.ServiceProviderExtensions 100%
Microsoft.FluentUI.AspNetCore.Components.SpacingExtensions 100% 97.2%
Microsoft.FluentUI.AspNetCore.Components.Utilities.AddTag 100% 100%
Microsoft.FluentUI.AspNetCore.Components.Utilities.CssBuilder 100% 100%
Microsoft.FluentUI.AspNetCore.Components.Utilities.Debounce 100% 83.3%
Microsoft.FluentUI.AspNetCore.Components.Utilities.Identifier 100% 100%
Microsoft.FluentUI.AspNetCore.Components.Utilities.IdentifierContext 100% 75%
Microsoft.FluentUI.AspNetCore.Components.Utilities.InlineStyleBuilder 100% 92.8%
Microsoft.FluentUI.AspNetCore.Components.Utilities.InternalDebounce.Dispatc
herTimerExtensions
95.7% 75%
Microsoft.FluentUI.AspNetCore.Components.Utilities.StyleBuilder 100% 100%
Microsoft.FluentUI.AspNetCore.Components.ZIndex 100%

@osmanm786
Copy link

Damn. This dude is putting in some work. Somebody get this man a raise.

@dvoituron
Copy link
Collaborator Author

Damn. This dude is putting in some work. Somebody get this man a raise.

And this work is done outside my normal working hours 😁
Thanks for the compliment.

This PR is certainly not finished yet

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants