feat: move to unimport-icons

@lucide icons works very slow in barrel import, so i move to
unimport and use lucide icons

src/components/image/ImageManager.svelte

@@ -4,7 +4,13 @@
   import SettingsRow from "$components/layout/SettingsRow.svelte";
   import Button from "$components/ui/Button.svelte";
   import RangeSlider from "$components/ui/RangeSlider.svelte";
-  import { Pencil, RotateCcw as Reset, Upload } from "@lucide/svelte";
+  // import { Pencil, RotateCcw as Reset, Upload } from "@lucide/svelte";
+  // import Pencil from "@lucide/svelte/icons/pencil";
+  // import Reset from "@lucide/svelte/icons/rotate-ccw";
+  // import Upload from "@lucide/svelte/icons/upload";
+  import Pencil from "~icons/lucide/pencil";
+  import Reset from "~icons/lucide/rotate-ccw";
+  import Upload from "~icons/lucide/upload";
   import CropInline from "./CropInline.svelte";
 
   let brightness = $state(100);

src/components/layout/AppHeader.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import { themeState } from "$states/theme.svelte";
-  import { Moon, Sun } from "@lucide/svelte";
+  import Moon from "~icons/lucide/moon";
+  import Sun from "~icons/lucide/sun";
 
   function toggleTheme() {
     themeState.toggle();

src/components/panel/PreviewControls.svelte

@@ -2,7 +2,8 @@
   import Button from "$components/ui/Button.svelte";
   import type { SlideDirectionType } from "$lib/constants";
   import { PANEL_SETTINGS } from "$lib/constants";
-  import { ChevronLeft, ChevronRight } from "@lucide/svelte";
+  import ChevronLeft from "~icons/lucide/chevron-left";
+  import ChevronRight from "~icons/lucide/chevron-right";
 
   interface Props {
     current: number;

src/components/panel/PreviewManager.svelte

@@ -7,8 +7,9 @@
   import { konvaAllStagesState } from "$states/konvaAllStages.svelte";
   import { konvaStageState } from "$states/konvaStage.svelte";
   import { textsState } from "$states/texts.svelte";
-  import { Download, StickyNote } from "@lucide/svelte";
   import { fly } from "svelte/transition";
+  import Download from "~icons/lucide/download";
+  import StickyNote from "~icons/lucide/sticky-note";
   import Preview from "./Preview.svelte";
   import PreviewAll from "./PreviewAll.svelte";
   import PreviewControls from "./PreviewControls.svelte";

src/components/text/TextInlineEdit.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import Button from "$components/ui/Button.svelte";
-  import { X as Cross } from "@lucide/svelte";
   import { fly } from "svelte/transition";
+  import Cross from "~icons/lucide/x";
 
   interface Props {
     text: string;

src/components/text/TextManager.svelte

@@ -3,7 +3,7 @@
   import InputGroup from "$components/layout/InputGroup.svelte";
   import Button from "$components/ui/Button.svelte";
   import { textsState } from "$states/texts.svelte";
-  import { Plus } from "@lucide/svelte";
+  import Plus from "~icons/lucide/plus";
   import TextInlineEdit from "./TextInlineEdit.svelte";
   import TextInput from "./TextInput.svelte";
 

src/components/ui/Alignment.svelte

@@ -1,6 +1,9 @@
 <script lang="ts">
   import type { TextAlignType } from "$lib/constants";
-  import { TextAlignCenter, TextAlignEnd, TextAlignStart } from "@lucide/svelte";
+  import TextAlignCenter from "~icons/lucide/text-align-center";
+  import TextAlignEnd from "~icons/lucide/text-align-end";
+  import TextAlignStart from "~icons/lucide/text-align-start";
+  // import { TextAlignCenter, TextAlignEnd, TextAlignStart } from "@lucide/svelte";
 
   interface Props {
     align: TextAlignType;
@@ -31,30 +34,24 @@
     display: flex;
     align-items: center;
     justify-content: center;
+    color: var(--text-secondary);
   }
 
   .align-btn :global(svg) {
     width: 16px;
     height: 16px;
-    stroke: var(--text-secondary);
     transition: var(--transition);
   }
 
   .align-btn:hover {
     background: var(--bg-hover);
     border-color: var(--accent-primary);
-  }
-
-  .align-btn:hover :global(svg) {
-    stroke: var(--accent-primary);
+    color: var(--accent-primary);
   }
 
   .align-btn.active {
     background: var(--accent-primary);
     border-color: var(--accent-primary);
-  }
-
-  .align-btn.active :global(svg) {
-    stroke: white;
+    color: white;
   }
 </style>