masastack / MASA.Blazor

Blazor UI component library based on Material Design. Support Blazor Server, Blazor WebAssembly and MAUI Blazor.
https://docs.masastack.com/blazor/getting-started/installation
MIT License
1.12k stars 151 forks source link

This Will Make Package Better #1356

Closed wisamidris7 closed 8 months ago

wisamidris7 commented 12 months ago

Your Tabs And Expansion Is To Slow Cause There Animations And It Load All Once I Want Like Viruiztion When Dom Does Not Take Big Big Objects Cause I Have 8 Tabs In My App And I Wait For Page 10 seconds For It To Load Cause Each Tab Has Big Content I Think You Have To Make Somthing Like {LoadAllTab = false or DontLoadAllTab} For Package And

Auto MCol To Make MInput Takes Cols ,Sm and Md And Make It As Class In Object And Make AutoTranslate For Label And This Will Make 1.0.0 rc-4 Better Version And It Will Save 2 Lines For Every TextField And Thanks

capdiem commented 12 months ago

Your Tabs And Expansion Is To Slow ...

Do you mean the MTab component? It's just a title, and it doesn't usually contain much logic. The MExpansions component does not use delayed loading, so it does have an optimization direction.

Auto MCol To Make MInput Takes Cols ,Sm and Md And Make It As Class In Object And Make AutoTranslate For Label ...

I don't quite understand. Maybe you can do it yourself with a secondary encapsulation.

public class TextField: MTextFIeld {
    protected override void OnParametersSet() {
        Label = ...
    }
}
wisamidris7 commented 12 months ago

Tab Item

capdiem commented 12 months ago

@wisamidris7 MTabsItems is already lazy to load and does not load all the DOM at once

wisamidris7 commented 12 months ago

How to make this scrollable Cause Like This Is Not Right Specially In Mobile

Screenshot 2023-06-06 154634

Screenshot 2023-06-06 154722

The Same Template In Yours Modal Docs Form

wisamidris7 commented 12 months ago

I Want Some thing Like Make It Scrollable I Tried To Make It But I Did't Get Result

wisamidris7 commented 12 months ago

I Mean You Can Also Provide Me A CSS Code

capdiem commented 12 months ago

There are some problems with Autocomplete in Dialog... Thanks for your feedback.

If you just want the content scrollable:

@inject MasaBlazor MasaBlazor

<MAutocomplete MenuProps="MenuProps">
</Autocomplete>

@code {
    private void MenuProps(BMenuProps props) {
        if (MasaBlazor.Breakpoint.SmAndDown) {
           props.MaxHeight = 150;
        }
    }
}
wisamidris7 commented 12 months ago

But About Lazy Loading Is I Used Expansion And It Load All Once

Screenshot 2023-06-07 150828

If There Some Option You Can Provide Me With It

wisamidris7 commented 12 months ago

MTextField Is Call ValueChanged For Every Character I Wrote

And When I Make It On OnParameterSet It's Render In Just 4 Chars

Somtimes 27 to 47 Cause For Every Char I Wrote The Parameter Change Cause ValueChanged Set Value And When Value Set The OnParameterSet Got Called

And What I Think Of That I Might Make It On OnInit... And Also Did't Cause Label Will Set Every Time Cause He Compair The CurruntValue And SettedValue

And I Maked Name Prop And I Make It Like This {Name="firstname"} And I Tired To Change All App From Label To Name Cause If I CHange Label I Have Some Components That Like Modal I Have Label In Top Like This So I Don't Know What I Do And When I Run It Webassebly It Laggggged So Much I Click At TextField And I Wrote A Char And I Wait One Second

You Should See What Makes Webassembly Laggged Cause The Browser Not So Powerfully To Get From 100 to 200 Item To Translate One Word

capdiem commented 12 months ago

@wisamidris7 ExpansionPanelContent will support for lazy loading in 1.0.0-rc.4. Use Eager parameter to force load all.

capdiem commented 12 months ago

MTextField Is Call ValueChanged For Every Character I Wrote

