Hello

Greetings ,

I am facing a simple animation toggle issue with rotation issue with icon sun and moon from Lucide React,

Issue is that, it is instant but not animated with duration. When i took certain code from original to simple one to test if it works and it is working.

"use client";
import { useState } from "react";
import { Moon, Sun } from "lucide-react";

export default function ButtonRotationTest() {
  const [isDark, setIsDark] = useState(false);
  
  return (
    <div className="p-8">
      <button 
        onClick={() => setIsDark(!isDark)}
        className="mb-8 px-4 py-2 bg-blue-500 text-white rounded"
      >
        Toggle Dark Mode
      </button>

      <div className={`relative p-4 rounded-lg ${isDark ? 'dark' : ''}`}>
        <button 
          className="inline-flex items-center justify-center w-10 h-10 rounded-md hover:bg-gray-100 dark:hover:bg-gray-800"
          title={isDark ? "Switch to light mode" : "Switch to dark mode"}
        >
          <Sun className="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0 duration-1000" />
          <Moon className="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100 duration-1000" />
        </button>
      </div>
      
      <p className="mt-4">{isDark.toString()}</p>
    </div>
  );
}