eslint-plugin-tailwindcss icon indicating copy to clipboard operation
eslint-plugin-tailwindcss copied to clipboard

[BUG] Invalid classnames-order on daisyui dropdown

Open Aragur opened this issue 1 year ago • 3 comments

Describe the bug A clear and concise description of what the bug is.

To Reproduce Steps to reproduce the behavior:

  1. Install DaisyUI
  2. Create a Navbar including a Dropdown
  3. The classesdropdown-end and dropdown each want to be at the front. A warning is always generated.

Expected behavior A clearly defined order should be followed.

Screenshots Screenshot 2023-08-22 at 18 20 33

Environment (please complete the following information):

  • OS: macOS
  • Softwares + version used:
    • VSCode 1.81.1

Additional context None

eslint config file or live demo

<div class="navbar bg-base-100">
  <div class="flex-1">
    <a class="btn btn-ghost normal-case text-xl">daisyUI</a>
  </div>
  <div class="flex-none gap-2">
    <div class="form-control">
      <input type="text" placeholder="Search" class="input input-bordered w-24 md:w-auto" />
    </div>
    <div class="dropdown dropdown-end">
      <label tabindex="0" class="btn btn-ghost btn-circle avatar">
        <div class="w-10 rounded-full">
          <img src="/images/stock/photo-1534528741775-53994a69daeb.jpg" />
        </div>
      </label>
      <ul tabindex="0" class="mt-3 z-[1] p-2 shadow menu menu-sm dropdown-content bg-base-100 rounded-box w-52">
        <li>
          <a class="justify-between">
            Profile
            <span class="badge">New</span>
          </a>
        </li>
        <li><a>Settings</a></li>
        <li><a>Logout</a></li>
      </ul>
    </div>
  </div>
</div>

Aragur avatar Aug 22 '23 16:08 Aragur

👋 @Aragur not sure what the bug is about. If you reorder class names as the rule suggest, what happens? There is a Quick fix button in the popover on your screenshot.

If I understand correctly, eslint-plugin-tailwindcss relies on TailwindCSS itself to get the order. if DaisyUI comes with a plugin which adds custom class names, it could be an issue in it.

kachkaev avatar Aug 23 '23 09:08 kachkaev

@kachkaev When I click on the Quick fix button the order changes to dropdown-end dropdown, but this is also marked as being wrong → so there's an infinite loop.

Aragur avatar Aug 29 '23 08:08 Aragur

I have same problem with className="swap-rotate swap" from daisyui too. it infinite loop quick fix between "swap-rotate swap" and "swap swap-rotate"

Jaynarol avatar Sep 21 '23 02:09 Jaynarol