To pass a property to a Laravel blade component we can use one colon prefix :. For example, given the following component:

<x-button :label="$name" />

On this button component, the label property receives the value from the name variable. But should we add some shorthand conditionals alpine property like :class="{ danger: isDeleting }"?

How to inform Blade that the Alpine property is not a PHP expression?

You can pass Alpine JS data to Blade components using ::. The double colon prefix informs Blade scaping the attribute rendering. See the example below:

<x-button :label="$name" ::class="{ danger: isDeleting }" />

The following HTML will be rendered by Blade:

<button :class="{ danger: isDeleting }">
    Delete
</button>