And When I Make It On OnParameterSet It's Render In Just 4 Chars

Somtimes 27 to 47 Cause For Every Char I Wrote The Parameter Change Cause ValueChanged Set Value And When Value Set The OnParameterSet Got Called

And What I Think Of That I Might Make It On OnInit... And Also Did't Cause Label Will Set Every Time Cause He Compair The CurruntValue And SettedValue

And I Maked Name Prop And I Make It Like This {Name="firstname"} And I Tired To Change All App From Label To Name Cause If I CHange Label I Have Some Components That Like Modal I Have Label In Top Like This So I Don't Know What I Do And When I Run It Webassebly It Laggggged So Much I Click At TextField And I Wrote A Char And I Wait One Second

You Should See What Makes Webassembly Laggged Cause The Browser Not So Powerfully To Get From 100 to 200 Item To Translate One Word

Sorry, I only understand a little bit. Is MTextField Slow? Maybe provide the TEST code?

If you want to know how to automatically generate Label, you refer to the following code:

public class TextField : MTextField<string>
{
    protected override void OnParametersSet()
    {
        base.OnParametersSet();

        if (Label is null && ValueExpression is not null)
        {
            var accessorBody = ValueExpression.Body;

            if (accessorBody is UnaryExpression unaryExpression
                && unaryExpression.NodeType == ExpressionType.Convert
                && unaryExpression.Type == typeof(object))
            {
                accessorBody = unaryExpression.Operand;
            }

            var fieldName = (accessorBody as MemberExpression)!.Member.Name;
            Label = fieldName;
        }
    }
}
wisamidris7 commented 11 months ago

