Why it close when click by mouse or touch, without triggering onSelect or nevigate?

[linonetwo]

Online demo https://tiddly-gittly.github.io/tw-command-palette/ (press ctrl/cmd+P, or ctrl+shift+p), you can switch to English by pressing the button on top of a note card.

When it is opened, click on any item, and the autocomplete will close, and not triggering anything. But if you move the cursor with the arrow key, and press Enter, it is triggered.

Code is open-sourced at https://github.com/tiddly-gittly/tw-command-palette/blob/4047ed39166651fc691d1d1cf8c20fed82c3b615/src/commandpalette/widgets/widget.ts#L53-L89

Does anyone know what might cause this? I can see the official doc site's autocomplete is clickable.

[linonetwo]

Need to manually add onclick

item({ item, createElement, state }) {
            if (typeof item.name === 'string' && item.name !== '') {
              const name = renderTextWithCache(item.name, widget);
              const description = renderTextWithCache(item.description, widget);
              const icon = getIconSvg(item.icon as string, widget);
              return createElement('div', {
                class: 'tw-commandpalette-layout-result',
                onclick: () => {
                  parameters.navigator.navigate({ item, itemUrl: item.title, state });
                },
                innerHTML: `${icon}${name}${description ? ` - ${description}` : ''}`,
              });
            }
            return createElement('div', {
              onclick: () => {
                parameters.navigator.navigate({ item, itemUrl: item.title, state });
              },
            }, item.title);
          },

[linonetwo]

This is not good enough, I need to trigger onSelect, which might do something else than navigate.

[linonetwo]

tiddly-gittly/tw-command-palette@70f2ed6

write a onSelect arrow function, and call it in both onSelect({ item }) { and onclick: () => {