streamlit-aggrid multiselect : preview values were `undefined(undefined)`

I'm using streamlit-aggrid to display table. In the C column i use multiselect feature, select items and results are ok, but during selecting ,the preview values were undefined(undefined).

I prefer to display the preview value like the result ex:Pink;Purple.

I use followin python code in streamlit framwork.

Select Items are dictionary value. When select from dropdownbox ,i want to display name&code. But when selected,cell values are names with ";" concated.

import streamlit as st
import pandas as pd


from st_aggrid import AgGrid, GridOptionsBuilder, JsCode

df = pd.DataFrame(
    "",
    index=range(10),
    columns=list("c"),
)

gb = GridOptionsBuilder.from_dataframe(df)
gb.configure_default_column(editable=True)


dic= [
    { "name": 'Pink', "code": '#FFC0CB' },
    { "name": 'Purple', "code": '#A020F0' },
    { "name": 'Blue', "code": '#0000FF' },
    { "name": 'Green', "code": '#008000' },
]

st.text(dic)
gb.configure_column(
    "c",
    cellEditor="agRichSelectCellEditor",
        valueFormatter=JsCode(
        """function(params) {  if (Array.isArray(params.value)) {
        let stringjoin="";
        params.value.forEach((el) => {if (el!=null && el !== "") { stringjoin +=";"+ el.name}});
        return stringjoin.slice(1)
  }

    return params.value.name;     }"""
    ),
    valueParser=JsCode("""function(params) { console.log(params);

const { newValue } = params.newValue;

  if (newValue == null || newValue === "") {
    return null;
  }

  if (Array.isArray(newValue)) {
        let stringjoin="";
        newValue.forEach((el) => {stringjoin +=";"+ el.name});
        return stringjoin.slice(1)
  }

  return newValue;


 }"""),
    cellEditorParams={
        "values": dic,
        "multiSelect": "true",
        "suppressMultiSelectPillRenderer": "true",
        "formatValue": JsCode("""function(v) {if (v !== null || v !== "") {
                              return `${v.name} (${v.code})`
                              }
                              } """),
        "parseValue": JsCode("""function(v) {
                             let stringjoin="";
                             console.log(v); 
                             forEach((el) => {stringjoin +=";"+ el.name});
                             return stringjoin.slice(1) }"""),
        "allowTyping": "true",
        "filterList": "true",
        "valueListMaxHeight": 220,
        "searchType": "matchAny",
    },
)



gb.configure_grid_options(enableRangeSelection=True)

go = gb.build()



response = AgGrid(
    df,
    gridOptions=go,
    enable_enterprise_modules=True,
    key="grid1",
    allow_unsafe_jscode=True,
)

import streamlit as st
import pandas as pd


from st_aggrid import AgGrid, GridOptionsBuilder, JsCode

df = pd.DataFrame(
    "",
    index=range(5),
    columns=list("c"),
)
df["c"]=[["Pink (#FFC0CB)","Purple (#A020F0)"], ["Purple (#A020F0)"], ["Blue (#0000FF)"], ["Green (#008000)"], ["Pink (#FFC0CB)"]]
df["c"] = df["c"].astype("object")

gb = GridOptionsBuilder.from_dataframe(df)
gb.configure_default_column(editable=True)


dic= [
    { "name": 'Pink', "code": '#FFC0CB' },
    { "name": 'Purple', "code": '#A020F0' },
    { "name": 'Blue', "code": '#0000FF' },
    { "name": 'Green', "code": '#008000' },
]

st.text(dic)
gb.configure_column(
    "c",
    cellEditor="agRichSelectCellEditor",
    # singleClickEdit= "true",
    valueFormatter=JsCode(
        """function(params) {  
        const { value } = params;
        if (Array.isArray(value)) {
            return value.map(item => item.toString().split("(")[0]).join(";");
        }

        return value;
        }"""
    ),
    valueParser=JsCode("""function(params) { console.log(params);

        const { newValue } = params;

        if (newValue == null || newValue === "") {
            return null;
        }

        if (Array.isArray(newValue)) {
            return newValue;
        }

        return params.newValue.split(";");


        }"""),
    cellEditorParams={
        "values":  list(map(lambda item: item["name"]+" ("+item["code"]+")", dic)),
        "multiSelect": "true",
        "allowTyping": "true",
        "filterList": "true",
        "valueListMaxHeight": 220,
        "searchType": "matchAny",
    },
)

gb.configure_grid_options(enableRangeSelection=True)

go = gb.build()

response = AgGrid(
    df,
    gridOptions=go,
    enable_enterprise_modules=True,
    key="grid1",
    allow_unsafe_jscode=True,
)

initial

when edited:

end edit