john_helt
john_helt3mo ago

Disabling UI at runtime

I'm looking for a way to disable a certain UI component at runtime. In particular, I want to create a modal to confirm a choice. Until the choice is confirmed (True/False), I want the rest of the UI to remain disabled in this time. I've created a UI wrapper that uses mo.stop, and states to generate a choice like the one showed on the image, and hide the rest of the rest of the wrapped UI component, until the choice is accepted or declined, but this is rather limiting as I need to pass the UI components that I want to hide. Really what I want is to disable the UI components (grey them out), while still showing them, but I can't figure out if that's possible.
No description
4 Replies
Myles Scolnick
Myles Scolnick3mo ago
Which ui components specifically? Most should have a disabled argument on them
john_helt
john_heltOP3mo ago
It could be a stack of components assembled with vstack or hstack. I'm working alot with composite components stacked using vstack or batch
Myles Scolnick
Myles Scolnick3mo ago
got it - i wonder if we could leverage "<fieldset disabled>". this usually disabled everything inside, but i bet our css styles don't quite adhere perfectly you could like create your own still
def disabled(obj, disabled: bool = True):
if not disabled:
return obj
return mo.Html(f"<fieldset disabled="true" style="opacity: 60">{mo.as_html(obj)}</fieldset>")
def disabled(obj, disabled: bool = True):
if not disabled:
return obj
return mo.Html(f"<fieldset disabled="true" style="opacity: 60">{mo.as_html(obj)}</fieldset>")
john_helt
john_heltOP3mo ago
great! I'll try this out! Unfortunately, I couldn't get that to work. Maybe it would be an idea to add "disabled" as a keyword to any type of HTML (or a callout style)?