Documenting x-model.parent + Proposal to make it default for x-modelable

[nicolagianelli]

Hello,
I am currently building a custom UI library based on Laravel Blade components and ran into a common scoping issue, which led me to an exciting discovery about an undocumented modifier.

When creating reusable Blade components, I wanted x-model to always scope to the parent element when used on components that also have x-modelable and their own internal x-data state.
Without this scoping, x-model tends to conflict with the internal x-data property where x-modelable resides, rather than syncing with the parent as intended.

While experimenting with workarounds, I found out there is actually a .parent modifier for the x-model directive! However, it doesn't seem to be documented anywhere. This is incredibly useful for people building UI libraries who need to prevent x-model from conflicting with the internal component state.

In reality, I think the .parent modifier should probably be applied by default whenever x-modelable is present on the same element to avoid property name conflicts between parent and child.

I can make a PR for the documentation to cover x-model.parent, but I am also more than happy to open a PR for the core codebase to apply the .parent modifier automatically when the x-modelable attribute is present.

Example Scenario:

<div x-data="{ open: true }">

    <div 
        x-data="{ open: false }" 
        x-modelable="open" 
        x-model="open" >
        
    </div>
</div>

For now, I have resolved this by configuring the Blade compiler to automatically append the .parent modifier to x-model directives whenever they are compiled. (This was the only solution I found because Alpine.bind() loses modifiers and values...).

Let me know what you think about this behavior and if I should go ahead with one or both of the PRs, @calebporzio