Alpine.js x-data scope isolation limits

Alpine.js utilizes the x-data directive to create reactive scopes, ensuring that state is isolated to a specific DOM element and its descendants. This mechanism prevents state leakage between sibling components.

When implementing deeply nested components, Alpine.js allows child scopes to inherit data from parent scopes. However, this inheritance chain creates a potential for naming collisions or accidental mutations if a child component defines a property with the same name as a parent property.

Given the way Alpine.js resolves variable lookups through the scope chain, there is uncertainty regarding the strictness of this isolation when managing complex state hierarchies.

• Does Alpine.js provide a mechanism to explicitly prevent a child x-data scope from accessing or mutating inherited parent state?
• What is the behavior when a child scope attempts to modify a property that exists in both the local and parent scopes?