blazorfluentui / blazorfluentui Goto Github PK

This is a minor bug as it doesn't break anything. FocusZone still works. However, several of the properties are currently not working:

OnActiveElementChanged
OnBeforeFocus
ShouldInputLoseFocusOnArrowKey

The one throwing the exceptions is probably OnActiveElementChanged as it is supposed to get the current element in its callback. Something's not working when trying to serialize an HTMLElement back to an object. Probably should force it to serialize to ElementReference instead.

Currently a lot of namespaces exist, which makes a lot of sense in the folder structure. However it would be nice if we set the namespace to 1 e.g.

@namespace BlazorFabric

This way it's much cleaner to use the components in other libs.

The way submenus in a ContextualMenu are closed from lightdismiss clicks conflicts with the onclick event of each button in the submenu. May need to refactor the whole thing...

Mask Properties on Textfiel should be deleted and moved to a MaskTextField-Component

I think StackTokens-Properties like Max-Width or Max-Heigh now not working because the values don't have unit's.
I think there are two ways to solve this problem:

1. values become strings instead of double
2. all values get unit 'px' or '%'

Messagebar.css force font-weight for button up to 600 which should not be needed
maybe there is a problem with relation between messagebar and defaultbutton

While making the FocusTrapZone I noticed this... probably something wrong with the css.

The app crash's by using an TextField with validation an you type in the text very fast.
Seems to be a problem in DeferredValidation-> Task

Not sure if this is really necessary.

The original React control will update the value of the Rating when navigating using the keyboard. In our current version of the control, you can navigate the control with the keyboard, but you need to push spacebar to make the value of the Rating change.

Should we make it like the React control or leave it alone?

Why ever the Button style of Messagebar differ between Server-Side an Client-Side

Doesn't respond to overflow setting yet. So some controls with built-in Tooltip won't work because they depend on showing the full text only when text is overflowing.

You can see this in the Rating page on the demo. When tabbing through the different ratings, the 1st star is always selected instead of the most filled star.

This is a quality of life request to add in support for Blazor binding semantics.
Current:
<TextField Value="@Model.Property" OnChange="@HandleChange" />
Preferred:
<TextVield @bind-Value="@Model.Property"/>

The description line under TextField seems to have wrong css style

Need to add FocusZone to already created components:

• Rating
• OverflowSet

Overflow property on MessageBar seems wrong on DemoPage

#27

Turns out this bug in Panel was causing the weird errors in the new version of ResponsiveLayout

Need to add the following to Directory.Build.props:

<ItemGroup>
    <!-- .js/.css files will be referenced via <script>/<link> tags; other content files will just be included in the app's 'dist' directory without any tags referencing them -->
    <EmbeddedResource Include="wwwroot\**\*.js" LogicalName="blazor:js:%(RecursiveDir)%(Filename)%(Extension)" />
    <EmbeddedResource Include="wwwroot\**\*.css" LogicalName="blazor:css:%(RecursiveDir)%(Filename)%(Extension)" />
    <EmbeddedResource Include="wwwroot\**" Exclude="**\*.js;**\*.css" LogicalName="blazor:file:%(RecursiveDir)%(Filename)%(Extension)" />
  </ItemGroup>

Hi
I wanted to checkout the demo, but the page stays on the "Loading.." page for me. I checked the Dev Tools and I have loads of 403 messages coming back.

This is probably something within ContextMenu that has to be changed

If FocusZone-Component is ready Rating should be embedded in it
AriaLabel needs to be implemented up to then

Check to see focus events wired properly and attributes not missing

Check to see if there's a performance implication.

Also, remove Aria properties from components already implemented...

Typescript code was copied and quickly shoehorned into this library. Need to check why the position calculation is not reliable. If the button has the callout opening on the right side, but the window border is close to the button, the callout should flip to the other side... but it does NOT.

Need to add selector for ms-Fabric--isFocusVisible.

• The typescript file is full of functions that aren't sorted in any way.
• The base directory has no order to it as well. It's not as bad as the typescript file, but it will be soon.
• There is no guidance on what should be in the BaseComponent project. Currently, it's just what seems to be available in more than one control...

Almost all of the css has been moved into inline styles or <style> tags in the component (because of variable values). Make sure the rest of the css properties still in stack.css are moved to StackBase methods and delete the css file.

Second Part of #30

I just used a div in its place in most controls because it wasn't implemented yet.

FocusTrapZone and probably other controls depend on a few attributes that I have been inconsistent in implementing. These are:

data-is-focusable
data-is-visible
data-focuszone-id
data-is-sub-focuszone

Need to go back and make sure these are on all the controls that need them so other controls work correctly. The buttons seem to have data-is-focusable but I don't know what else.

On the demo page, when you are keyboard navigating through the ratings, if you change the value on a Rating that has another UI element bound to its value, the Rating will lose focus. This should not happen. Not sure if it is the Rating component itself or the FocusZone inside that is the problem.

Need to convert the ResponsiveLayoutItem to render as a layout with body instead of components with children.

First of all, thank you for your great work to leverage the React work of the Fabric team to be useable in a Blazor context. Great!

Secondly, I noticed that the demo at https://blazorfabric.azurewebsites.net works great on macOS using Chrome-based Browsers like Chrome or Microsoft Edge but not in Safari. Is this just a behavior of the moment or is no support, also in long term, not planned to support Safari?

Error message:

Date of test:
30th Oct. 2019

macOS:
10.14.6 (18G95)

Safari:
Version 13.0.1 (14608.2.11.1.11)

Hey @limefrogyank ,

Very big Thank you for your Work, I realy like it and it make fun to see progress of this beautifull project.
Is there a chance that you include Basic Toggles in one of the next releases?
It would be realy nice, when I could use them in my Blazor-PWA.