Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow for setting of the attributes directly instead of using props keyword in the component #17

Closed
woutdp opened this issue Mar 24, 2023 · 5 comments
Labels
enhancement New feature or request help wanted Extra attention is needed

Comments

@woutdp
Copy link
Owner

woutdp commented Mar 24, 2023

Current:

<LiveSvelte.render name="SomeComponent" props={%{number: @number}} />

New:

<LiveSvelte.render name="SomeComponent" number={@number} />

We can probably use @rest for this. We should still allow props as that can be a way to add keywords that are taken such as the class and name keyword (or even the props keyword, which is very meta)

@woutdp woutdp added the enhancement New feature or request label Mar 24, 2023
@woutdp woutdp changed the title Allow for setting of the props directly instead of using props Allow for setting of the props directly instead of using props keyword in the component Mar 24, 2023
@woutdp
Copy link
Owner Author

woutdp commented Mar 26, 2023

Tried it out and it's working but it gives a warning when providing an attribute that is not specifically defined.

code: https://github.com/woutdp/live_svelte/tree/nicer-prop-passing

image

If we can make the warning disappear somehow we can add it.

@woutdp woutdp changed the title Allow for setting of the props directly instead of using props keyword in the component Allow for setting of the attributes directly instead of using props keyword in the component Mar 26, 2023
@woutdp woutdp added the help wanted Extra attention is needed label Mar 26, 2023
@terrisgit
Copy link

terrisgit commented Apr 22, 2023

This is exactly what I've been asking you regarding props. Just saw this. This will be very useful enhancement.

@woutdp
Copy link
Owner Author

woutdp commented Apr 22, 2023

I think this issue is useful, but also wanted to mention a third way of defining props.

What if you could do something like this in the mount:

{:ok, assign(socket, :svelte, %{number: 1})}

And then the prop number would be automatically picked up since we know that's what we want to pass

<LiveSvelte.render name="Example"/>

Actually we can probably even get away with the following:

{:ok, assign(socket, :number, 1)}

And make sure it's automatically picked up, but then we'd have to deprecate the previous way I think.

One thing is that let's say you have 2 Svelte components in one LiveView, you might only want to pass certain things to one of them and certain things to the other, don't know if it's really an issue though

Something to think about

@terrisgit
Copy link

That is better. I think the sigil will become the preferred method so whatever works with that will be my go to.

@woutdp
Copy link
Owner Author

woutdp commented May 28, 2023

Will be closed by: #50

@woutdp woutdp closed this as completed Jun 3, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request help wanted Extra attention is needed
Projects
None yet
Development

No branches or pull requests

2 participants