feat: add missing storybook files and type template arguments properly

src/shared/ui/Input/Input.stories.svelte

@@ -61,42 +61,43 @@ const { Story } = defineMeta({
 <script lang="ts">
 import SearchIcon from '@lucide/svelte/icons/search';
 import ClearIcon from '@lucide/svelte/icons/x';
+import type { ComponentProps } from 'svelte';
 let value = $state('');
 const placeholder = 'Enter text';
 </script>
 
 <!-- Default Story (Left Aligned) -->
 <Story name="Default" args={{ placeholder, value }}>
-    {#snippet template(args)}
+    {#snippet template(args: ComponentProps<typeof Input>)}
         <Input {...args} />
     {/snippet}
 </Story>
 
 <Story name="All sizes" args={{ value }}>
-    {#snippet template(args)}
+    {#snippet template(args: ComponentProps<typeof Input>)}
         <div class="flex flex-col gap-4">
-            <Input size="sm" placeholder="Size sm" {...args} />
-            <Input size="md" placeholder="Size md" {...args} />
-            <Input size="lg" placeholder="Size lg" {...args} />
-            <Input size="xl" placeholder="Size xl" {...args} />
+            <Input {...args} size="sm" placeholder="Size sm" />
+            <Input {...args} size="md" placeholder="Size md" />
+            <Input {...args} size="lg" placeholder="Size lg" />
+            <Input {...args} size="xl" placeholder="Size xl" />
         </div>
     {/snippet}
 </Story>
 
-<Story name="Underlined" args={{ placeholder, value }}>
-    {#snippet template(args)}
-        <Input variant="underline" {...args} />
+<Story name="Underlined" args={{ placeholder, value, variant: 'underline' }}>
+    {#snippet template(args: ComponentProps<typeof Input>)}
+        <Input {...args} />
     {/snippet}
 </Story>
 
-<Story name="Filled" args={{ placeholder, value }}>
-    {#snippet template(args)}
-        <Input variant="filled" {...args} />
+<Story name="Filled" args={{ placeholder, value, variant: 'filled' }}>
+    {#snippet template(args: ComponentProps<typeof Input>)}
+        <Input {...args} />
     {/snippet}
 </Story>
 
 <Story name="With icon on the right" args={{ placeholder, value }}>
-    {#snippet template(args)}
+    {#snippet template(args: ComponentProps<typeof Input>)}
         <Input {...args}>
             {#snippet rightIcon()}
                 <SearchIcon />
@@ -106,7 +107,7 @@ const placeholder = 'Enter text';
 </Story>
 
 <Story name="With icon on the left" args={{ placeholder, value }}>
-    {#snippet template(args)}
+    {#snippet template(args: ComponentProps<typeof Input>)}
         <Input {...args}>
             {#snippet leftIcon()}
                 <SearchIcon />
@@ -115,9 +116,9 @@ const placeholder = 'Enter text';
     {/snippet}
 </Story>
 
-<Story name="With clear button" args={{ placeholder, value }}>
-    {#snippet template(args)}
-        <Input showClearButton {...args}>
+<Story name="With clear button" args={{ placeholder, value, showClearButton: true }}>
+    {#snippet template(args: ComponentProps<typeof Input>)}
+        <Input {...args}>
             {#snippet rightIcon()}
                 <ClearIcon />
             {/snippet}