более того, там вроде ошибка какая-то всплывала в консоли, сейчас не помню точно

эм, не понял 🤔

привет, так примеров же много, глянь на гитхабе

так смысл же в этом, только надо не в самой иконке это сделать, а в айтеме

ну так я и говорю, ты в айтеме это никак не поймаешь

иконку то мы вообще не трогаем

<Icon on:click={не сработает}>

Все они не совсем то:) https://sharlime.ru/sharxxxi/
Примерно вот так нужно:)

а, ты предлагаешь сам компонент завернуть...

сорри, не понял сразу

ну да

ну я это чуток радикальнее решил

Нужно как то получить координаты внутри блока в который бросаешь

import {bubble, listen} from 'svelte/internal';

export function getEventsAction(component, self) {
  return node => {
    const events = Object.keys(component.$$.callbacks);
    const listeners = [];

    events.forEach(
      event => listeners.push(
        listen(node, event, e =>  {if (self) {e.stopPropagation();} return bubble(component, e);})
      )
    );

    return {
      destroy: () => {
        listeners.forEach(
          listener => listener()
        );
      }
    }
  };
}

при вызове true вторым аргументом передаёшь и всё. На нужном элементе события без бабблинга работают. Но да, это не лучшее решение. Просто надо было быстро.

ООО, это мне напомнило подобную ситуацию с объявлением переменных в функциях на python и с областями видимости

так у тебя ж mouseup триггерится на элементе, в который бросаешь

import {bubble, listen} from 'svelte/internal';

export function getEventsAction(component, self) {
  return node => {
    const events = Object.keys(component.$$.callbacks);
    const listeners = [];

    events.forEach(
      event => listeners.push(
        listen(node, event, e =>  {if (self) {e.stopPropagation();} return bubble(component, e);})
      )
    );

    return {
      destroy: () => {
        listeners.forEach(
          listener => listener()
        );
      }
    }
  };
}

а ты хаки юзаешь) ну ладно, работает и хорошо)

ну это мэйнстримный хак )

)))