devongovett / svelte-hooks

50 stars 3 forks source link

The name "attrs" isn't accurate for event handlers #10

Open TylerRick opened 3 years ago

TylerRick commented 3 years ago

Can we come up with a better name for the attrs action. "Attributes" only correctly describes what it does for the "rest"/"other" (non-event) properties that are passed to this action; the "main" purpose (I think) is for it to extract and attach event handlers.

Name ideas...


Another idea would be to export a helper function (filterEventProps? extractEventProps?) that does the work of separating out events from non-events, and then you could pass those separate arrays to actions that are more aptly named and have only a single, clear responsibility. You could use it like this:

const incomingMixedProps = {{'on:click': handleClick, style}}`
const [events, attrs] = filterEventProps(incomingMixedProps)
<button use:attachEvents={events} use:attrs={attrs}>…</button>

Actually, we might not even need a use:attrs... couldn't we just spread the rest props?

const [events, restProps] = filterEventProps(incomingMixedProps)
<button use:attachEvents={events} {...restProps}>…</button>

(If you didn't need one or the other, you could omit it from the destructuring assignment:

const [events, ] = filterEventProps(incomingMixedProps)
<button use:attachEvents={events}>…</button>

)

That's the approach I'm leaning towards currently, as it keeps things clear and avoids the action having multiple/mixed responsibilities. (Of course, you could always make/have that all-in-one action too: it could just be a wrapper for the extract and 2 use: calls like above, but having them separate gives people the option to use either...)

What do you think?