Cannot access private method

[v1r0x]

I switched from the old emoji-button to picmo and tried to setup a popup picker, but when starting my site all I get is a Cannot access private method error on the addEventListener method. I'm running latest 5.5.2 on vue3

import { createPopup } from '@picmo/popup-picker';

export default {
setup() {
const state = reactive({
    id: `emoji-picker-button`,
    picker: null,
});

onMounted(_ => {
    const trigger = document.getElementById(state.idd);

    state.picker = createPopup({
        hideOnEmojiSelect: false,
        position: 'bottom-end',
    }, {
        triggerElement: trigger,
        referenceElement: trigger,
        position: 'bottom-end',
    });

    emojiButton.addEventListener('click', _ => {
        state.picker.toggle();
    });

    state.picker.addEventListener('emoji:select', event => {
        console.log("selected emoji", event);
    });
});
}
}

[typhoon11]

hideOnEmojiSelect and position are popup options not picker options so it should be in the down one

[v1r0x]

Thanks for that info!

Unfortunately, this makes no difference in the error message

[typhoon11]

I am assuming it's coming from the state object thing, I don't have enough knowledge in vue but I am guessing that it's not able to access state object.

[v1r0x]

Thanks again! This actually fixed the issue :tada: Never had problems with that. Also emoji-button worked fine that way....

[joeattardi]

What was the issue/fix?

[v1r0x]

Using the reactive state was the issue. Replacing state.picker = createPopup(...) with const picker = createPopup(...) fixed it.

[joeattardi]

Interesting. I can't think of anything that changed which would cause this issue, but then again I know nothing about Vue!