-
Notifications
You must be signed in to change notification settings - Fork 955
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
Dialog: Add defaultVisible property #6772
Comments
What about: const [myVisibleState, setMyVisibleState] = useState(false);
<Dialog defaultVisible={true} visible={myVisibleState}>
<!-- Dialog content goes here -->
</Dialog> Is it visible or not? If inner state change what happens to my state? thats just weird |
The scenario you described might sound as a potential issue with having both |
So you say I see your point but personally think that this causes more conflicts in logic than it has any benefits over a visible state and onHide handling. |
I appreciate your perspective. The The intent is to offer a straightforward solution for scenarios like announcements or welcome messages, where managing state isn't necessary beyond the initial render. This can be especially beneficial when multiple dialogs are present on a page, reducing the need for separate state management for each dialog. |
What about a new sub-component to avoid those confusing defaultVisible/visible things? We could let it inhert from Dialog and eleminate properties that aren't required to keep complexity low for users. |
I am all for keeping complexity low and having both |
@melloware What about the idea of a new Component? I could imagine something like You see such things often on Shops. "it's our 10th Birthday - 10% on all items in Stock" or something. |
I guess what I am struggling with is I have seen components you are talking about before in Primefaces JSF its called a Notification Bar. https://www.primefaces.org/showcase/ui/panel/notificationBar.xhtml?jfwid=7b423 |
That component looks like something that could do what OP want. However I was more the direction of something like the following. You see this purple-like banner with the timer on it on top of the page? That what I can think of. |
I understand the concern about complexity. However, users are unlikely to pass both |
Yep that PrimeFaces JSF component is exactly like your screenshot about how we use it at one of my clients. It can be styled any way you want. I have seen other component libraries sometimes call it a |
Good to know - was unsure about the name of it. |
It does not Primefaces JSF has been around since 2009 so it has a lot of components the other libs don't but also because PrimeTek chose to whittle the list down in the JS libs to only critical components they want to support. |
Use Case
Imagine a scenario where a dialog needs to be immediately visible upon page load, such as for displaying an important announcement or a welcoming message. Here, the parent component doesn't require ongoing control over the visibility state post-initial render.
The
defaultVisible
prop is a boolean that, when set totrue
, ensures that the Dialog is displayed immediately upon mounting. Conversely, setting this prop tofalse
or omitting it entirely will maintain the default behavior, where the Dialog is hidden initially and requires a trigger to become visible.Changes
defaultVisible
prop to the Dialog component's API.defaultVisible
prop.defaultVisible
prop tofalse
.Usage
The text was updated successfully, but these errors were encountered: