feat(StatusIndicator): Label wrapper for status display

src/shared/ui/StatusIndicator/StatusIndicator.stories.svelte

@@ -0,0 +1,80 @@
+<script module>
+import { defineMeta } from '@storybook/addon-svelte-csf';
+import StatusIndicator from './StatusIndicator.svelte';
+
+const { Story } = defineMeta({
+    title: 'Shared/StatusIndicator',
+    component: StatusIndicator,
+    tags: ['autodocs'],
+    parameters: {
+        docs: {
+            description: {
+                component: 'Coloured dot with optional label. Dot can pulse for live states.',
+            },
+            story: { inline: false },
+        },
+        layout: 'centered',
+    },
+    argTypes: {
+        status: {
+            control: 'select',
+            options: ['active', 'inactive', 'warning', 'error'],
+            description: 'Status type',
+        },
+        label: {
+            control: 'text',
+            description: 'Optional label text',
+        },
+        pulse: {
+            control: 'boolean',
+            description: 'Enable pulsing animation',
+            defaultValue: false,
+        },
+    },
+});
+</script>
+
+<Story
+    name="Active status"
+    args={{ status: 'active', label: 'Active' }}
+>
+    {#snippet template()}
+        <StatusIndicator status="active" label="Active" />
+    {/snippet}
+</Story>
+
+<Story
+    name="Inactive status"
+    args={{ status: 'inactive', label: 'Inactive' }}
+>
+    {#snippet template()}
+        <StatusIndicator status="inactive" label="Inactive" />
+    {/snippet}
+</Story>
+
+<Story
+    name="Warning status"
+    args={{ status: 'warning', label: 'Warning' }}
+>
+    {#snippet template()}
+        <StatusIndicator status="warning" label="Warning" />
+    {/snippet}
+</Story>
+
+<Story
+    name="Error status"
+    args={{ status: 'error', label: 'Error' }}
+>
+    {#snippet template()}
+        <StatusIndicator status="error" label="Error" />
+    {/snippet}
+</Story>
+
+<Story
+    name="With pulse"
+    args={{ status: 'active', label: 'Connected', pulse: true }}
+>
+    {#snippet template()}
+        <StatusIndicator status="active" label="Connected" pulse={true} />
+    {/snippet}
+</Story>