fix: move Item component from feature to Widget for FontMenu may be used in different places of the app

src/features/SetupFont/ui/SetupFontMenu.svelte

@@ -12,48 +12,44 @@ const fontWeight = $derived($fontWeightStore);
 const lineHeight = $derived($lineHeightStore);
 </script>
 
-<div class="w-full p-2">
-    <Item.Root variant="outline" class="w-full p-2.5">
-        <Item.Content class="flex flex-row items-center">
-            <Sidebar.Trigger />
-            <Separator orientation="vertical" class="h-full" />
-            <ComboControl
-                value={fontSize.value}
-                minValue={fontSize.min}
-                maxValue={fontSize.max}
-                onChange={fontSizeStore.setValue}
-                onIncrease={fontSizeStore.increase}
-                onDecrease={fontSizeStore.decrease}
-                increaseDisabled={fontSizeStore.isAtMax()}
-                decreaseDisabled={fontSizeStore.isAtMin()}
-                increaseLabel="Increase Font Size"
-                decreaseLabel="Decrease Font Size"
-            />
-            <ComboControl
-                value={fontWeight.value}
-                minValue={fontWeight.min}
-                maxValue={fontWeight.max}
-                onChange={fontWeightStore.setValue}
-                onIncrease={fontWeightStore.increase}
-                onDecrease={fontWeightStore.decrease}
-                increaseDisabled={fontWeightStore.isAtMax()}
-                decreaseDisabled={fontWeightStore.isAtMin()}
-                increaseLabel="Increase Font Weight"
-                decreaseLabel="Decrease Font Weight"
-            />
-            <ComboControl
-                value={lineHeight.value}
-                minValue={lineHeight.min}
-                maxValue={lineHeight.max}
-                step={lineHeight.step}
-                onChange={lineHeightStore.setValue}
-                onIncrease={lineHeightStore.increase}
-                onDecrease={lineHeightStore.decrease}
-                increaseDisabled={lineHeightStore.isAtMax()}
-                decreaseDisabled={lineHeightStore.isAtMin()}
-                increaseLabel="Increase Line Height"
-                decreaseLabel="Decrease Line Height"
-            />
-        </Item.Content>
-    </Item.Root>
+<div class="w-full p-2 flex flex-row items-center">
+    <Sidebar.Trigger />
+    <Separator orientation="vertical" class="h-full" />
+    <ComboControl
+        value={fontSize.value}
+        minValue={fontSize.min}
+        maxValue={fontSize.max}
+        onChange={fontSizeStore.setValue}
+        onIncrease={fontSizeStore.increase}
+        onDecrease={fontSizeStore.decrease}
+        increaseDisabled={fontSizeStore.isAtMax()}
+        decreaseDisabled={fontSizeStore.isAtMin()}
+        increaseLabel="Increase Font Size"
+        decreaseLabel="Decrease Font Size"
+    />
+    <ComboControl
+        value={fontWeight.value}
+        minValue={fontWeight.min}
+        maxValue={fontWeight.max}
+        onChange={fontWeightStore.setValue}
+        onIncrease={fontWeightStore.increase}
+        onDecrease={fontWeightStore.decrease}
+        increaseDisabled={fontWeightStore.isAtMax()}
+        decreaseDisabled={fontWeightStore.isAtMin()}
+        increaseLabel="Increase Font Weight"
+        decreaseLabel="Decrease Font Weight"
+    />
+    <ComboControl
+        value={lineHeight.value}
+        minValue={lineHeight.min}
+        maxValue={lineHeight.max}
+        step={lineHeight.step}
+        onChange={lineHeightStore.setValue}
+        onIncrease={lineHeightStore.increase}
+        onDecrease={lineHeightStore.decrease}
+        increaseDisabled={lineHeightStore.isAtMax()}
+        decreaseDisabled={lineHeightStore.isAtMin()}
+        increaseLabel="Increase Line Height"
+        decreaseLabel="Decrease Line Height"
+    />
 </div>

src/widgets/TypographySettings/ui/TypographyMenu.svelte

@@ -1,10 +1,12 @@
 <script lang="ts">
 import SetupFontMenu from '$features/SetupFont/ui/SetupFontMenu.svelte';
 import * as Item from '$shared/shadcn/ui/item';
-import { Separator } from '$shared/shadcn/ui/separator/index';
-import * as Sidebar from '$shared/shadcn/ui/sidebar/index';
 </script>
 
 <div class="w-full p-2">
-    <SetupFontMenu />
+    <Item.Root variant="outline" class="w-full p-2.5">
+        <Item.Content>
+            <SetupFontMenu />
+        </Item.Content>
+    </Item.Root>
 </div>