[Formatting Bug]: operator incorrectly formatted

[thoriqalhakim01]

Version

1.15.3

Template before formatting

<flux:navlist variant="outline">
    <flux:navlist.group heading="Platform" class="grid">
        <flux:navlist.item icon="home" :href="route('user.dashboard')"
            :current="request()->routeIs('user.dashboard')" wire:navigate>
            User Dashboard
        </flux:navlist.item>
    </flux:navlist.group>
</flux:navlist>

Template after formatting

<flux:navlist variant="outline">
    <flux:navlist.group heading="Platform" class="grid">
        <flux:navlist.item icon="home" :href="route('user.dashboard')"
            :current="request() - > routeIs('user.dashboard')" wire:navigate>
            User Dashboard
        </flux:navlist.item>
    </flux:navlist.group>
</flux:navlist>

Expected Behaviour

<flux:navlist variant="outline">
<flux:navlist.group heading="Platform" class="grid">
<flux:navlist.item icon="home" :href="route('user.dashboard')"
:current="request()->routeIs('user.dashboard')" wire:navigate>
User Dashboard
</flux:navlist.item>
</flux:navlist.group>
</flux:navlist>

Relevant log output

[axkuechler]

I love this tool, but at the moment, it’s unusable with Flux. There seems to be a general issue when tags with a colon in their names are used.

Does anyone have a solution for this?

[jeppeolesen]

@axkuechler I've been searching for one, but all I've been able to come up with so far is to either disable prettier entirely or use {{-- prettier-ignore --}} on the lines causing trouble.

[cbaconnier]

I fixed it be adding flux: to componentPrefix in my .prettierrc.json file

{
  "plugins": ["@shufo/prettier-plugin-blade"],
  "overrides": [
    {
      "files": ["*.blade.php"],
      "options": {
        "parser": "blade",
        "tabWidth": 4,
        "componentPrefix": "x-,livewire:,flux:"
      }
    }
  ]
}

Relevant option: (Feature has been implemented late 2024, you may need to update your dependencies if you're out of date)

prettier-plugin-blade/src/options.ts

Lines 135 to 142 in 559f3b9

	componentPrefix: {
	type: "string",
	category: "Blade",
	default: "x-,livewire:",
	description:
	"Comma separated list of component prefix use to preserve style in html attributes.",
	since: "1.15.0",
	},

[jeppeolesen]

Thank you very much @cbaconnier - Can confirm this is the solution if you're on an up to date version of the package.

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days