Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
It can be useful to limit the selector search space for JS commands, without having to give every instance a unique dom ID, meaning components can "self restrict" their internal commands to their own peer nodes.
AlpineJS does this by defining a
x-data
attribute, which defines a context, but this option (defining aphx-js-root
"scope attribute" and always looking up to see if we're inside one) isn't really practical for LV as we don't have the same ability to "break out" of the scope like alpine, so nested components could find themselves "locked in" by unknown parent components.This means we need a two part selector, one do find the scope root -- which is always a parent of the emitting element -- and a second for the targets. It felt more natural to combine this under the
to
option rather than adding an additionalscope
/parent
/inside
option. I went with a tuple{target, scope}
, because a list may imply "apply to all these selectors", and a tuple is less syntax and more defined than a map. Since we can't JSON encode tuples, they are converted to two element lists in theops
field for processing on the javascript side (they may be better described by a map however).The tuple could be extended to support
{target, scope: "scope", opt: x}
, where{string, string}
is an alias for{string, scope: string}
.Additionally, since the "target selector" always looks "inside" the scope element, it's impossible to target the scope element itself, which is useful to set component-wide attributes. In this case
nil
can be used as the target selector to target the scope element (sort of synonymous to the currentto: nil
behaviour).