Thanks for filing an issue for this @whitphx, we'll do some investigation to try to gauge how difficult it would be to implement this.

Hello @whitphx,

I managed to get callbacks working on custom components with some hacks. Let me know if that works with you: https://gist.github.com/okld/1a2b2fd2cb9f85fc8c4e92e26c6597d5

@okld
It seems to work as expected. Thank you so much.
I actually tried to use it in my library: whitphx/streamlit-webrtc#695. I will test it more though, it seems to be working.
BTW, is it OK to use the code in my MIT-licensed library? (I think it's helpful if some LICENSE file is provided in the gist repo :) ) (It seems OK; https://github.community/t/what-license-do-gists-have/144479)

For the core developers:

Through this development, I found okld's implementation was sufficient for my needs
although I have written as below.

It must not be an "automatic" trigger reacting to the changes of the frontend component state or session_state,

Now I think the design of my library streamlit-webrtc is not following the original design principle of Streamlit custom component, as my library does not directly publish the component value from the frontend but provides its wrapper object to the developers instead.
So, the gap derived from that design should be handled on my side, and it was possible.

Then, please ignore that part of my feature request.
okld's implementation is sufficient.

Hey @whitphx, it has been some time since this was opened, but we have recently revisited this part and created a draft PR here: #8633
I wanted to ask you if you had a moment to sanity-check the approach and see whether the change would allow your scenario and get rid of the workaround script 🙂

Hey @whitphx, it has been some time since this was opened, but we have recently revisited this part and created a draft PR here: #8633 I wanted to ask you if you had a moment to sanity-check the approach and see whether the change would allow your scenario and get rid of the workaround script 🙂

I have a query regarding the removal of args and kwargs. In my scenario, I create one function and mount 7 versions of a single custom component. Then I create one on_change function and include in the args a string of the session_state of the particular component in question. If that component is interacted with, then the on_change function is triggered only for the version component that is interacted with.

An example:

if "final_result_of_all_7" not in st.session_state:
     st.session_state["final_result_of_all_7"] = {
           "one_":[].
           "two_":[],
           "three_":[],
            "four_":[].
           "five_":[]
           "six_":[],
           "seven_":[]
}
     

def onChangeFunction(argument=None):
     
      change_this = st.session_state[argument]
       st.session_state["final_result_of_all_7"][argument] = change_this


key_for_component = "one_"
custom_component(value=list_of_dicts, on_change=onChangeFunction, args=(key_for_component,), key=key_for_component)
key_for_component = "two_"
custom_component(value=list_of_dicts, on_change=onChangeFunction, args=(key_for_component,), key=key_for_component)
key_for_component = "three_"
custom_component(value=list_of_dicts, on_change=onChangeFunction, args=(key_for_component,), key=key_for_component)
key_for_component = "four_"
custom_component(value=list_of_dicts, on_change=onChangeFunction, args=(key_for_component,), key=key_for_component)
key_for_component = "five_"
custom_component(value=list_of_dicts, on_change=onChangeFunction, args=(key_for_component,), key=key_for_component)
key_for_component = "six_"
custom_component(value=list_of_dicts, on_change=onChangeFunction, args=(key_for_component,), key=key_for_component)
key_for_component = "seven_"
custom_component(value=list_of_dicts, on_change=onChangeFunction, args=(key_for_component,), key=key_for_component)

I tried implementing this using the current changes you have suggested and it says this:

'st.session_state has no key "one_". Did you forget to initialize it? More info: https://docs.streamlit.io/library/advanced-features/session-state#initialization'

It seems the on_change is triggering before the component mounts.

Taking out the args and kwargs would mean I would have to create 7 different versions of the on_change function and hard code their session_state keys and then pass it to the on_change_handler.

@Socvest I believe the way how this should work would be like the following:

from functools import partial

keys = ["one_", "two_", ...]
for key in keys:
  custom_component(value=list_of_dicts, on_change=partial(onChangeFunction, key), key=key)

Does this work for you?

@raethlein it kind of does but it triggers as though I have clicked on all components at once instead of just one at a time. The aim was to change the session_state based on the click of one of the components kind of like a filter component (dynamic filter). I did end up refactoring my function where it loops through all and manually searches for which component changed before making changes to the st.session_state["final_result_of_all_7"] when one of the components is interacted with.

@Socvest This sounds like its not related to the new API addition and whether we pass through args or not, am I getting this right? I am trying to understand whether we would need to change the API signature in order to support all intended use-cases 🙂

@raethlein Yeah, don't worry. It was a coding issue on my end. I pretty much had to add an if else statement to capture the component with a specific key that was interacted with. All is good. Thanks!

@Socvest I see, thanks for spending time on testing it and the feedback!