Using double curly brackets {{$example}} echo syntax in x-data attribute creates strange IDE warnings (phpstorm)

[samcoupland]

Issue:
When using the double curly brackets in x-data attributes, I often get IDE warnings.

Scenario
x-data="{clicked{{ $model->getKey() }}: false}"
or

IDE warning - comer expected

IDE warning - curly bracket expected

I am using the brackets to build unique x-data based on table element's model counterpart. I assume quite a common pattern.
Not sure why it's flagging these issues.

[anburocky3]

+1 do we have any solution for this.?

Can't use this.

<ul x-data="{ colors: ['Red', 'Orange', 'Yellow'] }">
                <template x-for="(value, index) in colors" :key="index">
                    <li x-text="color"></li>
                </template>
</ul>

[developeration1]

This still happens today, it seems that from the double curly braces forward, anything after that creates warnings and doesn't get recognized by the IDE. Everything works as expected when running, but it brakes the whole purpose of the plugin.

[lucastenboom]

Yes, I experienced a similar issue with the following snippet:

        x-init="setTimeout(() => {
            $dispatch('show-modal', { name: '{{ Modal::MODAL_NAME }}' });
            $wire.setCookie();
        }, 3000)"

PhpStorm reports a 'Missing }' warning after 3000)", which is incorrect. The snippet is perfectly valid and works as expected at runtime. However, the IDE still flags it as an error