About TextField I Mean That It Slow When I Make This @ 1 public class TextField: MTextFIeld { 2 protected override void OnParametersSet() { 3 Label = i18n.T(Label); // This Line It Lagged Cause He Search In Directory About This Word 4 } 5 } @ I Readed You i18n code i found that you make all words in Dictionary And This Good But Every Word I Wrote It Load From Dictionary 2 times and this make textfield slow in webassembly but in server-side my server will be also slow or attacked as i name it

Your MTextFIeld Is Good But New TextField Is Bad Becuase Line 3

capdiem commented 11 months ago

@wisamidris7 I seem to have reproduced the problem, I will investigate this tomorrow. Thanks!

wisamidris7 commented 11 months ago

ok thanks

wisamidris7 commented 11 months ago

I Just Want To Tell You To Not Use Many Dicentory Here Example WSM

sScreenshot 2023-06-07 121223

capdiem commented 11 months ago

@wisamidris7 Twice for every word you type? I guess there are two TextFields on your page.

There seems to be no way to improve the performance of I18n.T. I do not feel slow when using it. Avoid to search from dictionary when you type:

private string? _i18nLabel;
private string? _prevLabel;

protected override void OnParametersSet()
{
    base.OnParametersSet();

    if (_prevLabel != Label)
    {
        _prevLabel = Label;
        _i18nLabel = I18n.T(Label);
    }

    Label = _i18nLabel;
}
capdiem commented 11 months ago
<TextField @bind-Value="value1" />
<TextField @bind-Value="value2" />
<TextField Value="value3" />

when input the first TextField, a StateHasChanged would be invoked, so the secondary TextField will re-render and it's OnParametersSet will be invoked. @bind-Value contains a ValueChanged parameter, it's not a value type, so secondary textfield will be rendered. The third TextField would not re-render.

wisamidris7 commented 11 months ago

Thanks 👍

In Any Date 1.0.0-rc4 Will Reaslse

capdiem commented 11 months ago

@wisamidris7 next week

wisamidris7 commented 11 months ago

Can You Make Helper Or Vaildation Text Doesn't Take Space In Form Just When Message Are Not Empty

You Can Make IsPopup For Popup For Vaildation Text To Be position: absoulte

Or You Can Show Helper Text Or Vaildation Text If There Text

And Now What I Maked HideDetails For Message But

And This Is My Suggestion Cause I Want Users Know What Problem

wisamidris7 commented 11 months ago

Screenshot 2023-06-11 100921

This What Now Looks Like And This Not Good

wisamidris7 commented 11 months ago

Also Can You Provide Me Code To Make Page Tabs or Page Contaniner Know That

localhost:5001/example This Page localhost:5001/example?name=123 Also This In Sprit Page

What PageTabs Or PageContaniner Is Not Know If 'localhost:5001/example?name=123' is other page Cause I Think There StartsWith

So Give Me A Code I Can Make It And I Want In Logout To Clear Pages Or Tabs I Can't Cause Tabs or pages in private or internal I Can't Access Make Me A pageTabs.ClearTabs() Or pageContainer.ClearPages()

code

Screenshot 2023-06-11 150901

Are Self Pattern Has Any Relation With This Cause Self Pattern Is Empty. I Mean Null

wisamidris7 commented 11 months ago

Also Here Bug When Closing Tab The Data Not Be Deleted Or When I Open Again I See Same Data When I Closed

capdiem commented 11 months ago

@wisamidris7

Can You Make Helper Or Vaildation Text Doesn't Take Space In Form

HideDetails accept a bool value and a string value auto. Use HideDetails="@("auto")". You can use DefaultsProvider make auto as default.

What PageTabs Or PageContaniner Is Not Know If 'localhost:5001/example?name=123' is other page

/example and /example?name=123 would be recognized as the same page, because the query parameters are ignored. /example/{name} is recommend to use.

So Give Me A Code I Can Make It And I Want In Logout To Clear Pages Or Tabs I Can't Cause Tabs or pages in private or internal I Can't Access Make Me A pageTabs.ClearTabs() Or pageContainer.ClearPages()

Good point. I will expose a public method ClearAll from PageTabs.

Also Here Bug When Closing Tab The Data Not Be Deleted Or When I Open Again I See Same Data When I Closed

How to repro?

wisamidris7 commented 11 months ago

I Mean By When I Close Page The Page Not Reset When I Open Again

When I Open /example Page I Write 123 In Input And When I Click Close And Open Again 123 Been Writed in TextField

wisamidris7 commented 11 months ago

And Make PageTabs.??? Make Custom Cause Sometimes I Want To Make Button Quit In Page And I Don't Know What To Make In OnCLick

RemoveByPattern RemoveAll

Thanks

capdiem commented 11 months ago

When I Open /example Page I Write 123 In Input And When I Click Close And Open Again 123 Been Writed in TextField

please check to see if the DOM(.m-window-item) was deleted after close was clicked.

Make Custom Cause Sometimes I Want To Make Button Quit In Page And I Don't Know What To Make In OnCLick

Do you mean the ref of PageTabs should provide some public methods, such as ClearAll? Do you try to right click on the tab? @wisamidris7

wisamidris7 commented 11 months ago

Yes Also The Animation In MTabs Are Not Good With RTL

wisamidris7 commented 11 months ago

please check to see if the DOM(.m-window-item) was deleted after close was clicked.

What I Do To Make Page Reset On Close

wisamidris7 commented 11 months ago

Also See Here I Wrote Here The Translations Of Words

wisamidris7 commented 11 months ago

Do you mean the ref of PageTabs should provide some public methods, such as ClearAll?

Also I Want These Methods Cause This So Important For Me

public void RemoveAllTabs() { }
public void RemoveCurruntTab() { } // This You Can Replace It By RemoveByPattern
public void RemoveByPattern(??? route) { }

This Important

capdiem commented 11 months ago

@wisamidris7

Yes Also The Animation In MTabs Are Not Good With RTL

You may be our first RTL user and I need to check that RTL is fully supported.

What I Do To Make Page Reset On Close

The html DOM of page should be deleted after closing tab. Could you check to see if it has been deleted, please? image

Also See Here I Wrote Here The Translations Of Words

You can pull request to us for your language. For example the en-US

capdiem commented 11 months ago

RTL #1369

wisamidris7 commented 11 months ago

In Tooltip Or Menu You Can Make Some Action

public Action OpenMenu { get; set; } // Cause I Want To Use Just On Focus I Just Have Attr

Cause Here I Want Just When I Hover Not In Focus

<MTooltip Bottom>
        <ActivatorContent>
            <MTextField
                   @bind-Value="someValue"
                   @attributes="context.Attrs"
                   Label="Example" />
        </ActivatorContent>
        <ChildContent>
            @* Some Code *@
        </ChildContent>
    </MTooltip>

In Here

@attributes="context.Attrs"

I Can't Said Just In Hover Also I Needed This In Other Places

wisamidris7 commented 11 months ago

I Know There

<MTooltip Bottom OpenOnFocus=false>

But I Needed By Other Causes

wisamidris7 commented 11 months ago

The html DOM of page should be deleted after closing tab. Could you check to see if it has been deleted, please?

I Checked It And I Fix It Thanks

capdiem commented 11 months ago

@wisamidris7 you can use @bind-Value to control the tooltip and menu. https://docs.masastack.com/blazor/components/tooltips#visibility

wisamidris7 commented 11 months ago

Thanks

wisamidris7 commented 11 months ago

Screenshot 2023-06-14 082357

Are There Eager Loading For MTabs Try It With Your Self https://github.com/wisamidris7/MasaTestProject

https://github.com/wisamidris7/MasaTestProject

This Template To Test

wisamidris7 commented 11 months ago

Also Can You Make MHighlter For Text

<MHighlter Text="Example" HighiltedText="ex" NoCaseSentfee/>
wisamidris7 commented 11 months ago

Can You Tell Me How I Can Make Snackbar At Left Using PopupService

wisamidris7 commented 11 months ago

When Closing Popup The Animation Of Dialog Close Not End So The ClosePopupAsync Or ClosePopup Has To

Visible = false;
Task.Delay(100);
???

At Least 100 millisecond to make animation end

This Is In PopupService.OpenAsync

wisamidris7 commented 11 months ago

You Can Make Me Branch Of Masa Like Name 'This Will Make Package Better' And You Can Merge It To Main If You Liked Changes

capdiem commented 11 months ago

Can You Tell Me How I Can Make Snackbar At Left Using PopupService

https://docs.masastack.com/blazor/components/popup-service#snackbar

image

capdiem commented 11 months ago

Also Can You Make MHighlter For Text

Reference a new issue #1373. But this component will not be developed right away, and perhaps it will be developed some day.

capdiem commented 11 months ago

When Closing Popup The Animation Of Dialog Close Not End So The ClosePopupAsync Or ClosePopup Has To

@wisamidris7 Which demo?

capdiem commented 11 months ago

In Any Date 1.0.0-rc4 Will Reaslse

@wisamidris7 1.0.0-rc.4 has been released!

wisamidris7 commented 11 months ago

Drawer In My Computer Is Closed When I Using Computer My Screen Size Down

1366x768

Screen Width: 1366 pixels Screen Height: 768 pixels

When Computer The Drawer Should Not Be Closed All Time The App Looks Like In Mobile

wisamidris7 commented 11 months ago

NavigationDrawer.razor: error CS1503: Argument 2: cannot convert from 'Microsoft.AspNetCore.Components.EventCallback' to 'Microsoft.AspNetCore.Components.EventCallback'

<MNavigationDrawer Value="Visible" ValueChanged="VisibleChanged"
                   Class="@($"navigation {ComputedNavigationClass}")"
                   Width=300
                   MiniVariantWidth=80
                   Floating>

Here Is Parameters

    [Parameter]
    public bool Visible { get; set; } = true;
    [Parameter]
    public EventCallback<bool> VisibleChanged { get; set; }
wisamidris7 commented 11 months ago

Which demo?

I Mean When I Call ClosePopupAsync() From PopupBaseComponent

animation cuts and the dialog closed fast you has to make in ClosePopupAsync()

protected async Task ClosePopupAsync()
{
Visible = false; // This First
await Task.Delay(200); // Or 100 milliseconds
await ?????; // And Here Make Discred Or Like This
}