Disabling UI at runtime

jjohn_helt

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.

Attachment

7 comments

MMyles Scolnick

Which ui components specifically? Most should have a disabled argument on them

jjohn_helt

It could be a stack of components assembled with vstack or hstack.

jjohn_helt

I'm working alot with composite components stacked using vstack or batch

MMyles Scolnick

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

MMyles Scolnick

you could like create your own still

Plain Text

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>")

jjohn_helt

great! I'll try this out!

jjohn_helt

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)?

Add a reply

Get help from the marimo community

Disabling UI at runtime