Support multiple custom event namespaces

[thisispiers]

Emitting multiple events allows different components to listen to different event namespaces.

There is currently no type checking, sanitization or validation.

[cferdinandi]

@thisispiers can you help me understand the use case here? Currently, components can listen to multiple signals and stores.

let fname = signal('Chris', 'fname');
let greeting = signal('Hello', 'greeting');

function template () {
	return `${greeting}, ${fname}!`;
}

component('#app', template, {
	signals: ['fname', 'greeting'], 
});

What problem does this solve that isn't already addressed by the current API?

[thisispiers]

Sorry if I'm wasting your time. It was just an idea and I thought why not share it.

It could be helpful to reduce renders for nested signals:

const lists = reef.signal([], 'lists');
function newList() {
    const list = reef.signal([], ['list', `list-${lists.length}`]);
    lists.push(list);
}

reef.component('#total_lists', () => {
    return `There are ${lists.length} lists`;
}, {
    signals: ['lists'],
});

reef.component('#total_items', () => {
    const total = Object.keys(lists).reduce((acc, i) => {
        return acc += lists[i].length;
    }, 0);
    return `There are ${total} items in total`;
}, {
    signals: ['list'],
});

reef.component('#third_list', () => {
    if (typeof lists[2] === 'undefined') {
        return `A third list does not exist`;
    }
    return `The third list contains ${lists[2].length} items`;
}, {
    signals: ['list-2'],
});

It could also be helpful to monitor all signal changes when debugging:

document.addEventListener('reef:signal', console.debug);

[cferdinandi]

@thisispiers not a waste of time at all! I'm just trying to understand the use case before making any code changes.

So I see the theoretical application you're going for here. I'm not sure it's the best code design.

Do you have a real-world practical application for doing this?