feat(linear): Add Linear Mode - simplified workflow interface

- Add LinearView as main entry point for linear mode
- Add LinearWorkspace with template selector and creation panels
- Add LinearIconSidebar with navigation (create, history, settings)
- Add LinearTemplateSelector with category filters and template cards
- Add LinearCreationPanel with step-by-step workflow builder
- Add LinearInputPanel for image/text input with drag-drop support
- Add LinearParameterPanel for model and generation settings
- Add LinearOutputGallery for generated results display
- Add LinearHistoryPanel for generation history
- Add LinearStepCard, LinearTemplateCard components
- Add linear mode route (/linear)
- Add linear mode toggle in workspace sidebar
- Update components.d.ts with linear components

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

ComfyUI_vibe/src/components/linear/LinearIconSidebar.vue

@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+
+type LinearTab = 'chat' | 'tool' | 'apps' | 'workflow'
+
+const activeTab = ref<LinearTab>('tool')
+
+const tabs: Array<{ id: LinearTab; icon: string; label: string }> = [
+  { id: 'chat', icon: 'pi-sparkles', label: 'Chat' },
+  { id: 'tool', icon: 'pi-sliders-h', label: 'Tool' },
+  { id: 'apps', icon: 'pi-th-large', label: 'Apps' },
+  { id: 'workflow', icon: 'pi-sitemap', label: 'Workflow' },
+]
+
+const emit = defineEmits<{
+  'update:activeTab': [tab: LinearTab]
+}>()
+
+function selectTab(tab: LinearTab): void {
+  activeTab.value = tab
+  emit('update:activeTab', tab)
+}
+</script>
+
+<template>
+  <aside class="flex h-full w-12 flex-col items-center border-r border-zinc-800 bg-zinc-900 py-2">
+    <!-- Tab Buttons -->
+    <div class="flex flex-col gap-1">
+      <button
+        v-for="tab in tabs"
+        :key="tab.id"
+        v-tooltip.right="tab.label"
+        :class="[
+          'flex h-10 w-10 flex-col items-center justify-center rounded-lg transition-colors',
+          activeTab === tab.id
+            ? 'bg-zinc-800 text-zinc-100'
+            : 'text-zinc-500 hover:bg-zinc-800/50 hover:text-zinc-300'
+        ]"
+        @click="selectTab(tab.id)"
+      >
+        <i :class="['pi', tab.icon, 'text-base']" />
+        <span class="mt-0.5 text-[8px] font-medium uppercase tracking-wide">{{ tab.label }}</span>
+      </button>
+    </div>
+
+    <!-- Spacer -->
+    <div class="flex-1" />
+
+    <!-- Bottom Actions -->
+    <div class="flex flex-col gap-1">
+      <button
+        v-tooltip.right="'Settings'"
+        class="flex h-10 w-10 items-center justify-center rounded-lg text-zinc-500 transition-colors hover:bg-zinc-800/50 hover:text-zinc-300"
+      >
+        <i class="pi pi-cog text-base" />
+      </button>
+    </div>
+  </aside>
+</template>