Clean up basic button validation

.git-blame-ignore-revs

@@ -7,21 +7,3 @@ c53f197de2a3e0fa66b16dedc65c131235c1c4b6
 
 # Reorganize renderer components into domain-driven folder structure
 c8a83a9caede7bdb5f8598c5492b07d08c339d49
-
-# Domain-driven design (DDD) refactors - September 2025
-# These commits reorganized the codebase into domain-driven architecture
-
-# [refactor] Improve renderer domain organization (#5552)
-6349ceee6c0a57fc7992e85635def9b6e22eaeb2
-
-# [refactor] Improve settings domain organization (#5550)  
-4c8c4a1ad4f53354f700a33ea1b95262aeda2719
-
-# [refactor] Improve workflow domain organization (#5584)
-ca312fd1eab540cc4ddc0e3d244d38b3858574f0
-
-# [refactor] Move thumbnail functionality to renderer/core domain (#5586)
-e3bb29ceb8174b8bbca9e48ec7d42cd540f40efa
-
-# [refactor] Improve updates/notifications domain organization (#5590)
-27ab355f9c73415dc39f4d3f512b02308f847801

.github/workflows/publish-frontend-types.yaml

@@ -1,137 +0,0 @@
-name: Publish Frontend Types
-
-on:
-  workflow_dispatch:
-    inputs:
-      version:
-        description: 'Version to publish (e.g., 1.26.7)'
-        required: true
-        type: string
-      dist_tag:
-        description: 'npm dist-tag to use'
-        required: true
-        default: latest
-        type: string
-      ref:
-        description: 'Git ref to checkout (commit SHA, tag, or branch)'
-        required: false
-        type: string
-  workflow_call:
-    inputs:
-      version:
-        required: true
-        type: string
-      dist_tag:
-        required: false
-        type: string
-        default: latest
-      ref:
-        required: false
-        type: string
-
-concurrency:
-  group: publish-frontend-types-${{ github.workflow }}-${{ inputs.version }}-${{ inputs.dist_tag }}
-  cancel-in-progress: false
-
-jobs:
-  publish_types_manual:
-    name: Publish @comfyorg/comfyui-frontend-types
-    runs-on: ubuntu-latest
-    permissions:
-      contents: read
-    steps:
-      - name: Validate inputs
-        shell: bash
-        run: |
-          set -euo pipefail
-          VERSION="${{ inputs.version }}"
-          SEMVER_REGEX='^(0|[1-9][0-9]*)\.(0|[1-9][0-9]*)\.(0|[1-9][0-9]*)(-((0|[1-9][0-9]*|[0-9]*[A-Za-z-][0-9A-Za-z-]*)(\.(0|[1-9][0-9]*|[0-9]*[A-Za-z-][0-9A-Za-z-]*))*))?(\+([0-9A-Za-z-]+(\.[0-9A-Za-z-]+)*))?$'
-          if [[ ! "$VERSION" =~ $SEMVER_REGEX ]]; then
-            echo "::error title=Invalid version::Version '$VERSION' must follow semantic versioning (x.y.z[-suffix][+build])" >&2
-            exit 1
-          fi
-
-      - name: Determine ref to checkout
-        id: resolve_ref
-        shell: bash
-        run: |
-          set -euo pipefail
-          REF="${{ inputs.ref }}"
-          VERSION="${{ inputs.version }}"
-          if [ -n "$REF" ]; then
-            if ! git check-ref-format --allow-onelevel "$REF"; then
-              echo "::error title=Invalid ref::Ref '$REF' fails git check-ref-format validation." >&2
-              exit 1
-            fi
-            echo "ref=$REF" >> "$GITHUB_OUTPUT"
-          else
-            echo "ref=refs/tags/v$VERSION" >> "$GITHUB_OUTPUT"
-          fi
-
-      - name: Checkout repository
-        uses: actions/checkout@v5
-        with:
-          ref: ${{ steps.resolve_ref.outputs.ref }}
-          fetch-depth: 1
-
-      - name: Install pnpm
-        uses: pnpm/action-setup@v4
-        with:
-          version: 10
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v5
-        with:
-          node-version: 'lts/*'
-          cache: 'pnpm'
-          registry-url: https://registry.npmjs.org
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
-
-      - name: Build types
-        run: pnpm build:types
-
-      - name: Verify version matches input
-        id: verify
-        shell: bash
-        run: |
-          PKG_VERSION=$(node -p "require('./package.json').version")
-          TYPES_PKG_VERSION=$(node -p "require('./dist/package.json').version")
-          if [ "$PKG_VERSION" != "${{ inputs.version }}" ]; then
-            echo "Error: package.json version $PKG_VERSION does not match input ${{ inputs.version }}" >&2
-            exit 1
-          fi
-          if [ "$TYPES_PKG_VERSION" != "${{ inputs.version }}" ]; then
-            echo "Error: dist/package.json version $TYPES_PKG_VERSION does not match input ${{ inputs.version }}" >&2
-            exit 1
-          fi
-          echo "version=${{ inputs.version }}" >> $GITHUB_OUTPUT
-
-      - name: Check if version already on npm
-        id: check_npm
-        shell: bash
-        run: |
-          set -euo pipefail
-          NAME=$(node -p "require('./dist/package.json').name")
-          VER="${{ steps.verify.outputs.version }}"
-          STATUS=0
-          OUTPUT=$(npm view "${NAME}@${VER}" --json 2>&1) || STATUS=$?
-          if [ "$STATUS" -eq 0 ]; then
-            echo "exists=true" >> "$GITHUB_OUTPUT"
-            echo "::warning title=Already published::${NAME}@${VER} already exists on npm. Skipping publish."
-          else
-            if echo "$OUTPUT" | grep -q "E404"; then
-              echo "exists=false" >> "$GITHUB_OUTPUT"
-            else
-              echo "::error title=Registry lookup failed::$OUTPUT" >&2
-              exit "$STATUS"
-            fi
-          fi
-
-      - name: Publish package
-        if: steps.check_npm.outputs.exists == 'false'
-        run: pnpm publish --access public --tag "${{ inputs.dist_tag }}"
-        working-directory: dist
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.github/workflows/release.yaml

@@ -18,7 +18,7 @@ jobs:
       is_prerelease: ${{ steps.check_prerelease.outputs.is_prerelease }}
     steps:
       - name: Checkout code
-        uses: actions/checkout@v5
+        uses: actions/checkout@v4
       - name: Install pnpm
         uses: pnpm/action-setup@v4
         with:
@@ -73,7 +73,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v5
+        uses: actions/checkout@v4
       - name: Download dist artifact
         uses: actions/download-artifact@v4
         with:
@@ -98,7 +98,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v5
+        uses: actions/checkout@v4
       - name: Download dist artifact
         uses: actions/download-artifact@v4
         with:
@@ -126,8 +126,34 @@ jobs:
 
   publish_types:
     needs: build
-    uses: ./.github/workflows/publish-frontend-types.yaml
-    with:
-      version: ${{ needs.build.outputs.version }}
-      ref: ${{ github.event.pull_request.merge_commit_sha }}
-    secrets: inherit
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 'lts/*'
+          cache: 'pnpm'
+          registry-url: https://registry.npmjs.org
+
+      - name: Cache tool outputs
+        uses: actions/cache@v4
+        with:
+          path: |
+            .cache
+            tsconfig.tsbuildinfo
+            dist
+          key: types-tools-cache-${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            types-tools-cache-${{ runner.os }}-
+
+      - run: pnpm install --frozen-lockfile
+      - run: pnpm build:types
+      - name: Publish package
+        run: pnpm publish --access public
+        working-directory: dist
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.gitignore

@@ -51,7 +51,7 @@ tests-ui/workflows/examples
 /blob-report/
 /playwright/.cache/
 browser_tests/**/*-win32.png
-browser_tests/local/
+browser-tests/local/
 
 .env
 

browser_tests/fixtures/ComfyPage.ts

@@ -5,7 +5,7 @@ import dotenv from 'dotenv'
 import * as fs from 'fs'
 
 import type { LGraphNode } from '../../src/lib/litegraph/src/litegraph'
-import type { NodeId } from '../../src/platform/workflow/validation/schemas/workflowSchema'
+import type { NodeId } from '../../src/schemas/comfyWorkflowSchema'
 import type { KeyCombo } from '../../src/schemas/keyBindingSchema'
 import type { useWorkspaceStore } from '../../src/stores/workspaceStore'
 import { NodeBadgeMode } from '../../src/types/nodeSource'

browser_tests/fixtures/utils/litegraphUtils.ts

@@ -1,6 +1,6 @@
 import type { Page } from '@playwright/test'
 
-import type { NodeId } from '../../../src/platform/workflow/validation/schemas/workflowSchema'
+import type { NodeId } from '../../../src/schemas/comfyWorkflowSchema'
 import { ManageGroupNode } from '../../helpers/manageGroupNode'
 import type { ComfyPage } from '../ComfyPage'
 import type { Position, Size } from '../types'

browser_tests/helpers/templates.ts

@@ -4,7 +4,7 @@ import path from 'path'
 import {
   TemplateInfo,
   WorkflowTemplates
-} from '../../src/platform/workflow/templates/types/template'
+} from '../../src/types/workflowTemplateTypes'
 
 export class ComfyTemplates {
   readonly content: Locator

browser_tests/tests/extensionAPI.spec.ts

@@ -1,6 +1,6 @@
 import { expect } from '@playwright/test'
 
-import { SettingParams } from '../../src/platform/settings/types'
+import { SettingParams } from '../../src/types/settingTypes'
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 
 test.describe('Topbar commands', () => {
@@ -247,7 +247,7 @@ test.describe('Topbar commands', () => {
   test.describe('Dialog', () => {
     test('Should allow showing a prompt dialog', async ({ comfyPage }) => {
       await comfyPage.page.evaluate(() => {
-        void window['app'].extensionManager.dialog
+        window['app'].extensionManager.dialog
           .prompt({
             title: 'Test Prompt',
             message: 'Test Prompt Message'
@@ -267,7 +267,7 @@ test.describe('Topbar commands', () => {
       comfyPage
     }) => {
       await comfyPage.page.evaluate(() => {
-        void window['app'].extensionManager.dialog
+        window['app'].extensionManager.dialog
           .confirm({
             title: 'Test Confirm',
             message: 'Test Confirm Message'
@@ -284,7 +284,7 @@ test.describe('Topbar commands', () => {
     test('Should allow dismissing a dialog', async ({ comfyPage }) => {
       await comfyPage.page.evaluate(() => {
         window['value'] = 'foo'
-        void window['app'].extensionManager.dialog
+        window['app'].extensionManager.dialog
           .confirm({
             title: 'Test Confirm',
             message: 'Test Confirm Message'

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@comfyorg/comfyui-frontend",
   "private": true,
-  "version": "1.27.4",
+  "version": "1.27.3",
   "type": "module",
   "repository": "https://github.com/Comfy-Org/ComfyUI_frontend",
   "homepage": "https://comfy.org",
@@ -14,9 +14,9 @@
     "build:types": "nx build --config vite.types.config.mts && node scripts/prepare-types.js",
     "zipdist": "node scripts/zipdist.js",
     "typecheck": "vue-tsc --noEmit",
-    "format": "prettier --write './**/*.{js,ts,tsx,vue,mts}' --cache --list-different",
+    "format": "prettier --write './**/*.{js,ts,tsx,vue,mts}' --cache",
     "format:check": "prettier --check './**/*.{js,ts,tsx,vue,mts}' --cache",
-    "format:no-cache": "prettier --write './**/*.{js,ts,tsx,vue,mts}' --list-different",
+    "format:no-cache": "prettier --write './**/*.{js,ts,tsx,vue,mts}'",
     "format:check:no-cache": "prettier --check './**/*.{js,ts,tsx,vue,mts}'",
     "test:browser": "npx nx e2e",
     "test:unit": "nx run test tests-ui/tests",
@@ -101,7 +101,7 @@
   "dependencies": {
     "@alloc/quick-lru": "^5.2.0",
     "@atlaskit/pragmatic-drag-and-drop": "^1.3.1",
-    "@comfyorg/comfyui-electron-types": "0.4.73-0",
+    "@comfyorg/comfyui-electron-types": "^0.4.72",
     "@iconify/json": "^2.2.380",
     "@primeuix/forms": "0.0.2",
     "@primeuix/styled": "0.3.2",

pnpm-lock.yaml

@@ -15,8 +15,8 @@ importers:
         specifier: ^1.3.1
         version: 1.3.1
       '@comfyorg/comfyui-electron-types':
-        specifier: 0.4.73-0
-        version: 0.4.73-0
+        specifier: ^0.4.72
+        version: 0.4.72
       '@iconify/json':
         specifier: ^2.2.380
         version: 2.2.380
@@ -986,8 +986,8 @@ packages:
     resolution: {integrity: sha512-6zABk/ECA/QYSCQ1NGiVwwbQerUCZ+TQbp64Q3AgmfNvurHH0j8TtXa1qbShXA6qqkpAj4V5W8pP6mLe1mcMqA==}
     engines: {node: '>=18'}
 
-  '@comfyorg/comfyui-electron-types@0.4.73-0':
-    resolution: {integrity: sha512-WlItGJQx9ZWShNG9wypx3kq+19pSig/U+s5sD2SAeEcMph4u8A/TS+lnRgdKhT58VT1uD7cMcj2SJpfdBPNWvw==}
+  '@comfyorg/comfyui-electron-types@0.4.72':
+    resolution: {integrity: sha512-Ecf0XYOKDqqIcnjSWL8GHLo6MOsuwqs0I1QgWc3Hv+BZm+qUE4vzOXCyhfFoTIGHLZFTwe37gnygPPKFzMu00Q==}
 
   '@csstools/color-helpers@5.1.0':
     resolution: {integrity: sha512-S11EXWJyy0Mz5SYvRmY8nJYTFFd1LCNV+7cXyAgQtOOuzb4EsgfqDufL+9esx72/eLhsRdGZwaldu/h+E4t4BA==}
@@ -7502,7 +7502,7 @@ snapshots:
 
   '@bcoe/v8-coverage@1.0.2': {}
 
-  '@comfyorg/comfyui-electron-types@0.4.73-0': {}
+  '@comfyorg/comfyui-electron-types@0.4.72': {}
 
   '@csstools/color-helpers@5.1.0': {}
 

scripts/collect-i18n-general.ts

@@ -3,8 +3,8 @@ import * as fs from 'fs'
 import { comfyPageFixture as test } from '../browser_tests/fixtures/ComfyPage'
 import { CORE_MENU_COMMANDS } from '../src/constants/coreMenuCommands'
 import { SERVER_CONFIG_ITEMS } from '../src/constants/serverConfig'
-import type { FormItem, SettingParams } from '../src/platform/settings/types'
 import type { ComfyCommandImpl } from '../src/stores/commandStore'
+import type { FormItem, SettingParams } from '../src/types/settingTypes'
 import { formatCamelCase, normalizeI18nKey } from '../src/utils/formatUtil'
 
 const localePath = './src/locales/en/main.json'

scripts/generate-json-schema.ts

@@ -5,7 +5,7 @@ import { zodToJsonSchema } from 'zod-to-json-schema'
 import {
   zComfyWorkflow,
   zComfyWorkflow1
-} from '../src/platform/workflow/validation/schemas/workflowSchema'
+} from '../src/schemas/comfyWorkflowSchema'
 import { zComfyNodeDef as zComfyNodeDefV2 } from '../src/schemas/nodeDef/nodeDefSchemaV2'
 import { zComfyNodeDef as zComfyNodeDefV1 } from '../src/schemas/nodeDefSchema'
 

src/assets/css/fonts.css

@@ -1,17 +1,50 @@
-/* Inter Font Family */
+/* ABC ROM Font Family */
 
 @font-face {
-  font-family: 'Inter';
-  src: url('/fonts/inter-latin-normal.woff2') format('woff2');
-  font-weight: 100 900;
+  font-family: 'ABC ROM Medium';
+  src: url('/fonts/abc-rom/abc-rom-medium.woff2') format('woff2');
+  font-weight: 500;
   font-style: normal;
   font-display: swap;
 }
 
 @font-face {
-  font-family: 'Inter';
-  src: url('/fonts/inter-latin-italic.woff2') format('woff2');
-  font-weight: 100 900;
+  font-family: 'ABC ROM Regular';
+  src: url('/fonts/abc-rom/abc-rom-regular.woff2') format('woff2');
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'ABC ROM Black Italic';
+  src: url('/fonts/abc-rom/abc-rom-black-italic.woff2') format('woff2');
+  font-weight: 900;
   font-style: italic;
   font-display: swap;
 }
+
+/* Simplified font family names for easier use */
+@font-face {
+  font-family: 'ABC ROM';
+  src: url('/fonts/abc-rom/abc-rom-regular.woff2') format('woff2');
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'ABC ROM';
+  src: url('/fonts/abc-rom/abc-rom-medium.woff2') format('woff2');
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'ABC ROM';
+  src: url('/fonts/abc-rom/abc-rom-black-italic.woff2') format('woff2');
+  font-weight: 900;
+  font-style: italic;
+  font-display: swap;
+}

src/assets/css/style.css

@@ -1,6 +1,5 @@
 @layer theme, base, primevue, components, utilities;
 
-@import './fonts.css';
 @import 'tailwindcss/theme' layer(theme);
 @import 'tailwindcss/utilities' layer(utilities);
 @import 'tw-animate-css';
@@ -53,9 +52,6 @@
   --text-xxs: 0.625rem;
   --text-xxs--line-height: calc(1 / 0.625);
 
-  /* Font Families */
-  --font-inter: 'Inter', sans-serif;
-
   /* Palette Colors */
   --color-charcoal-100: #171718;
   --color-charcoal-200: #202121;
@@ -103,11 +99,10 @@
   --color-danger-100: #c02323;
   --color-danger-200: #d62952;
 
-  --color-bypass: #6A246A;
   --color-error: #962a2a;
 
-  --color-blue-selection: rgb(from var(--color-blue-100) r g b / 0.3);
-  --color-node-hover-100: rgb(from var(--color-charcoal-800) r g b/ 0.15);
+  --color-blue-selection: rgb( from var(--color-blue-100) r g b / 0.3); 
+  --color-node-hover-100: rgb( from var(--color-charcoal-800) r g b/ 0.15);
   --color-node-hover-200: rgb(from var(--color-charcoal-800) r g b/ 0.1);
   --color-modal-tag: rgb(from var(--color-gray-400) r g b/ 0.4);
 
@@ -136,7 +131,7 @@
 
 @utility scrollbar-hide {
   scrollbar-width: none;
-  &::-webkit-scrollbar {
+  &::-webkit-scrollbar { 
     width: 1px;
   }
   &::-webkit-scrollbar-thumb {
@@ -966,7 +961,9 @@ audio.comfy-audio.empty-audio-widget {
   /* Uses default styling - no overrides needed */
 }
 
+/* Smooth transitions between LOD levels */
 .lg-node {
+  transition: min-height 0.2s ease;
   /* Disable text selection on all nodes */
   user-select: none;
   -webkit-user-select: none;

src/components/LiteGraphCanvasSplitterOverlay.vue

@@ -50,7 +50,7 @@ import Splitter from 'primevue/splitter'
 import SplitterPanel from 'primevue/splitterpanel'
 import { computed } from 'vue'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { useBottomPanelStore } from '@/stores/workspace/bottomPanelStore'
 import { useSidebarTabStore } from '@/stores/workspace/sidebarTabStore'
 

src/components/MenuHamburger.vue

@@ -23,8 +23,8 @@
 import Button from 'primevue/button'
 import { CSSProperties, computed, watchEffect } from 'vue'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { app } from '@/scripts/app'
+import { useSettingStore } from '@/stores/settingStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 import { showNativeSystemMenu } from '@/utils/envUtil'
 

src/components/actionbar/BatchCountEdit.vue

@@ -37,8 +37,8 @@ import { storeToRefs } from 'pinia'
 import InputNumber from 'primevue/inputnumber'
 import { computed } from 'vue'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { useQueueSettingsStore } from '@/stores/queueStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 const queueSettingsStore = useQueueSettingsStore()
 const { batchCount } = storeToRefs(queueSettingsStore)

src/components/actionbar/ComfyActionbar.vue

@@ -24,7 +24,7 @@ import { clamp } from 'es-toolkit/compat'
 import Panel from 'primevue/panel'
 import { Ref, computed, inject, nextTick, onMounted, ref, watch } from 'vue'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 import ComfyQueueButton from './ComfyQueueButton.vue'
 

src/components/bottomPanel/tabs/terminal/BaseTerminal.vue

@@ -3,37 +3,13 @@
     <div class="p-terminal rounded-none h-full w-full p-2">
       <div ref="terminalEl" class="h-full terminal-host" />
     </div>
-    <Button
-      v-tooltip.left="{
-        value: tooltipText,
-        showDelay: 300
-      }"
-      icon="pi pi-copy"
-      severity="secondary"
-      size="small"
-      :class="
-        cn('absolute top-2 right-8 transition-opacity', {
-          'opacity-0 pointer-events-none select-none': !isHovered
-        })
-      "
-      :aria-label="tooltipText"
-      @click="handleCopy"
-    />
   </div>
 </template>
 
 <script setup lang="ts">
-import { useElementHover, useEventListener } from '@vueuse/core'
-import type { IDisposable } from '@xterm/xterm'
-import Button from 'primevue/button'
-import { Ref, computed, onMounted, onUnmounted, ref } from 'vue'
-import { useI18n } from 'vue-i18n'
+import { Ref, onUnmounted, ref } from 'vue'
 
 import { useTerminal } from '@/composables/bottomPanelTabs/useTerminal'
-import { electronAPI, isElectron } from '@/utils/envUtil'
-import { cn } from '@/utils/tailwindUtil'
-
-const { t } = useI18n()
 
 const emit = defineEmits<{
   created: [ReturnType<typeof useTerminal>, Ref<HTMLElement | undefined>]
@@ -41,59 +17,9 @@ const emit = defineEmits<{
 }>()
 const terminalEl = ref<HTMLElement | undefined>()
 const rootEl = ref<HTMLElement | undefined>()
-const hasSelection = ref(false)
+emit('created', useTerminal(terminalEl), rootEl)
 
-const isHovered = useElementHover(rootEl)
-
-const terminalData = useTerminal(terminalEl)
-emit('created', terminalData, rootEl)
-
-const { terminal } = terminalData
-let selectionDisposable: IDisposable | undefined
-
-const tooltipText = computed(() => {
-  return hasSelection.value
-    ? t('serverStart.copySelectionTooltip')
-    : t('serverStart.copyAllTooltip')
-})
-
-const handleCopy = async () => {
-  const existingSelection = terminal.getSelection()
-  const shouldSelectAll = !existingSelection
-  if (shouldSelectAll) terminal.selectAll()
-
-  const selectedText = shouldSelectAll
-    ? terminal.getSelection()
-    : existingSelection
-
-  if (selectedText) {
-    await navigator.clipboard.writeText(selectedText)
-
-    if (shouldSelectAll) {
-      terminal.clearSelection()
-    }
-  }
-}
-
-const showContextMenu = (event: MouseEvent) => {
-  event.preventDefault()
-  electronAPI()?.showContextMenu({ type: 'text' })
-}
-
-if (isElectron()) {
-  useEventListener(terminalEl, 'contextmenu', showContextMenu)
-}
-
-onMounted(() => {
-  selectionDisposable = terminal.onSelectionChange(() => {
-    hasSelection.value = terminal.hasSelection()
-  })
-})
-
-onUnmounted(() => {
-  selectionDisposable?.dispose()
-  emit('unmounted')
-})
+onUnmounted(() => emit('unmounted'))
 </script>
 
 <style scoped>

src/components/breadcrumb/SubgraphBreadcrumb.vue

@@ -38,10 +38,10 @@ import { computed, onUpdated, ref, watch } from 'vue'
 
 import SubgraphBreadcrumbItem from '@/components/breadcrumb/SubgraphBreadcrumbItem.vue'
 import { useOverflowObserver } from '@/composables/element/useOverflowObserver'
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
+import { useCanvasStore } from '@/stores/graphStore'
 import { useSubgraphNavigationStore } from '@/stores/subgraphNavigationStore'
 import { useSubgraphStore } from '@/stores/subgraphStore'
+import { useWorkflowStore } from '@/stores/workflowStore'
 import { forEachSubgraphNode } from '@/utils/graphTraversalUtil'
 
 const MIN_WIDTH = 28

src/components/breadcrumb/SubgraphBreadcrumbItem.vue

@@ -53,14 +53,11 @@ import Tag from 'primevue/tag'
 import { computed, nextTick, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
-import { useWorkflowService } from '@/platform/workflow/core/services/workflowService'
-import {
-  ComfyWorkflow,
-  useWorkflowStore
-} from '@/platform/workflow/management/stores/workflowStore'
 import { useDialogService } from '@/services/dialogService'
+import { useWorkflowService } from '@/services/workflowService'
 import { useCommandStore } from '@/stores/commandStore'
 import { useSubgraphNavigationStore } from '@/stores/subgraphNavigationStore'
+import { ComfyWorkflow, useWorkflowStore } from '@/stores/workflowStore'
 import { appendJsonExt } from '@/utils/formatUtil'
 
 interface Props {

src/components/common/BackgroundImageUpload.vue

@@ -36,8 +36,8 @@ import Button from 'primevue/button'
 import InputText from 'primevue/inputtext'
 import { ref } from 'vue'
 
-import { useToastStore } from '@/platform/updates/common/toastStore'
 import { api } from '@/scripts/api'
+import { useToastStore } from '@/stores/toastStore'
 
 const modelValue = defineModel<string>()
 

src/components/common/FormItem.vue

@@ -40,11 +40,10 @@ import BackgroundImageUpload from '@/components/common/BackgroundImageUpload.vue
 import CustomFormValue from '@/components/common/CustomFormValue.vue'
 import FormColorPicker from '@/components/common/FormColorPicker.vue'
 import FormImageUpload from '@/components/common/FormImageUpload.vue'
-import FormRadioGroup from '@/components/common/FormRadioGroup.vue'
 import InputKnob from '@/components/common/InputKnob.vue'
 import InputSlider from '@/components/common/InputSlider.vue'
 import UrlInput from '@/components/common/UrlInput.vue'
-import { FormItem } from '@/platform/settings/types'
+import { FormItem } from '@/types/settingTypes'
 
 const formValue = defineModel<any>('formValue')
 const props = defineProps<{
@@ -67,7 +66,6 @@ function getFormAttrs(item: FormItem) {
   }
   switch (item.type) {
     case 'combo':
-    case 'radio':
       attrs['options'] =
         typeof item.options === 'function'
           ? // @ts-expect-error: Audit and deprecate usage of legacy options type:
@@ -99,8 +97,6 @@ function getFormComponent(item: FormItem): Component {
       return InputKnob
     case 'combo':
       return Select
-    case 'radio':
-      return FormRadioGroup
     case 'image':
       return FormImageUpload
     case 'color':

src/components/common/FormRadioGroup.spec.ts

@@ -1,245 +0,0 @@
-import { mount } from '@vue/test-utils'
-import PrimeVue from 'primevue/config'
-import RadioButton from 'primevue/radiobutton'
-import { beforeAll, describe, expect, it } from 'vitest'
-import { createApp } from 'vue'
-
-import type { SettingOption } from '@/platform/settings/types'
-
-import FormRadioGroup from './FormRadioGroup.vue'
-
-describe('FormRadioGroup', () => {
-  beforeAll(() => {
-    const app = createApp({})
-    app.use(PrimeVue)
-  })
-
-  const mountComponent = (props: any, options = {}) => {
-    return mount(FormRadioGroup, {
-      global: {
-        plugins: [PrimeVue],
-        components: { RadioButton }
-      },
-      props,
-      ...options
-    })
-  }
-
-  describe('normalizedOptions computed property', () => {
-    it('handles string array options', () => {
-      const wrapper = mountComponent({
-        modelValue: 'option1',
-        options: ['option1', 'option2', 'option3'],
-        id: 'test-radio'
-      })
-
-      const radioButtons = wrapper.findAllComponents(RadioButton)
-      expect(radioButtons).toHaveLength(3)
-
-      expect(radioButtons[0].props('value')).toBe('option1')
-      expect(radioButtons[1].props('value')).toBe('option2')
-      expect(radioButtons[2].props('value')).toBe('option3')
-
-      const labels = wrapper.findAll('label')
-      expect(labels[0].text()).toBe('option1')
-      expect(labels[1].text()).toBe('option2')
-      expect(labels[2].text()).toBe('option3')
-    })
-
-    it('handles SettingOption array', () => {
-      const options: SettingOption[] = [
-        { text: 'Small', value: 'sm' },
-        { text: 'Medium', value: 'md' },
-        { text: 'Large', value: 'lg' }
-      ]
-
-      const wrapper = mountComponent({
-        modelValue: 'md',
-        options,
-        id: 'test-radio'
-      })
-
-      const radioButtons = wrapper.findAllComponents(RadioButton)
-      expect(radioButtons).toHaveLength(3)
-
-      expect(radioButtons[0].props('value')).toBe('sm')
-      expect(radioButtons[1].props('value')).toBe('md')
-      expect(radioButtons[2].props('value')).toBe('lg')
-
-      const labels = wrapper.findAll('label')
-      expect(labels[0].text()).toBe('Small')
-      expect(labels[1].text()).toBe('Medium')
-      expect(labels[2].text()).toBe('Large')
-    })
-
-    it('handles SettingOption with undefined value (uses text as value)', () => {
-      const options: SettingOption[] = [
-        { text: 'Option A', value: undefined },
-        { text: 'Option B' }
-      ]
-
-      const wrapper = mountComponent({
-        modelValue: 'Option A',
-        options,
-        id: 'test-radio'
-      })
-
-      const radioButtons = wrapper.findAllComponents(RadioButton)
-
-      expect(radioButtons[0].props('value')).toBe('Option A')
-      expect(radioButtons[1].props('value')).toBe('Option B')
-    })
-
-    it('handles custom object with optionLabel and optionValue', () => {
-      const options = [
-        { name: 'First Option', id: 1 },
-        { name: 'Second Option', id: 2 },
-        { name: 'Third Option', id: 3 }
-      ]
-
-      const wrapper = mountComponent({
-        modelValue: 2,
-        options,
-        optionLabel: 'name',
-        optionValue: 'id',
-        id: 'test-radio'
-      })
-
-      const radioButtons = wrapper.findAllComponents(RadioButton)
-      expect(radioButtons).toHaveLength(3)
-
-      expect(radioButtons[0].props('value')).toBe(1)
-      expect(radioButtons[1].props('value')).toBe(2)
-      expect(radioButtons[2].props('value')).toBe(3)
-
-      const labels = wrapper.findAll('label')
-      expect(labels[0].text()).toBe('First Option')
-      expect(labels[1].text()).toBe('Second Option')
-      expect(labels[2].text()).toBe('Third Option')
-    })
-
-    it('handles mixed array with strings and SettingOptions', () => {
-      const options: (string | SettingOption)[] = [
-        'Simple String',
-        { text: 'Complex Option', value: 'complex' },
-        'Another String'
-      ]
-
-      const wrapper = mountComponent({
-        modelValue: 'complex',
-        options,
-        id: 'test-radio'
-      })
-
-      const radioButtons = wrapper.findAllComponents(RadioButton)
-      expect(radioButtons).toHaveLength(3)
-
-      expect(radioButtons[0].props('value')).toBe('Simple String')
-      expect(radioButtons[1].props('value')).toBe('complex')
-      expect(radioButtons[2].props('value')).toBe('Another String')
-
-      const labels = wrapper.findAll('label')
-      expect(labels[0].text()).toBe('Simple String')
-      expect(labels[1].text()).toBe('Complex Option')
-      expect(labels[2].text()).toBe('Another String')
-    })
-
-    it('handles empty options array', () => {
-      const wrapper = mountComponent({
-        modelValue: null,
-        options: [],
-        id: 'test-radio'
-      })
-
-      const radioButtons = wrapper.findAllComponents(RadioButton)
-      expect(radioButtons).toHaveLength(0)
-    })
-
-    it('handles undefined options gracefully', () => {
-      const wrapper = mountComponent({
-        modelValue: null,
-        options: undefined,
-        id: 'test-radio'
-      })
-
-      const radioButtons = wrapper.findAllComponents(RadioButton)
-      expect(radioButtons).toHaveLength(0)
-    })
-
-    it('handles object with missing properties gracefully', () => {
-      const options = [
-        { label: 'Option 1', val: 'opt1' },
-        { text: 'Option 2', value: 'opt2' }
-      ]
-
-      const wrapper = mountComponent({
-        modelValue: 'opt1',
-        options,
-        id: 'test-radio'
-      })
-
-      const radioButtons = wrapper.findAllComponents(RadioButton)
-      expect(radioButtons).toHaveLength(2)
-
-      const labels = wrapper.findAll('label')
-      expect(labels[0].text()).toBe('Unknown')
-      expect(labels[1].text()).toBe('Option 2')
-    })
-  })
-
-  describe('component functionality', () => {
-    it('sets correct input-id and name attributes', () => {
-      const options = ['A', 'B']
-
-      const wrapper = mountComponent({
-        modelValue: 'A',
-        options,
-        id: 'my-radio-group'
-      })
-
-      const radioButtons = wrapper.findAllComponents(RadioButton)
-
-      expect(radioButtons[0].props('inputId')).toBe('my-radio-group-A')
-      expect(radioButtons[0].props('name')).toBe('my-radio-group')
-      expect(radioButtons[1].props('inputId')).toBe('my-radio-group-B')
-      expect(radioButtons[1].props('name')).toBe('my-radio-group')
-    })
-
-    it('associates labels with radio buttons correctly', () => {
-      const options = ['Yes', 'No']
-
-      const wrapper = mountComponent({
-        modelValue: 'Yes',
-        options,
-        id: 'confirm-radio'
-      })
-
-      const labels = wrapper.findAll('label')
-
-      expect(labels[0].attributes('for')).toBe('confirm-radio-Yes')
-      expect(labels[1].attributes('for')).toBe('confirm-radio-No')
-    })
-
-    it('sets aria-describedby attribute correctly', () => {
-      const options: SettingOption[] = [
-        { text: 'Option 1', value: 'opt1' },
-        { text: 'Option 2', value: 'opt2' }
-      ]
-
-      const wrapper = mountComponent({
-        modelValue: 'opt1',
-        options,
-        id: 'test-radio'
-      })
-
-      const radioButtons = wrapper.findAllComponents(RadioButton)
-
-      expect(radioButtons[0].attributes('aria-describedby')).toBe(
-        'Option 1-label'
-      )
-      expect(radioButtons[1].attributes('aria-describedby')).toBe(
-        'Option 2-label'
-      )
-    })
-  })
-})

src/components/common/FormRadioGroup.vue

@@ -1,62 +0,0 @@
-<template>
-  <div class="flex flex-row gap-4">
-    <div
-      v-for="option in normalizedOptions"
-      :key="option.value"
-      class="flex items-center"
-    >
-      <RadioButton
-        :input-id="`${id}-${option.value}`"
-        :name="id"
-        :value="option.value"
-        :model-value="modelValue"
-        :aria-describedby="`${option.text}-label`"
-        @update:model-value="$emit('update:modelValue', $event)"
-      />
-      <label :for="`${id}-${option.value}`" class="ml-2 cursor-pointer">
-        {{ option.text }}
-      </label>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import RadioButton from 'primevue/radiobutton'
-import { computed } from 'vue'
-
-import type { SettingOption } from '@/platform/settings/types'
-
-const props = defineProps<{
-  modelValue: any
-  options: (SettingOption | string)[]
-  optionLabel?: string
-  optionValue?: string
-  id?: string
-}>()
-
-defineEmits<{
-  'update:modelValue': [value: any]
-}>()
-
-const normalizedOptions = computed<SettingOption[]>(() => {
-  if (!props.options) return []
-
-  return props.options.map((option) => {
-    if (typeof option === 'string') {
-      return { text: option, value: option }
-    }
-
-    if ('text' in option) {
-      return {
-        text: option.text,
-        value: option.value ?? option.text
-      }
-    }
-    // Handle optionLabel/optionValue
-    return {
-      text: option[props.optionLabel || 'text'] || 'Unknown',
-      value: option[props.optionValue || 'value']
-    }
-  })
-})
-</script>

src/components/dialog/UnloadWindowConfirmDialog.vue

@@ -12,8 +12,8 @@
 <script setup lang="ts">
 import { onBeforeUnmount, onMounted } from 'vue'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
+import { useSettingStore } from '@/stores/settingStore'
+import { useWorkflowStore } from '@/stores/workflowStore'
 
 const settingStore = useSettingStore()
 const workflowStore = useWorkflowStore()

src/components/dialog/content/ConfirmationDialogContent.vue

@@ -94,9 +94,9 @@ import Message from 'primevue/message'
 import { ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
 import type { ConfirmationDialogType } from '@/services/dialogService'
 import { useDialogStore } from '@/stores/dialogStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 const props = defineProps<{
   message: string

src/components/dialog/content/LoadWorkflowWarning.vue

@@ -60,9 +60,9 @@ import NoResultsPlaceholder from '@/components/common/NoResultsPlaceholder.vue'
 import MissingCoreNodesMessage from '@/components/dialog/content/MissingCoreNodesMessage.vue'
 import { useMissingNodes } from '@/composables/nodePack/useMissingNodes'
 import { useManagerState } from '@/composables/useManagerState'
-import { useToastStore } from '@/platform/updates/common/toastStore'
 import { useComfyManagerStore } from '@/stores/comfyManagerStore'
 import { useDialogStore } from '@/stores/dialogStore'
+import { useToastStore } from '@/stores/toastStore'
 import type { MissingNodeType } from '@/types/comfy'
 import { ManagerTab } from '@/types/comfyManagerTypes'
 

src/components/dialog/content/MissingModelsWarning.vue

@@ -39,7 +39,7 @@ import { useI18n } from 'vue-i18n'
 import ElectronFileDownload from '@/components/common/ElectronFileDownload.vue'
 import FileDownload from '@/components/common/FileDownload.vue'
 import NoResultsPlaceholder from '@/components/common/NoResultsPlaceholder.vue'
-import { useSettingStore } from '@/platform/settings/settingStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { isElectron } from '@/utils/envUtil'
 
 // TODO: Read this from server internal API rather than hardcoding here

src/components/dialog/content/SettingDialogContent.vue

@@ -66,17 +66,18 @@ import Tabs from 'primevue/tabs'
 import { computed, watch } from 'vue'
 
 import SearchBox from '@/components/common/SearchBox.vue'
-import CurrentUserMessage from '@/components/dialog/content/setting/CurrentUserMessage.vue'
-import PanelTemplate from '@/components/dialog/content/setting/PanelTemplate.vue'
 import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
-import ColorPaletteMessage from '@/platform/settings/components/ColorPaletteMessage.vue'
-import SettingsPanel from '@/platform/settings/components/SettingsPanel.vue'
-import { useSettingSearch } from '@/platform/settings/composables/useSettingSearch'
-import { useSettingUI } from '@/platform/settings/composables/useSettingUI'
-import { SettingTreeNode } from '@/platform/settings/settingStore'
-import { ISettingGroup, SettingParams } from '@/platform/settings/types'
+import { useSettingSearch } from '@/composables/setting/useSettingSearch'
+import { useSettingUI } from '@/composables/setting/useSettingUI'
+import { SettingTreeNode } from '@/stores/settingStore'
+import { ISettingGroup, SettingParams } from '@/types/settingTypes'
 import { flattenTree } from '@/utils/treeUtil'
 
+import ColorPaletteMessage from './setting/ColorPaletteMessage.vue'
+import CurrentUserMessage from './setting/CurrentUserMessage.vue'
+import PanelTemplate from './setting/PanelTemplate.vue'
+import SettingsPanel from './setting/SettingsPanel.vue'
+
 const { defaultPanel } = defineProps<{
   defaultPanel?:
     | 'about'

src/components/dialog/content/setting/ColorPaletteMessage.vue

@@ -43,8 +43,8 @@ import Button from 'primevue/button'
 import Message from 'primevue/message'
 import Select from 'primevue/select'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { useColorPaletteService } from '@/services/colorPaletteService'
+import { useSettingStore } from '@/stores/settingStore'
 import { useColorPaletteStore } from '@/stores/workspace/colorPaletteStore'
 
 const settingStore = useSettingStore()

src/components/dialog/content/setting/ExtensionPanel.vue

@@ -92,9 +92,10 @@ import ToggleSwitch from 'primevue/toggleswitch'
 import { computed, onMounted, ref } from 'vue'
 
 import SearchBox from '@/components/common/SearchBox.vue'
-import PanelTemplate from '@/components/dialog/content/setting/PanelTemplate.vue'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { useExtensionStore } from '@/stores/extensionStore'
+import { useSettingStore } from '@/stores/settingStore'
+
+import PanelTemplate from './PanelTemplate.vue'
 
 const filterTypes = ['All', 'Core', 'Custom']
 const filterType = ref('All')

src/components/dialog/content/setting/ServerConfigPanel.vue

@@ -74,14 +74,15 @@ import { watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import FormItem from '@/components/common/FormItem.vue'
-import PanelTemplate from '@/components/dialog/content/setting/PanelTemplate.vue'
 import { useCopyToClipboard } from '@/composables/useCopyToClipboard'
 import type { ServerConfig } from '@/constants/serverConfig'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import type { FormItem as FormItemType } from '@/platform/settings/types'
 import { useServerConfigStore } from '@/stores/serverConfigStore'
+import { useSettingStore } from '@/stores/settingStore'
+import type { FormItem as FormItemType } from '@/types/settingTypes'
 import { electronAPI } from '@/utils/envUtil'
 
+import PanelTemplate from './PanelTemplate.vue'
+
 const settingStore = useSettingStore()
 const serverConfigStore = useServerConfigStore()
 const {

src/components/dialog/content/setting/SettingGroup.vue

@@ -19,8 +19,8 @@
 <script setup lang="ts">
 import Divider from 'primevue/divider'
 
-import SettingItem from '@/platform/settings/components/SettingItem.vue'
-import { SettingParams } from '@/platform/settings/types'
+import SettingItem from '@/components/dialog/content/setting/SettingItem.vue'
+import { SettingParams } from '@/types/settingTypes'
 import { normalizeI18nKey } from '@/utils/formatUtil'
 
 defineProps<{

src/components/dialog/content/setting/SettingItem.spec.ts

@@ -6,7 +6,7 @@ import Tooltip from 'primevue/tooltip'
 import { describe, expect, it, vi } from 'vitest'
 import { createI18n } from 'vue-i18n'
 
-import SettingItem from '@/platform/settings/components/SettingItem.vue'
+import SettingItem from './SettingItem.vue'
 
 const i18n = createI18n({
   legacy: false,

src/components/dialog/content/setting/SettingItem.vue

@@ -29,8 +29,8 @@ import { useI18n } from 'vue-i18n'
 
 import FormItem from '@/components/common/FormItem.vue'
 import { st } from '@/i18n'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import type { SettingOption, SettingParams } from '@/platform/settings/types'
+import { useSettingStore } from '@/stores/settingStore'
+import type { SettingOption, SettingParams } from '@/types/settingTypes'
 import { normalizeI18nKey } from '@/utils/formatUtil'
 
 const props = defineProps<{

src/components/dialog/content/setting/SettingsPanel.vue

@@ -17,8 +17,9 @@
 
 <script setup lang="ts">
 import NoResultsPlaceholder from '@/components/common/NoResultsPlaceholder.vue'
-import SettingGroup from '@/platform/settings/components/SettingGroup.vue'
-import { ISettingGroup } from '@/platform/settings/types'
+import { ISettingGroup } from '@/types/settingTypes'
+
+import SettingGroup from './SettingGroup.vue'
 
 const props = defineProps<{
   settingGroups: ISettingGroup[]

src/components/dialog/footer/ManagerProgressFooter.vue

@@ -75,16 +75,16 @@ import { useI18n } from 'vue-i18n'
 
 import DotSpinner from '@/components/common/DotSpinner.vue'
 import { useConflictDetection } from '@/composables/useConflictDetection'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useWorkflowService } from '@/platform/workflow/core/services/workflowService'
 import { api } from '@/scripts/api'
 import { useComfyManagerService } from '@/services/comfyManagerService'
+import { useWorkflowService } from '@/services/workflowService'
 import {
   useComfyManagerStore,
   useManagerProgressDialogStore
 } from '@/stores/comfyManagerStore'
 import { useCommandStore } from '@/stores/commandStore'
 import { useDialogStore } from '@/stores/dialogStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 const { t } = useI18n()
 const dialogStore = useDialogStore()

src/components/graph/DomWidgets.vue

@@ -16,8 +16,8 @@ import { computed } from 'vue'
 
 import DomWidget from '@/components/graph/widgets/DomWidget.vue'
 import { useChainCallback } from '@/composables/functional/useChainCallback'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useDomWidgetStore } from '@/stores/domWidgetStore'
+import { useCanvasStore } from '@/stores/graphStore'
 
 const domWidgetStore = useDomWidgetStore()
 

src/components/graph/GraphCanvas.vue

@@ -104,21 +104,16 @@ import { useCanvasDrop } from '@/composables/useCanvasDrop'
 import { useContextMenuTranslation } from '@/composables/useContextMenuTranslation'
 import { useCopy } from '@/composables/useCopy'
 import { useGlobalLitegraph } from '@/composables/useGlobalLitegraph'
+import { useLitegraphSettings } from '@/composables/useLitegraphSettings'
 import { usePaste } from '@/composables/usePaste'
 import { useVueFeatureFlags } from '@/composables/useVueFeatureFlags'
+import { useWorkflowAutoSave } from '@/composables/useWorkflowAutoSave'
+import { useWorkflowPersistence } from '@/composables/useWorkflowPersistence'
+import { CORE_SETTINGS } from '@/constants/coreSettings'
 import { i18n, t } from '@/i18n'
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
-import { useLitegraphSettings } from '@/platform/settings/composables/useLitegraphSettings'
-import { CORE_SETTINGS } from '@/platform/settings/constants/coreSettings'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useToastStore } from '@/platform/updates/common/toastStore'
-import { useWorkflowService } from '@/platform/workflow/core/services/workflowService'
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
-import { useWorkflowAutoSave } from '@/platform/workflow/persistence/composables/useWorkflowAutoSave'
-import { useWorkflowPersistence } from '@/platform/workflow/persistence/composables/useWorkflowPersistence'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { SelectedNodeIdsKey } from '@/renderer/core/canvas/injectionKeys'
-import TransformPane from '@/renderer/core/layout/transform/TransformPane.vue'
+import TransformPane from '@/renderer/core/layout/TransformPane.vue'
 import MiniMap from '@/renderer/extensions/minimap/MiniMap.vue'
 import VueGraphNode from '@/renderer/extensions/vueNodes/components/LGraphNode.vue'
 import { useNodeEventHandlers } from '@/renderer/extensions/vueNodes/composables/useNodeEventHandlers'
@@ -129,9 +124,14 @@ import { ChangeTracker } from '@/scripts/changeTracker'
 import { IS_CONTROL_WIDGET, updateControlWidgetLabel } from '@/scripts/widgets'
 import { useColorPaletteService } from '@/services/colorPaletteService'
 import { newUserService } from '@/services/newUserService'
+import { useWorkflowService } from '@/services/workflowService'
 import { useCommandStore } from '@/stores/commandStore'
 import { useExecutionStore } from '@/stores/executionStore'
+import { useCanvasStore } from '@/stores/graphStore'
 import { useNodeDefStore } from '@/stores/nodeDefStore'
+import { useSettingStore } from '@/stores/settingStore'
+import { useToastStore } from '@/stores/toastStore'
+import { useWorkflowStore } from '@/stores/workflowStore'
 import { useColorPaletteStore } from '@/stores/workspace/colorPaletteStore'
 import { useSearchBoxStore } from '@/stores/workspace/searchBoxStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
@@ -431,9 +431,7 @@ onMounted(async () => {
   workflowPersistence.restoreWorkflowTabsState()
 
   // Initialize release store to fetch releases from comfy-api (fire-and-forget)
-  const { useReleaseStore } = await import(
-    '@/platform/updates/common/releaseStore'
-  )
+  const { useReleaseStore } = await import('@/stores/releaseStore')
   const releaseStore = useReleaseStore()
   void releaseStore.initialize()
 

src/components/graph/GraphCanvasMenu.vue

@@ -127,10 +127,10 @@ import { useI18n } from 'vue-i18n'
 import { useCanvasInteractions } from '@/composables/graph/useCanvasInteractions'
 import { useZoomControls } from '@/composables/useZoomControls'
 import { LiteGraph } from '@/lib/litegraph/src/litegraph'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useMinimap } from '@/renderer/extensions/minimap/composables/useMinimap'
 import { useCommandStore } from '@/stores/commandStore'
+import { useCanvasStore } from '@/stores/graphStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 
 import ZoomControlsModal from './modals/ZoomControlsModal.vue'

src/components/graph/NodeTooltip.vue

@@ -19,10 +19,10 @@ import {
   isOverNodeInput,
   isOverNodeOutput
 } from '@/lib/litegraph/src/litegraph'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { app as comfyApp } from '@/scripts/app'
 import { isDOMWidget } from '@/scripts/domWidget'
 import { useNodeDefStore } from '@/stores/nodeDefStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { normalizeI18nKey } from '@/utils/formatUtil'
 
 let idleTimeout: number

src/components/graph/SelectionToolbox.spec.ts

@@ -6,8 +6,8 @@ import { createI18n } from 'vue-i18n'
 
 import SelectionToolbox from '@/components/graph/SelectionToolbox.vue'
 import { useCanvasInteractions } from '@/composables/graph/useCanvasInteractions'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useExtensionService } from '@/services/extensionService'
+import { useCanvasStore } from '@/stores/graphStore'
 
 // Mock the composables and services
 vi.mock('@/composables/graph/useCanvasInteractions', () => ({
@@ -57,7 +57,7 @@ vi.mock('@/utils/nodeFilterUtil', () => ({
   filterOutputNodes: vi.fn((nodes) => nodes.filter(() => false))
 }))
 
-vi.mock('@/platform/settings/settingStore', () => ({
+vi.mock('@/stores/settingStore', () => ({
   useSettingStore: () => ({
     get: vi.fn((key: string) => {
       if (key === 'Comfy.Load3D.3DViewerEnable') return true

src/components/graph/SelectionToolbox.vue

@@ -62,10 +62,10 @@ import PublishSubgraphButton from '@/components/graph/selectionToolbox/SaveToSub
 import { useSelectionToolboxPosition } from '@/composables/canvas/useSelectionToolboxPosition'
 import { useCanvasInteractions } from '@/composables/graph/useCanvasInteractions'
 import { useSelectionState } from '@/composables/graph/useSelectionState'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useMinimap } from '@/renderer/extensions/minimap/composables/useMinimap'
 import { useExtensionService } from '@/services/extensionService'
 import { type ComfyCommandImpl, useCommandStore } from '@/stores/commandStore'
+import { useCanvasStore } from '@/stores/graphStore'
 
 import FrameNodes from './selectionToolbox/FrameNodes.vue'
 import MoreOptions from './selectionToolbox/MoreOptions.vue'

src/components/graph/TitleEditor.vue

@@ -24,12 +24,9 @@ import {
   LiteGraph
 } from '@/lib/litegraph/src/litegraph'
 import type { LiteGraphCanvasEvent } from '@/lib/litegraph/src/litegraph'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import {
-  useCanvasStore,
-  useTitleEditorStore
-} from '@/renderer/core/canvas/canvasStore'
 import { app } from '@/scripts/app'
+import { useCanvasStore, useTitleEditorStore } from '@/stores/graphStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 const settingStore = useSettingStore()
 

src/components/graph/modals/ZoomControlsModal.vue

@@ -139,10 +139,10 @@ import { Button, InputNumber, InputNumberInputEvent } from 'primevue'
 import { computed, nextTick, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useMinimap } from '@/renderer/extensions/minimap/composables/useMinimap'
 import { useCommandStore } from '@/stores/commandStore'
+import { useCanvasStore } from '@/stores/graphStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 const { t } = useI18n()
 const minimap = useMinimap()

src/components/graph/selectionToolbox/BypassButton.spec.ts

@@ -7,8 +7,8 @@ import { createI18n } from 'vue-i18n'
 
 import BypassButton from '@/components/graph/selectionToolbox/BypassButton.vue'
 import { LGraphEventMode } from '@/lib/litegraph/src/litegraph'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useCommandStore } from '@/stores/commandStore'
+import { useCanvasStore } from '@/stores/graphStore'
 
 const mockLGraphNode = {
   type: 'TestNode',

src/components/graph/selectionToolbox/ColorPickerButton.spec.ts

@@ -7,8 +7,8 @@ import { createI18n } from 'vue-i18n'
 
 // Import after mocks
 import ColorPickerButton from '@/components/graph/selectionToolbox/ColorPickerButton.vue'
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
+import { useCanvasStore } from '@/stores/graphStore'
+import { useWorkflowStore } from '@/stores/workflowStore'
 
 // Mock the litegraph module
 vi.mock('@/lib/litegraph/src/litegraph', async () => {

src/components/graph/selectionToolbox/ColorPickerButton.vue

@@ -62,8 +62,8 @@ import {
   LiteGraph,
   isColorable
 } from '@/lib/litegraph/src/litegraph'
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
+import { useCanvasStore } from '@/stores/graphStore'
+import { useWorkflowStore } from '@/stores/workflowStore'
 import { useColorPaletteStore } from '@/stores/workspace/colorPaletteStore'
 import { adjustColor } from '@/utils/colorUtil'
 import { getItemsColorOption } from '@/utils/litegraphUtil'

src/components/graph/selectionToolbox/ExecuteButton.spec.ts

@@ -6,11 +6,11 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { createI18n } from 'vue-i18n'
 
 import ExecuteButton from '@/components/graph/selectionToolbox/ExecuteButton.vue'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useCommandStore } from '@/stores/commandStore'
+import { useCanvasStore } from '@/stores/graphStore'
 
 // Mock the stores
-vi.mock('@/renderer/core/canvas/canvasStore', () => ({
+vi.mock('@/stores/graphStore', () => ({
   useCanvasStore: vi.fn()
 }))
 

src/components/graph/selectionToolbox/ExecuteButton.vue

@@ -21,8 +21,8 @@ import { useI18n } from 'vue-i18n'
 
 import { useSelectionState } from '@/composables/graph/useSelectionState'
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useCommandStore } from '@/stores/commandStore'
+import { useCanvasStore } from '@/stores/graphStore'
 import { isLGraphNode } from '@/utils/litegraphUtil'
 import { isOutputNode } from '@/utils/nodeFilterUtil'
 

src/components/graph/selectionToolbox/InfoButton.spec.ts

@@ -7,7 +7,7 @@ import { createI18n } from 'vue-i18n'
 
 import InfoButton from '@/components/graph/selectionToolbox/InfoButton.vue'
 // NOTE: The component import must come after mocks so they take effect.
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
+import { useCanvasStore } from '@/stores/graphStore'
 import { useNodeDefStore } from '@/stores/nodeDefStore'
 
 const mockLGraphNode = {

src/components/graph/selectionToolbox/SaveToSubgraphLibrary.vue

@@ -21,8 +21,8 @@ import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import { SubgraphNode } from '@/lib/litegraph/src/litegraph'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useCommandStore } from '@/stores/commandStore'
+import { useCanvasStore } from '@/stores/graphStore'
 
 const { t } = useI18n()
 const commandStore = useCommandStore()

src/components/graph/widgets/DomWidget.vue

@@ -23,10 +23,10 @@ import { CSSProperties, computed, nextTick, onMounted, ref, watch } from 'vue'
 
 import { useAbsolutePosition } from '@/composables/element/useAbsolutePosition'
 import { useDomClipping } from '@/composables/element/useDomClipping'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { isComponentWidget, isDOMWidget } from '@/scripts/domWidget'
 import { DomWidgetState } from '@/stores/domWidgetStore'
+import { useCanvasStore } from '@/stores/graphStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 const { widgetState } = defineProps<{
   widgetState: DomWidgetState

src/components/helpcenter/HelpCenterMenuContent.vue

@@ -143,10 +143,10 @@ import { useI18n } from 'vue-i18n'
 import PuzzleIcon from '@/components/icons/PuzzleIcon.vue'
 import { useConflictAcknowledgment } from '@/composables/useConflictAcknowledgment'
 import { useManagerState } from '@/composables/useManagerState'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { type ReleaseNote } from '@/platform/updates/common/releaseService'
-import { useReleaseStore } from '@/platform/updates/common/releaseStore'
+import { type ReleaseNote } from '@/services/releaseService'
 import { useCommandStore } from '@/stores/commandStore'
+import { useReleaseStore } from '@/stores/releaseStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { ManagerTab } from '@/types/comfyManagerTypes'
 import { electronAPI, isElectron } from '@/utils/envUtil'
 import { formatVersionAnchor } from '@/utils/formatUtil'

src/components/helpcenter/ReleaseNotificationToast.vue

@@ -48,11 +48,10 @@
 import { computed, onMounted, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 
+import type { ReleaseNote } from '@/services/releaseService'
+import { useReleaseStore } from '@/stores/releaseStore'
 import { formatVersionAnchor } from '@/utils/formatUtil'
 
-import type { ReleaseNote } from '../common/releaseService'
-import { useReleaseStore } from '../common/releaseStore'
-
 const { locale } = useI18n()
 const releaseStore = useReleaseStore()
 

src/components/helpcenter/WhatsNewPopup.vue

@@ -68,11 +68,10 @@ import { marked } from 'marked'
 import { computed, onMounted, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
+import type { ReleaseNote } from '@/services/releaseService'
+import { useReleaseStore } from '@/stores/releaseStore'
 import { formatVersionAnchor } from '@/utils/formatUtil'
 
-import type { ReleaseNote } from '../common/releaseService'
-import { useReleaseStore } from '../common/releaseStore'
-
 const { locale, t } = useI18n()
 const releaseStore = useReleaseStore()
 

src/components/input/MultiSelect.accessibility.stories.ts

@@ -1,380 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3-vite'
-import type { MultiSelectProps } from 'primevue/multiselect'
-import { ref } from 'vue'
-
-import MultiSelect from './MultiSelect.vue'
-import { type SelectOption } from './types'
-
-// Combine our component props with PrimeVue MultiSelect props
-interface ExtendedProps extends Partial<MultiSelectProps> {
-  // Our custom props
-  label?: string
-  showSearchBox?: boolean
-  showSelectedCount?: boolean
-  showClearButton?: boolean
-  searchPlaceholder?: string
-  listMaxHeight?: string
-  popoverMinWidth?: string
-  popoverMaxWidth?: string
-  // Override modelValue type to match our Option type
-  modelValue?: SelectOption[]
-}
-
-const meta: Meta<ExtendedProps> = {
-  title: 'Components/Input/MultiSelect/Accessibility',
-  component: MultiSelect,
-  tags: ['autodocs'],
-  parameters: {
-    docs: {
-      description: {
-        component: `
-# MultiSelect Accessibility Guide
-
-This MultiSelect component provides full keyboard accessibility and screen reader support following WCAG 2.1 AA guidelines.
-
-## Keyboard Navigation
-
-- **Tab** - Focus the trigger button
-- **Enter/Space** - Open/close dropdown when focused
-- **Arrow Up/Down** - Navigate through options when dropdown is open
-- **Enter/Space** - Select/deselect options when navigating
-- **Escape** - Close dropdown
-
-## Screen Reader Support
-
-- Uses \`role="combobox"\` to identify as dropdown
-- \`aria-haspopup="listbox"\` indicates popup contains list
-- \`aria-expanded\` shows dropdown state
-- \`aria-label\` provides accessible name with i18n fallback
-- Selected count announced to screen readers
-
-## Testing Instructions
-
-1. **Tab Navigation**: Use Tab key to focus the component
-2. **Keyboard Opening**: Press Enter or Space to open dropdown
-3. **Option Navigation**: Use Arrow keys to navigate options
-4. **Selection**: Press Enter/Space to select options
-5. **Closing**: Press Escape to close dropdown
-6. **Screen Reader**: Test with screen reader software
-
-Try these stories with keyboard-only navigation!
-        `
-      }
-    }
-  },
-  argTypes: {
-    label: {
-      control: 'text',
-      description: 'Label for the trigger button'
-    },
-    showSearchBox: {
-      control: 'boolean',
-      description: 'Show search box in dropdown header'
-    },
-    showSelectedCount: {
-      control: 'boolean',
-      description: 'Show selected count in dropdown header'
-    },
-    showClearButton: {
-      control: 'boolean',
-      description: 'Show clear all button in dropdown header'
-    }
-  }
-}
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-const frameworkOptions = [
-  { name: 'React', value: 'react' },
-  { name: 'Vue', value: 'vue' },
-  { name: 'Angular', value: 'angular' },
-  { name: 'Svelte', value: 'svelte' },
-  { name: 'TypeScript', value: 'typescript' },
-  { name: 'JavaScript', value: 'javascript' }
-]
-
-export const KeyboardNavigationDemo: Story = {
-  render: (args) => ({
-    components: { MultiSelect },
-    setup() {
-      const selectedFrameworks = ref<SelectOption[]>([])
-      const searchQuery = ref('')
-
-      return {
-        args: {
-          ...args,
-          options: frameworkOptions,
-          modelValue: selectedFrameworks,
-          'onUpdate:modelValue': (value: SelectOption[]) => {
-            selectedFrameworks.value = value
-          },
-          'onUpdate:searchQuery': (value: string) => {
-            searchQuery.value = value
-          }
-        },
-        selectedFrameworks,
-        searchQuery
-      }
-    },
-    template: `
-      <div class="space-y-4 p-4">
-        <div class="bg-blue-50 dark-theme:bg-blue-900/20 border border-blue-200 dark-theme:border-blue-700 rounded-lg p-4">
-          <h3 class="text-lg font-semibold mb-2">🎯 Keyboard Navigation Test</h3>
-          <p class="text-sm text-gray-600 dark-theme:text-gray-300 mb-4">
-            Use your keyboard to navigate this MultiSelect:
-          </p>
-          <ol class="text-sm text-gray-600 list-decimal list-inside space-y-1">
-            <li><strong>Tab</strong> to focus the dropdown</li>
-            <li><strong>Enter/Space</strong> to open dropdown</li>
-            <li><strong>Arrow Up/Down</strong> to navigate options</li>
-            <li><strong>Enter/Space</strong> to select options</li>
-            <li><strong>Escape</strong> to close dropdown</li>
-          </ol>
-        </div>
-
-        <div class="space-y-2">
-          <label class="block text-sm font-medium text-gray-700">
-            Select Frameworks (Keyboard Navigation Test)
-          </label>
-          <MultiSelect v-bind="args" class="w-80" />
-          <p class="text-xs text-gray-500">
-            Selected: {{ selectedFrameworks.map(f => f.name).join(', ') || 'None' }}
-          </p>
-        </div>
-      </div>
-    `
-  }),
-  args: {
-    label: 'Choose Frameworks',
-    showSearchBox: true,
-    showSelectedCount: true,
-    showClearButton: true
-  }
-}
-
-export const ScreenReaderFriendly: Story = {
-  render: (args) => ({
-    components: { MultiSelect },
-    setup() {
-      const selectedColors = ref<SelectOption[]>([])
-      const selectedSizes = ref<SelectOption[]>([])
-
-      const colorOptions = [
-        { name: 'Red', value: 'red' },
-        { name: 'Blue', value: 'blue' },
-        { name: 'Green', value: 'green' },
-        { name: 'Yellow', value: 'yellow' }
-      ]
-
-      const sizeOptions = [
-        { name: 'Small', value: 'sm' },
-        { name: 'Medium', value: 'md' },
-        { name: 'Large', value: 'lg' },
-        { name: 'Extra Large', value: 'xl' }
-      ]
-
-      return {
-        selectedColors,
-        selectedSizes,
-        colorOptions,
-        sizeOptions,
-        args
-      }
-    },
-    template: `
-      <div class="space-y-6 p-4">
-        <div class="bg-green-50 dark-theme:bg-green-900/20 border border-green-200 dark-theme:border-green-700 rounded-lg p-4">
-          <h3 class="text-lg font-semibold mb-2">♿ Screen Reader Test</h3>
-          <p class="text-sm text-gray-600 mb-2">
-            These dropdowns have proper ARIA attributes and labels for screen readers:
-          </p>
-          <ul class="text-sm text-gray-600 list-disc list-inside space-y-1">
-            <li><code>role="combobox"</code> identifies as dropdown</li>
-            <li><code>aria-haspopup="listbox"</code> indicates popup type</li>
-            <li><code>aria-expanded</code> shows open/closed state</li>
-            <li><code>aria-label</code> provides accessible name</li>
-            <li>Selection count announced to assistive technology</li>
-          </ul>
-        </div>
-
-        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
-          <div class="space-y-2">
-            <label class="block text-sm font-medium text-gray-700">
-              Color Preferences
-            </label>
-            <MultiSelect
-              v-model="selectedColors"
-              :options="colorOptions"
-              label="Select colors"
-              :show-selected-count="true"
-              :show-clear-button="true"
-              class="w-full"
-            />
-            <p class="text-xs text-gray-500" aria-live="polite">
-              {{ selectedColors.length }} color(s) selected
-            </p>
-          </div>
-
-          <div class="space-y-2">
-            <label class="block text-sm font-medium text-gray-700">
-              Size Preferences
-            </label>
-            <MultiSelect
-              v-model="selectedSizes"
-              :options="sizeOptions"
-              label="Select sizes"
-              :show-selected-count="true"
-              :show-search-box="true"
-              class="w-full"
-            />
-            <p class="text-xs text-gray-500" aria-live="polite">
-              {{ selectedSizes.length }} size(s) selected
-            </p>
-          </div>
-        </div>
-      </div>
-    `
-  })
-}
-
-export const FocusManagement: Story = {
-  render: (args) => ({
-    components: { MultiSelect },
-    setup() {
-      const selectedItems = ref<SelectOption[]>([])
-      const focusTestOptions = [
-        { name: 'Option A', value: 'a' },
-        { name: 'Option B', value: 'b' },
-        { name: 'Option C', value: 'c' }
-      ]
-
-      return {
-        selectedItems,
-        focusTestOptions,
-        args
-      }
-    },
-    template: `
-      <div class="space-y-4 p-4">
-        <div class="bg-purple-50 dark-theme:bg-purple-900/20 border border-purple-200 dark-theme:border-purple-700 rounded-lg p-4">
-          <h3 class="text-lg font-semibold mb-2">🎯 Focus Management Test</h3>
-          <p class="text-sm text-gray-600 dark-theme:text-gray-300 mb-4">
-            Test focus behavior with multiple form elements:
-          </p>
-        </div>
-
-        <div class="space-y-4">
-          <div>
-            <label class="block text-sm font-medium text-gray-700 mb-1">
-              Before MultiSelect
-            </label>
-            <input
-              type="text"
-              placeholder="Previous field"
-              class="block w-64 px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
-            />
-          </div>
-
-          <div>
-            <label class="block text-sm font-medium text-gray-700 mb-1">
-              MultiSelect (Test Focus Ring)
-            </label>
-            <MultiSelect
-              v-model="selectedItems"
-              :options="focusTestOptions"
-              label="Focus test dropdown"
-              :show-selected-count="true"
-              class="w-64"
-            />
-          </div>
-
-          <div>
-            <label class="block text-sm font-medium text-gray-700 mb-1">
-              After MultiSelect
-            </label>
-            <input
-              type="text"
-              placeholder="Next field"
-              class="block w-64 px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
-            />
-          </div>
-
-          <button
-            class="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
-          >
-            Submit Button
-          </button>
-        </div>
-
-        <div class="text-sm text-gray-600 mt-4">
-          <strong>Test:</strong> Tab through all elements and verify focus rings are visible and logical.
-        </div>
-      </div>
-    `
-  })
-}
-
-export const AccessibilityChecklist: Story = {
-  render: () => ({
-    template: `
-      <div class="max-w-4xl mx-auto p-6 space-y-6">
-        <div class="bg-gray-50 dark-theme:bg-zinc-800 border border-gray-200 dark-theme:border-zinc-700 rounded-lg p-6">
-          <h2 class="text-2xl font-bold mb-4">♿ MultiSelect Accessibility Checklist</h2>
-
-          <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
-            <div>
-              <h3 class="text-lg font-semibold mb-3 text-green-700">✅ Implemented Features</h3>
-              <ul class="space-y-2 text-sm">
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>Keyboard Navigation:</strong> Tab, Enter, Space, Arrow keys, Escape</span>
-                </li>
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>ARIA Attributes:</strong> role, aria-haspopup, aria-expanded, aria-label</span>
-                </li>
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>Focus Management:</strong> Visible focus rings and logical tab order</span>
-                </li>
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>Internationalization:</strong> Translatable aria-label fallbacks</span>
-                </li>
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>Screen Reader Support:</strong> Proper announcements and state</span>
-                </li>
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>Color Contrast:</strong> Meets WCAG AA requirements</span>
-                </li>
-              </ul>
-            </div>
-
-            <div>
-              <h3 class="text-lg font-semibold mb-3 text-blue-700">📋 Testing Guidelines</h3>
-              <ol class="space-y-2 text-sm list-decimal list-inside">
-                <li><strong>Keyboard Only:</strong> Navigate using only keyboard</li>
-                <li><strong>Screen Reader:</strong> Test with NVDA, JAWS, or VoiceOver</li>
-                <li><strong>Focus Visible:</strong> Ensure focus rings are always visible</li>
-                <li><strong>Tab Order:</strong> Verify logical progression</li>
-                <li><strong>Announcements:</strong> Check state changes are announced</li>
-                <li><strong>Escape Behavior:</strong> Escape always closes dropdown</li>
-              </ol>
-            </div>
-          </div>
-
-          <div class="mt-6 p-4 bg-blue-50 dark-theme:bg-blue-900/20 border border-blue-200 dark-theme:border-blue-700 rounded-lg">
-            <h4 class="font-semibold mb-2">🎯 Quick Test</h4>
-            <p class="text-sm text-gray-700 dark-theme:text-gray-300">
-              Close your eyes, use only the keyboard, and try to select multiple options from any dropdown above.
-              If you can successfully navigate and make selections, the accessibility implementation is working!
-            </p>
-          </div>
-        </div>
-      </div>
-    `
-  })
-}

src/components/input/MultiSelect.stories.ts

@@ -3,7 +3,6 @@ import type { MultiSelectProps } from 'primevue/multiselect'
 import { ref } from 'vue'
 
 import MultiSelect from './MultiSelect.vue'
-import { type SelectOption } from './types'
 
 // Combine our component props with PrimeVue MultiSelect props
 // Since we use v-bind="$attrs", all PrimeVue props are available
@@ -18,7 +17,7 @@ interface ExtendedProps extends Partial<MultiSelectProps> {
   popoverMinWidth?: string
   popoverMaxWidth?: string
   // Override modelValue type to match our Option type
-  modelValue?: SelectOption[]
+  modelValue?: Array<{ name: string; value: string }>
 }
 
 const meta: Meta<ExtendedProps> = {

src/components/input/MultiSelect.vue

@@ -14,11 +14,6 @@
     unstyled
     :max-selected-labels="0"
     :pt="pt"
-    :aria-label="label || t('g.multiSelectDropdown')"
-    role="combobox"
-    :aria-expanded="false"
-    aria-haspopup="listbox"
-    :tabindex="0"
   >
     <template
       v-if="showSearchBox || showSelectedCount || showClearButton"
@@ -110,16 +105,14 @@ import MultiSelect, {
   MultiSelectPassThroughMethodOptions
 } from 'primevue/multiselect'
 import { computed } from 'vue'
-import { useI18n } from 'vue-i18n'
 
 import SearchBox from '@/components/input/SearchBox.vue'
 import { usePopoverSizing } from '@/composables/usePopoverSizing'
 import { cn } from '@/utils/tailwindUtil'
 
 import TextButton from '../button/TextButton.vue'
-import { type SelectOption } from './types'
 
-type Option = SelectOption
+type Option = { name: string; value: string }
 
 defineOptions({
   inheritAttrs: false
@@ -160,8 +153,6 @@ const selectedItems = defineModel<Option[]>({
   required: true
 })
 const searchQuery = defineModel<string>('searchQuery')
-
-const { t } = useI18n()
 const selectedCount = computed(() => selectedItems.value.length)
 
 const popoverStyle = usePopoverSizing({
@@ -171,7 +162,7 @@ const popoverStyle = usePopoverSizing({
 
 const pt = computed(() => ({
   root: ({ props }: MultiSelectPassThroughMethodOptions) => ({
-    class: cn(
+    class: [
       'h-10 relative inline-flex cursor-pointer select-none',
       'rounded-lg bg-white dark-theme:bg-zinc-800 text-neutral dark-theme:text-white',
       'transition-all duration-200 ease-in-out',
@@ -179,9 +170,8 @@ const pt = computed(() => ({
       selectedCount.value > 0
         ? 'border-blue-400 dark-theme:border-blue-500'
         : 'border-transparent',
-      'focus-within:border-blue-400 dark-theme:focus-within:border-blue-500',
       { 'opacity-60 cursor-default': props.disabled }
-    )
+    ]
   }),
   labelContainer: {
     class:

src/components/input/SingleSelect.accessibility.stories.ts

@@ -1,464 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3-vite'
-import { ref } from 'vue'
-
-import SingleSelect from './SingleSelect.vue'
-
-interface SingleSelectProps {
-  label?: string
-  options?: Array<{ name: string; value: string }>
-  listMaxHeight?: string
-  popoverMinWidth?: string
-  popoverMaxWidth?: string
-  modelValue?: string | null
-}
-
-const meta: Meta<SingleSelectProps> = {
-  title: 'Components/Input/SingleSelect/Accessibility',
-  component: SingleSelect,
-  tags: ['autodocs'],
-  parameters: {
-    docs: {
-      description: {
-        component: `
-# SingleSelect Accessibility Guide
-
-This SingleSelect component provides full keyboard accessibility and screen reader support following WCAG 2.1 AA guidelines.
-
-## Keyboard Navigation
-
-- **Tab** - Focus the trigger button
-- **Enter/Space** - Open/close dropdown when focused
-- **Arrow Up/Down** - Navigate through options when dropdown is open
-- **Enter/Space** - Select option when navigating
-- **Escape** - Close dropdown
-
-## Screen Reader Support
-
-- Uses \`role="combobox"\` to identify as dropdown
-- \`aria-haspopup="listbox"\` indicates popup contains list
-- \`aria-expanded\` shows dropdown state
-- \`aria-label\` provides accessible name with i18n fallback
-- Selected option announced to screen readers
-
-## Testing Instructions
-
-1. **Tab Navigation**: Use Tab key to focus the component
-2. **Keyboard Opening**: Press Enter or Space to open dropdown
-3. **Option Navigation**: Use Arrow keys to navigate options
-4. **Selection**: Press Enter/Space to select an option
-5. **Closing**: Press Escape to close dropdown
-6. **Screen Reader**: Test with screen reader software
-
-Try these stories with keyboard-only navigation!
-        `
-      }
-    }
-  },
-  argTypes: {
-    label: {
-      control: 'text',
-      description: 'Label for the trigger button'
-    },
-    listMaxHeight: {
-      control: 'text',
-      description: 'Maximum height of dropdown list'
-    }
-  }
-}
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-const sortOptions = [
-  { name: 'Name A → Z', value: 'name-asc' },
-  { name: 'Name Z → A', value: 'name-desc' },
-  { name: 'Most Popular', value: 'popular' },
-  { name: 'Most Recent', value: 'recent' },
-  { name: 'File Size', value: 'size' }
-]
-
-const priorityOptions = [
-  { name: 'High Priority', value: 'high' },
-  { name: 'Medium Priority', value: 'medium' },
-  { name: 'Low Priority', value: 'low' },
-  { name: 'No Priority', value: 'none' }
-]
-
-export const KeyboardNavigationDemo: Story = {
-  render: (args) => ({
-    components: { SingleSelect },
-    setup() {
-      const selectedSort = ref<string | null>(null)
-      const selectedPriority = ref<string | null>('medium')
-
-      return {
-        args,
-        selectedSort,
-        selectedPriority,
-        sortOptions,
-        priorityOptions
-      }
-    },
-    template: `
-      <div class="space-y-6 p-4">
-        <div class="bg-blue-50 dark-theme:bg-blue-900/20 border border-blue-200 dark-theme:border-blue-700 rounded-lg p-4">
-          <h3 class="text-lg font-semibold mb-2">🎯 Keyboard Navigation Test</h3>
-          <p class="text-sm text-gray-600 dark-theme:text-gray-300 mb-4">
-            Use your keyboard to navigate these SingleSelect dropdowns:
-          </p>
-          <ol class="text-sm text-gray-600 dark-theme:text-gray-300 list-decimal list-inside space-y-1">
-            <li><strong>Tab</strong> to focus the dropdown</li>
-            <li><strong>Enter/Space</strong> to open dropdown</li>
-            <li><strong>Arrow Up/Down</strong> to navigate options</li>
-            <li><strong>Enter/Space</strong> to select option</li>
-            <li><strong>Escape</strong> to close dropdown</li>
-          </ol>
-        </div>
-
-        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
-          <div class="space-y-2">
-            <label class="block text-sm font-medium text-gray-700 dark-theme:text-gray-200">
-              Sort Order
-            </label>
-            <SingleSelect
-              v-model="selectedSort"
-              :options="sortOptions"
-              label="Choose sort order"
-              class="w-full"
-            />
-            <p class="text-xs text-gray-500">
-              Selected: {{ selectedSort ? sortOptions.find(o => o.value === selectedSort)?.name : 'None' }}
-            </p>
-          </div>
-
-          <div class="space-y-2">
-            <label class="block text-sm font-medium text-gray-700 dark-theme:text-gray-200">
-              Task Priority (With Icon)
-            </label>
-            <SingleSelect
-              v-model="selectedPriority"
-              :options="priorityOptions"
-              label="Set priority level"
-              class="w-full"
-            >
-              <template #icon>
-                <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
-                  <path fill-rule="evenodd" d="M3.172 5.172a4 4 0 015.656 0L10 6.343l1.172-1.171a4 4 0 115.656 5.656L10 17.657l-6.828-6.829a4 4 0 010-5.656z" clip-rule="evenodd" />
-                </svg>
-              </template>
-            </SingleSelect>
-            <p class="text-xs text-gray-500">
-              Selected: {{ selectedPriority ? priorityOptions.find(o => o.value === selectedPriority)?.name : 'None' }}
-            </p>
-          </div>
-        </div>
-      </div>
-    `
-  })
-}
-
-export const ScreenReaderFriendly: Story = {
-  render: (args) => ({
-    components: { SingleSelect },
-    setup() {
-      const selectedLanguage = ref<string | null>('en')
-      const selectedTheme = ref<string | null>(null)
-
-      const languageOptions = [
-        { name: 'English', value: 'en' },
-        { name: 'Spanish', value: 'es' },
-        { name: 'French', value: 'fr' },
-        { name: 'German', value: 'de' },
-        { name: 'Japanese', value: 'ja' }
-      ]
-
-      const themeOptions = [
-        { name: 'Light Theme', value: 'light' },
-        { name: 'Dark Theme', value: 'dark' },
-        { name: 'Auto (System)', value: 'auto' },
-        { name: 'High Contrast', value: 'contrast' }
-      ]
-
-      return {
-        selectedLanguage,
-        selectedTheme,
-        languageOptions,
-        themeOptions,
-        args
-      }
-    },
-    template: `
-      <div class="space-y-6 p-4">
-        <div class="bg-green-50 dark-theme:bg-green-900/20 border border-green-200 dark-theme:border-green-700 rounded-lg p-4">
-          <h3 class="text-lg font-semibold mb-2">♿ Screen Reader Test</h3>
-          <p class="text-sm text-gray-600 dark-theme:text-gray-300 mb-2">
-            These dropdowns have proper ARIA attributes and labels for screen readers:
-          </p>
-          <ul class="text-sm text-gray-600 dark-theme:text-gray-300 list-disc list-inside space-y-1">
-            <li><code>role="combobox"</code> identifies as dropdown</li>
-            <li><code>aria-haspopup="listbox"</code> indicates popup type</li>
-            <li><code>aria-expanded</code> shows open/closed state</li>
-            <li><code>aria-label</code> provides accessible name</li>
-            <li>Selected option value announced to assistive technology</li>
-          </ul>
-        </div>
-
-        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
-          <div class="space-y-2">
-            <label class="block text-sm font-medium text-gray-700 dark-theme:text-gray-200" id="language-label">
-              Preferred Language
-            </label>
-            <SingleSelect
-              v-model="selectedLanguage"
-              :options="languageOptions"
-              label="Select language"
-              class="w-full"
-              aria-labelledby="language-label"
-            />
-            <p class="text-xs text-gray-500" aria-live="polite">
-              Current: {{ selectedLanguage ? languageOptions.find(o => o.value === selectedLanguage)?.name : 'None selected' }}
-            </p>
-          </div>
-
-          <div class="space-y-2">
-            <label class="block text-sm font-medium text-gray-700 dark-theme:text-gray-200" id="theme-label">
-              Interface Theme
-            </label>
-            <SingleSelect
-              v-model="selectedTheme"
-              :options="themeOptions"
-              label="Select theme"
-              class="w-full"
-              aria-labelledby="theme-label"
-            />
-            <p class="text-xs text-gray-500" aria-live="polite">
-              Current: {{ selectedTheme ? themeOptions.find(o => o.value === selectedTheme)?.name : 'No theme selected' }}
-            </p>
-          </div>
-        </div>
-
-        <div class="bg-yellow-50 border border-yellow-200 rounded-lg p-4">
-          <h4 class="font-semibold mb-2">🎧 Screen Reader Testing Tips</h4>
-          <ul class="text-sm text-gray-600 dark-theme:text-gray-300 space-y-1">
-            <li>• Listen for role announcements when focusing</li>
-            <li>• Verify dropdown state changes are announced</li>
-            <li>• Check that selected values are spoken clearly</li>
-            <li>• Ensure option navigation is announced</li>
-          </ul>
-        </div>
-      </div>
-    `
-  })
-}
-
-export const FormIntegration: Story = {
-  render: (args) => ({
-    components: { SingleSelect },
-    setup() {
-      const formData = ref({
-        category: null as string | null,
-        status: 'draft' as string | null,
-        assignee: null as string | null
-      })
-
-      const categoryOptions = [
-        { name: 'Bug Report', value: 'bug' },
-        { name: 'Feature Request', value: 'feature' },
-        { name: 'Documentation', value: 'docs' },
-        { name: 'Question', value: 'question' }
-      ]
-
-      const statusOptions = [
-        { name: 'Draft', value: 'draft' },
-        { name: 'Review', value: 'review' },
-        { name: 'Approved', value: 'approved' },
-        { name: 'Published', value: 'published' }
-      ]
-
-      const assigneeOptions = [
-        { name: 'Alice Johnson', value: 'alice' },
-        { name: 'Bob Smith', value: 'bob' },
-        { name: 'Carol Davis', value: 'carol' },
-        { name: 'David Wilson', value: 'david' }
-      ]
-
-      const handleSubmit = () => {
-        alert('Form submitted with: ' + JSON.stringify(formData.value, null, 2))
-      }
-
-      return {
-        formData,
-        categoryOptions,
-        statusOptions,
-        assigneeOptions,
-        handleSubmit,
-        args
-      }
-    },
-    template: `
-      <div class="max-w-2xl mx-auto p-6">
-        <div class="bg-purple-50 dark-theme:bg-purple-900/20 border border-purple-200 dark-theme:border-purple-700 rounded-lg p-4 mb-6">
-          <h3 class="text-lg font-semibold mb-2">📝 Form Integration Test</h3>
-          <p class="text-sm text-gray-600 dark-theme:text-gray-300">
-            Test keyboard navigation through a complete form with SingleSelect components.
-            Tab order should be logical and all elements should be accessible.
-          </p>
-        </div>
-
-        <form @submit.prevent="handleSubmit" class="space-y-6">
-          <div>
-            <label class="block text-sm font-medium text-gray-700 dark-theme:text-gray-200 mb-1">
-              Title *
-            </label>
-            <input
-              type="text"
-              required
-              placeholder="Enter a title"
-              class="block w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
-            />
-          </div>
-
-          <div>
-            <label class="block text-sm font-medium text-gray-700 dark-theme:text-gray-200 mb-1">
-              Category *
-            </label>
-            <SingleSelect
-              v-model="formData.category"
-              :options="categoryOptions"
-              label="Select category"
-              required
-              class="w-full"
-            />
-          </div>
-
-          <div>
-            <label class="block text-sm font-medium text-gray-700 dark-theme:text-gray-200 mb-1">
-              Status
-            </label>
-            <SingleSelect
-              v-model="formData.status"
-              :options="statusOptions"
-              label="Select status"
-              class="w-full"
-            />
-          </div>
-
-          <div>
-            <label class="block text-sm font-medium text-gray-700 dark-theme:text-gray-200 mb-1">
-              Assignee
-            </label>
-            <SingleSelect
-              v-model="formData.assignee"
-              :options="assigneeOptions"
-              label="Select assignee"
-              class="w-full"
-            />
-          </div>
-
-          <div>
-            <label class="block text-sm font-medium text-gray-700 dark-theme:text-gray-200 mb-1">
-              Description
-            </label>
-            <textarea
-              rows="4"
-              placeholder="Enter description"
-              class="block w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
-            />
-          </div>
-
-          <div class="flex gap-3">
-            <button
-              type="submit"
-              class="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
-            >
-              Submit
-            </button>
-            <button
-              type="button"
-              class="px-4 py-2 bg-gray-300 dark-theme:bg-gray-600 text-gray-700 dark-theme:text-gray-200 rounded-md hover:bg-gray-400 dark-theme:hover:bg-gray-500 focus:ring-2 focus:ring-gray-500 focus:ring-offset-2"
-            >
-              Cancel
-            </button>
-          </div>
-        </form>
-
-        <div class="mt-6 p-4 bg-gray-50 dark-theme:bg-zinc-800 border border-gray-200 dark-theme:border-zinc-700 rounded-lg">
-          <h4 class="font-semibold mb-2">Current Form Data:</h4>
-          <pre class="text-xs text-gray-600 dark-theme:text-gray-300">{{ JSON.stringify(formData, null, 2) }}</pre>
-        </div>
-      </div>
-    `
-  })
-}
-
-export const AccessibilityChecklist: Story = {
-  render: () => ({
-    template: `
-      <div class="max-w-4xl mx-auto p-6 space-y-6">
-        <div class="bg-gray-50 dark-theme:bg-zinc-800 border border-gray-200 dark-theme:border-zinc-700 rounded-lg p-6">
-          <h2 class="text-2xl font-bold mb-4">♿ SingleSelect Accessibility Checklist</h2>
-
-          <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
-            <div>
-              <h3 class="text-lg font-semibold mb-3 text-green-700">✅ Implemented Features</h3>
-              <ul class="space-y-2 text-sm">
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>Keyboard Navigation:</strong> Tab, Enter, Space, Arrow keys, Escape</span>
-                </li>
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>ARIA Attributes:</strong> role, aria-haspopup, aria-expanded, aria-label</span>
-                </li>
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>Focus Management:</strong> Visible focus rings and logical tab order</span>
-                </li>
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>Internationalization:</strong> Translatable aria-label fallbacks</span>
-                </li>
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>Screen Reader Support:</strong> Proper announcements and state</span>
-                </li>
-                <li class="flex items-start">
-                  <span class="text-green-500 mr-2">✓</span>
-                  <span><strong>Form Integration:</strong> Works properly in forms with other elements</span>
-                </li>
-              </ul>
-            </div>
-
-            <div>
-              <h3 class="text-lg font-semibold mb-3 text-blue-700">📋 Testing Guidelines</h3>
-              <ol class="space-y-2 text-sm list-decimal list-inside">
-                <li><strong>Keyboard Only:</strong> Navigate using only keyboard</li>
-                <li><strong>Screen Reader:</strong> Test with NVDA, JAWS, or VoiceOver</li>
-                <li><strong>Focus Visible:</strong> Ensure focus rings are always visible</li>
-                <li><strong>Tab Order:</strong> Verify logical progression in forms</li>
-                <li><strong>Announcements:</strong> Check state changes are announced</li>
-                <li><strong>Selection:</strong> Verify selected value is announced</li>
-              </ol>
-            </div>
-          </div>
-
-          <div class="mt-6 p-4 bg-blue-50 dark-theme:bg-blue-900/20 border border-blue-200 dark-theme:border-blue-700 rounded-lg">
-            <h4 class="font-semibold mb-2">🎯 Quick Test</h4>
-            <p class="text-sm text-gray-700 dark-theme:text-gray-200">
-              Close your eyes, use only the keyboard, and try to select different options from any dropdown above.
-              If you can successfully navigate and make selections, the accessibility implementation is working!
-            </p>
-          </div>
-
-          <div class="mt-4 p-4 bg-orange-50 border border-orange-200 rounded-lg">
-            <h4 class="font-semibold mb-2">⚡ Performance Note</h4>
-            <p class="text-sm text-gray-700 dark-theme:text-gray-200">
-              These accessibility features are built into the component with minimal performance impact.
-              The ARIA attributes and keyboard handlers add less than 1KB to the bundle size.
-            </p>
-          </div>
-        </div>
-      </div>
-    `
-  })
-}

src/components/input/SingleSelect.vue

@@ -14,11 +14,6 @@
     option-value="value"
     unstyled
     :pt="pt"
-    :aria-label="label || t('g.singleSelectDropdown')"
-    role="combobox"
-    :aria-expanded="false"
-    aria-haspopup="listbox"
-    :tabindex="0"
   >
     <!-- Trigger value -->
     <template #value="slotProps">
@@ -60,12 +55,9 @@
 <script setup lang="ts">
 import Select, { SelectPassThroughMethodOptions } from 'primevue/select'
 import { computed } from 'vue'
-import { useI18n } from 'vue-i18n'
 
 import { cn } from '@/utils/tailwindUtil'
 
-import { type SelectOption } from './types'
-
 defineOptions({
   inheritAttrs: false
 })
@@ -83,7 +75,10 @@ const {
    * Cannot rely on $attrs alone because we need to access options
    * in getLabel() to map values to their display names.
    */
-  options?: SelectOption[]
+  options?: {
+    name: string
+    value: string
+  }[]
   /** Maximum height of the dropdown panel (default: 28rem) */
   listMaxHeight?: string
   /** Minimum width of the popover (default: auto) */
@@ -94,8 +89,6 @@ const {
 
 const selectedItem = defineModel<string | null>({ required: true })
 
-const { t } = useI18n()
-
 /**
  * Maps a value to its display label.
  * Necessary because PrimeVue's value slot doesn't provide the selected item's label,
@@ -125,16 +118,16 @@ const optionStyle = computed(() => {
  * - Text/icon scale: compact size matching MultiSelect
  */
 const pt = computed(() => ({
-  root: ({ props }: SelectPassThroughMethodOptions<SelectOption>) => ({
+  root: ({
+    props
+  }: SelectPassThroughMethodOptions<{ name: string; value: string }>) => ({
     class: [
       // container
       'h-10 relative inline-flex cursor-pointer select-none items-center',
       // trigger surface
-      'rounded-lg',
-      'bg-white dark-theme:bg-zinc-800 text-neutral dark-theme:text-white',
-      'border-[2.5px] border-solid border-transparent',
-      'transition-all duration-200 ease-in-out',
-      'focus-within:border-blue-400 dark-theme:focus-within:border-blue-500',
+      'rounded-md',
+      'bg-transparent text-neutral dark-theme:text-white',
+      'border-0',
       // disabled
       { 'opacity-60 cursor-default': props.disabled }
     ]
@@ -165,7 +158,9 @@ const pt = computed(() => ({
       // Same list tone/size as MultiSelect
       'flex flex-col gap-0 p-0 m-0 list-none border-none text-sm'
   },
-  option: ({ context }: SelectPassThroughMethodOptions<SelectOption>) => ({
+  option: ({
+    context
+  }: SelectPassThroughMethodOptions<{ name: string; value: string }>) => ({
     class: [
       // Row layout
       'flex items-center justify-between gap-3 px-2 py-3 rounded',

src/components/input/types.ts

@@ -1 +0,0 @@
-export type SelectOption = { name: string; value: string }

src/components/load3d/Load3D.vue

@@ -101,10 +101,10 @@ import {
   MaterialMode,
   UpDirection
 } from '@/extensions/core/load3d/interfaces'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useToastStore } from '@/platform/updates/common/toastStore'
 import type { CustomInputSpec } from '@/schemas/nodeDef/nodeDefSchemaV2'
 import type { ComponentWidget } from '@/scripts/domWidget'
+import { useSettingStore } from '@/stores/settingStore'
+import { useToastStore } from '@/stores/toastStore'
 
 const { t } = useI18n()
 const { widget } = defineProps<{

src/components/load3d/controls/LightControls.vue

@@ -38,7 +38,7 @@ import Slider from 'primevue/slider'
 import { onMounted, onUnmounted, ref, watch } from 'vue'
 
 import { t } from '@/i18n'
-import { useSettingStore } from '@/platform/settings/settingStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 const vTooltip = Tooltip
 

src/components/load3d/controls/viewer/ViewerLightControls.vue

@@ -14,7 +14,7 @@
 import Slider from 'primevue/slider'
 
 import { t } from '@/i18n'
-import { useSettingStore } from '@/platform/settings/settingStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 const lightIntensity = defineModel<number>('lightIntensity')
 

src/components/searchbox/NodeSearchBox.vue

@@ -87,12 +87,12 @@ import NodePreview from '@/components/node/NodePreview.vue'
 import AutoCompletePlus from '@/components/primevueOverride/AutoCompletePlus.vue'
 import NodeSearchFilter from '@/components/searchbox/NodeSearchFilter.vue'
 import NodeSearchItem from '@/components/searchbox/NodeSearchItem.vue'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import {
   ComfyNodeDefImpl,
   useNodeDefStore,
   useNodeFrequencyStore
 } from '@/stores/nodeDefStore'
+import { useSettingStore } from '@/stores/settingStore'
 import type { FuseFilterWithValue } from '@/utils/fuseUtil'
 
 import SearchFilterChip from '../common/SearchFilterChip.vue'

src/components/searchbox/NodeSearchBoxPopover.vue

@@ -45,11 +45,11 @@ import {
   LiteGraphCanvasEvent
 } from '@/lib/litegraph/src/litegraph'
 import type { CanvasPointerEvent } from '@/lib/litegraph/src/types/events'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
-import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useLitegraphService } from '@/services/litegraphService'
+import { useCanvasStore } from '@/stores/graphStore'
 import { ComfyNodeDefImpl, useNodeDefStore } from '@/stores/nodeDefStore'
+import { useSettingStore } from '@/stores/settingStore'
+import { useWorkflowStore } from '@/stores/workflowStore'
 import { useSearchBoxStore } from '@/stores/workspace/searchBoxStore'
 import { LinkReleaseTriggerAction } from '@/types/searchBoxTypes'
 import { FuseFilterWithValue } from '@/utils/fuseUtil'

src/components/searchbox/NodeSearchItem.vue

@@ -51,9 +51,9 @@ import Chip from 'primevue/chip'
 import Tag from 'primevue/tag'
 import { computed } from 'vue'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { useNodeBookmarkStore } from '@/stores/nodeBookmarkStore'
 import { ComfyNodeDefImpl, useNodeFrequencyStore } from '@/stores/nodeDefStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { NodeSourceType } from '@/types/nodeSource'
 import { highlightQuery } from '@/utils/formatUtil'
 import { formatNumberWithSuffix } from '@/utils/formatUtil'

src/components/sidebar/SideToolbar.vue

@@ -37,8 +37,8 @@ import { computed } from 'vue'
 import ExtensionSlot from '@/components/common/ExtensionSlot.vue'
 import SidebarBottomPanelToggleButton from '@/components/sidebar/SidebarBottomPanelToggleButton.vue'
 import SidebarShortcutsToggleButton from '@/components/sidebar/SidebarShortcutsToggleButton.vue'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { useKeybindingStore } from '@/stores/keybindingStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { useUserStore } from '@/stores/userStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 import type { SidebarTabExtension } from '@/types/extensionTypes'

src/components/sidebar/SidebarHelpCenterIcon.vue

@@ -62,14 +62,14 @@ import { storeToRefs } from 'pinia'
 import { computed, onMounted } from 'vue'
 
 import HelpCenterMenuContent from '@/components/helpcenter/HelpCenterMenuContent.vue'
+import ReleaseNotificationToast from '@/components/helpcenter/ReleaseNotificationToast.vue'
+import WhatsNewPopup from '@/components/helpcenter/WhatsNewPopup.vue'
 import { useConflictAcknowledgment } from '@/composables/useConflictAcknowledgment'
 import { useConflictDetection } from '@/composables/useConflictDetection'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useReleaseStore } from '@/platform/updates/common/releaseStore'
-import ReleaseNotificationToast from '@/platform/updates/components/ReleaseNotificationToast.vue'
-import WhatsNewPopup from '@/platform/updates/components/WhatsNewPopup.vue'
 import { useDialogService } from '@/services/dialogService'
 import { useHelpCenterStore } from '@/stores/helpCenterStore'
+import { useReleaseStore } from '@/stores/releaseStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 import SidebarIcon from './SidebarIcon.vue'
 

src/components/sidebar/SidebarTemplatesButton.vue

@@ -12,8 +12,8 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { useCommandStore } from '@/stores/commandStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 import SidebarIcon from './SidebarIcon.vue'
 

src/components/sidebar/tabs/ModelLibrarySidebarTab.vue

@@ -54,7 +54,6 @@ import SidebarTabTemplate from '@/components/sidebar/tabs/SidebarTabTemplate.vue
 import ElectronDownloadItems from '@/components/sidebar/tabs/modelLibrary/ElectronDownloadItems.vue'
 import ModelTreeLeaf from '@/components/sidebar/tabs/modelLibrary/ModelTreeLeaf.vue'
 import { useTreeExpansion } from '@/composables/useTreeExpansion'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { useLitegraphService } from '@/services/litegraphService'
 import {
   ComfyModelDef,
@@ -63,6 +62,7 @@ import {
   useModelStore
 } from '@/stores/modelStore'
 import { useModelToNodeStore } from '@/stores/modelToNodeStore'
+import { useSettingStore } from '@/stores/settingStore'
 import type { TreeNode } from '@/types/treeExplorerTypes'
 import type { TreeExplorerNode } from '@/types/treeExplorerTypes'
 import { isElectron } from '@/utils/envUtil'

src/components/sidebar/tabs/QueueSidebarTab.vue

@@ -104,8 +104,7 @@ import { useI18n } from 'vue-i18n'
 
 import NoResultsPlaceholder from '@/components/common/NoResultsPlaceholder.vue'
 import VirtualGrid from '@/components/common/VirtualGrid.vue'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { ComfyNode } from '@/platform/workflow/validation/schemas/workflowSchema'
+import { ComfyNode } from '@/schemas/comfyWorkflowSchema'
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
 import { useLitegraphService } from '@/services/litegraphService'
@@ -115,6 +114,7 @@ import {
   TaskItemImpl,
   useQueueStore
 } from '@/stores/queueStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 import SidebarTabTemplate from './SidebarTabTemplate.vue'
 import ResultGallery from './queue/ResultGallery.vue'

src/components/sidebar/tabs/WorkflowsSidebarTab.vue

@@ -141,13 +141,13 @@ import TreeExplorerTreeNode from '@/components/common/TreeExplorerTreeNode.vue'
 import SidebarTabTemplate from '@/components/sidebar/tabs/SidebarTabTemplate.vue'
 import WorkflowTreeLeaf from '@/components/sidebar/tabs/workflows/WorkflowTreeLeaf.vue'
 import { useTreeExpansion } from '@/composables/useTreeExpansion'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useWorkflowService } from '@/platform/workflow/core/services/workflowService'
+import { useWorkflowService } from '@/services/workflowService'
+import { useSettingStore } from '@/stores/settingStore'
 import {
   useWorkflowBookmarkStore,
   useWorkflowStore
-} from '@/platform/workflow/management/stores/workflowStore'
-import { ComfyWorkflow } from '@/platform/workflow/management/stores/workflowStore'
+} from '@/stores/workflowStore'
+import { ComfyWorkflow } from '@/stores/workflowStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 import type { TreeNode } from '@/types/treeExplorerTypes'
 import { TreeExplorerNode } from '@/types/treeExplorerTypes'

src/components/sidebar/tabs/modelLibrary/ModelTreeLeaf.vue

@@ -30,8 +30,8 @@ import {
 } from 'vue'
 
 import TreeExplorerTreeNode from '@/components/common/TreeExplorerTreeNode.vue'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { ComfyModelDef } from '@/stores/modelStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { RenderedTreeExplorerNode } from '@/types/treeExplorerTypes'
 
 import ModelPreview from './ModelPreview.vue'

src/components/sidebar/tabs/nodeLibrary/NodeTreeLeaf.vue

@@ -83,9 +83,9 @@ import { useI18n } from 'vue-i18n'
 
 import TreeExplorerTreeNode from '@/components/common/TreeExplorerTreeNode.vue'
 import NodePreview from '@/components/node/NodePreview.vue'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { useNodeBookmarkStore } from '@/stores/nodeBookmarkStore'
 import { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { useSubgraphStore } from '@/stores/subgraphStore'
 import { RenderedTreeExplorerNode } from '@/types/treeExplorerTypes'
 

src/components/sidebar/tabs/queue/ResultGallery.spec.ts

@@ -4,7 +4,7 @@ import Galleria from 'primevue/galleria'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 import { createApp, nextTick } from 'vue'
 
-import type { NodeId } from '@/platform/workflow/validation/schemas/workflowSchema'
+import type { NodeId } from '@/schemas/comfyWorkflowSchema'
 import type { ResultItemImpl } from '@/stores/queueStore'
 
 import ResultGallery from './ResultGallery.vue'

src/components/sidebar/tabs/queue/ResultItem.vue

@@ -24,8 +24,8 @@
 import { computed, onMounted, ref } from 'vue'
 
 import ComfyImage from '@/components/common/ComfyImage.vue'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { ResultItemImpl } from '@/stores/queueStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 import ResultAudio from './ResultAudio.vue'
 import ResultVideo from './ResultVideo.vue'

src/components/sidebar/tabs/queue/ResultVideo.vue

@@ -8,9 +8,9 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { useExtensionStore } from '@/stores/extensionStore'
 import { ResultItemImpl } from '@/stores/queueStore'
+import { useSettingStore } from '@/stores/settingStore'
 
 const props = defineProps<{
   result: ResultItemImpl

src/components/sidebar/tabs/queue/TaskItem.vue

@@ -78,7 +78,7 @@ import Button from 'primevue/button'
 import Tag from 'primevue/tag'
 import { computed, onMounted, onUnmounted, ref } from 'vue'
 
-import { ComfyNode } from '@/platform/workflow/validation/schemas/workflowSchema'
+import { ComfyNode } from '@/schemas/comfyWorkflowSchema'
 import { api } from '@/scripts/api'
 import { useLitegraphService } from '@/services/litegraphService'
 import { TaskItemDisplayStatus, type TaskItemImpl } from '@/stores/queueStore'

src/components/sidebar/tabs/workflows/WorkflowTreeLeaf.vue

@@ -17,10 +17,7 @@ import Button from 'primevue/button'
 import { computed } from 'vue'
 
 import TreeExplorerTreeNode from '@/components/common/TreeExplorerTreeNode.vue'
-import {
-  ComfyWorkflow,
-  useWorkflowBookmarkStore
-} from '@/platform/workflow/management/stores/workflowStore'
+import { ComfyWorkflow, useWorkflowBookmarkStore } from '@/stores/workflowStore'
 import type { RenderedTreeExplorerNode } from '@/types/treeExplorerTypes'
 
 const { node } = defineProps<{

src/components/templates/TemplateWorkflowCard.spec.ts

@@ -3,7 +3,7 @@ import { describe, expect, it, vi } from 'vitest'
 import { ref } from 'vue'
 
 import TemplateWorkflowCard from '@/components/templates/TemplateWorkflowCard.vue'
-import { TemplateInfo } from '@/platform/workflow/templates/types/template'
+import { TemplateInfo } from '@/types/workflowTemplateTypes'
 
 vi.mock('@/components/templates/thumbnails/AudioThumbnail.vue', () => ({
   default: {
@@ -64,16 +64,13 @@ vi.mock('@/stores/dialogStore', () => ({
   })
 }))
 
-vi.mock(
-  '@/platform/workflow/templates/repositories/workflowTemplatesStore',
-  () => ({
-    useWorkflowTemplatesStore: () => ({
-      isLoaded: true,
-      loadWorkflowTemplates: vi.fn().mockResolvedValue(true),
-      groupedTemplates: []
-    })
+vi.mock('@/stores/workflowTemplatesStore', () => ({
+  useWorkflowTemplatesStore: () => ({
+    isLoaded: true,
+    loadWorkflowTemplates: vi.fn().mockResolvedValue(true),
+    groupedTemplates: []
   })
-)
+}))
 
 vi.mock('vue-i18n', () => ({
   useI18n: () => ({
@@ -81,42 +78,35 @@ vi.mock('vue-i18n', () => ({
   })
 }))
 
-vi.mock(
-  '@/platform/workflow/templates/composables/useTemplateWorkflows',
-  () => ({
-    useTemplateWorkflows: () => ({
-      getTemplateThumbnailUrl: (
-        template: TemplateInfo,
-        sourceModule: string,
-        index = ''
-      ) => {
-        const basePath =
-          sourceModule === 'default'
-            ? `/fileURL/templates/${template.name}`
-            : `/apiURL/workflow_templates/${sourceModule}/${template.name}`
-        const indexSuffix =
-          sourceModule === 'default' && index ? `-${index}` : ''
-        return `${basePath}${indexSuffix}.${template.mediaSubtype}`
-      },
-      getTemplateTitle: (template: TemplateInfo, sourceModule: string) => {
-        const fallback =
-          template.title ?? template.name ?? `${sourceModule} Template`
-        return sourceModule === 'default'
-          ? template.localizedTitle ?? fallback
-          : fallback
-      },
-      getTemplateDescription: (
-        template: TemplateInfo,
-        sourceModule: string
-      ) => {
-        return sourceModule === 'default'
-          ? template.localizedDescription ?? ''
-          : template.description?.replace(/[-_]/g, ' ').trim() ?? ''
-      },
-      loadWorkflowTemplate: vi.fn()
-    })
+vi.mock('@/composables/useTemplateWorkflows', () => ({
+  useTemplateWorkflows: () => ({
+    getTemplateThumbnailUrl: (
+      template: TemplateInfo,
+      sourceModule: string,
+      index = ''
+    ) => {
+      const basePath =
+        sourceModule === 'default'
+          ? `/fileURL/templates/${template.name}`
+          : `/apiURL/workflow_templates/${sourceModule}/${template.name}`
+      const indexSuffix = sourceModule === 'default' && index ? `-${index}` : ''
+      return `${basePath}${indexSuffix}.${template.mediaSubtype}`
+    },
+    getTemplateTitle: (template: TemplateInfo, sourceModule: string) => {
+      const fallback =
+        template.title ?? template.name ?? `${sourceModule} Template`
+      return sourceModule === 'default'
+        ? template.localizedTitle ?? fallback
+        : fallback
+    },
+    getTemplateDescription: (template: TemplateInfo, sourceModule: string) => {
+      return sourceModule === 'default'
+        ? template.localizedDescription ?? ''
+        : template.description?.replace(/[-_]/g, ' ').trim() ?? ''
+    },
+    loadWorkflowTemplate: vi.fn()
   })
-)
+}))
 
 describe('TemplateWorkflowCard', () => {
   const createTemplate = (overrides = {}): TemplateInfo => ({

src/components/templates/TemplateWorkflowCard.vue

@@ -86,8 +86,8 @@ import AudioThumbnail from '@/components/templates/thumbnails/AudioThumbnail.vue
 import CompareSliderThumbnail from '@/components/templates/thumbnails/CompareSliderThumbnail.vue'
 import DefaultThumbnail from '@/components/templates/thumbnails/DefaultThumbnail.vue'
 import HoverDissolveThumbnail from '@/components/templates/thumbnails/HoverDissolveThumbnail.vue'
-import { useTemplateWorkflows } from '@/platform/workflow/templates/composables/useTemplateWorkflows'
-import { TemplateInfo } from '@/platform/workflow/templates/types/template'
+import { useTemplateWorkflows } from '@/composables/useTemplateWorkflows'
+import { TemplateInfo } from '@/types/workflowTemplateTypes'
 
 const UPSCALE_ZOOM_SCALE = 16 // for upscale templates, exaggerate the hover zoom
 const DEFAULT_ZOOM_SCALE = 5

src/components/templates/TemplateWorkflowList.vue

@@ -38,8 +38,8 @@ import Column from 'primevue/column'
 import DataTable from 'primevue/datatable'
 import { computed, ref } from 'vue'
 
-import { useTemplateWorkflows } from '@/platform/workflow/templates/composables/useTemplateWorkflows'
-import type { TemplateInfo } from '@/platform/workflow/templates/types/template'
+import { useTemplateWorkflows } from '@/composables/useTemplateWorkflows'
+import type { TemplateInfo } from '@/types/workflowTemplateTypes'
 
 const { sourceModule, loading, templates } = defineProps<{
   sourceModule: string

src/components/templates/TemplateWorkflowView.spec.ts

@@ -3,7 +3,7 @@ import { describe, expect, it, vi } from 'vitest'
 import { createI18n } from 'vue-i18n'
 
 import TemplateWorkflowView from '@/components/templates/TemplateWorkflowView.vue'
-import { TemplateInfo } from '@/platform/workflow/templates/types/template'
+import { TemplateInfo } from '@/types/workflowTemplateTypes'
 
 vi.mock('primevue/dataview', () => ({
   default: {

src/components/templates/TemplateWorkflowView.vue

@@ -88,7 +88,7 @@ import TemplateWorkflowList from '@/components/templates/TemplateWorkflowList.vu
 import { useIntersectionObserver } from '@/composables/useIntersectionObserver'
 import { useLazyPagination } from '@/composables/useLazyPagination'
 import { useTemplateFiltering } from '@/composables/useTemplateFiltering'
-import type { TemplateInfo } from '@/platform/workflow/templates/types/template'
+import type { TemplateInfo } from '@/types/workflowTemplateTypes'
 
 const { t } = useI18n()
 

src/components/templates/TemplateWorkflowsContent.vue

@@ -61,8 +61,8 @@ import { watch } from 'vue'
 import TemplateWorkflowView from '@/components/templates/TemplateWorkflowView.vue'
 import TemplateWorkflowsSideNav from '@/components/templates/TemplateWorkflowsSideNav.vue'
 import { useResponsiveCollapse } from '@/composables/element/useResponsiveCollapse'
-import { useTemplateWorkflows } from '@/platform/workflow/templates/composables/useTemplateWorkflows'
-import type { WorkflowTemplates } from '@/platform/workflow/templates/types/template'
+import { useTemplateWorkflows } from '@/composables/useTemplateWorkflows'
+import type { WorkflowTemplates } from '@/types/workflowTemplateTypes'
 
 const {
   isSmallScreen,

src/components/templates/TemplateWorkflowsSideNav.vue

@@ -33,7 +33,7 @@ import ScrollPanel from 'primevue/scrollpanel'
 import type {
   TemplateGroup,
   WorkflowTemplates
-} from '@/platform/workflow/templates/types/template'
+} from '@/types/workflowTemplateTypes'
 
 defineProps<{
   tabs: TemplateGroup[]

src/components/toast/GlobalToast.vue

@@ -7,8 +7,8 @@ import Toast from 'primevue/toast'
 import { useToast } from 'primevue/usetoast'
 import { nextTick, watch } from 'vue'
 
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useToastStore } from '@/platform/updates/common/toastStore'
+import { useSettingStore } from '@/stores/settingStore'
+import { useToastStore } from '@/stores/toastStore'
 
 const toast = useToast()
 const toastStore = useToastStore()

src/components/toast/RerouteMigrationToast.vue

@@ -23,9 +23,9 @@ import Button from 'primevue/button'
 import Toast from 'primevue/toast'
 import { useI18n } from 'vue-i18n'
 
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
-import type { WorkflowJSON04 } from '@/platform/workflow/validation/schemas/workflowSchema'
+import type { WorkflowJSON04 } from '@/schemas/comfyWorkflowSchema'
 import { app } from '@/scripts/app'
+import { useWorkflowStore } from '@/stores/workflowStore'
 import { migrateLegacyRerouteNodes } from '@/utils/migration/migrateReroute'
 
 const { t } = useI18n()

src/components/topbar/CommandMenubar.vue

@@ -81,14 +81,14 @@ import { computed, nextTick, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import SubgraphBreadcrumb from '@/components/breadcrumb/SubgraphBreadcrumb.vue'
+import SettingDialogContent from '@/components/dialog/content/SettingDialogContent.vue'
 import SettingDialogHeader from '@/components/dialog/header/SettingDialogHeader.vue'
 import { useManagerState } from '@/composables/useManagerState'
-import SettingDialogContent from '@/platform/settings/components/SettingDialogContent.vue'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { useColorPaletteService } from '@/services/colorPaletteService'
 import { useCommandStore } from '@/stores/commandStore'
 import { useDialogStore } from '@/stores/dialogStore'
 import { useMenuItemStore } from '@/stores/menuItemStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { useColorPaletteStore } from '@/stores/workspace/colorPaletteStore'
 import { ManagerTab } from '@/types/comfyManagerTypes'
 import { showNativeSystemMenu } from '@/utils/envUtil'

src/components/topbar/TopMenubar.vue

@@ -39,8 +39,8 @@ import Actionbar from '@/components/actionbar/ComfyActionbar.vue'
 import CommandMenubar from '@/components/topbar/CommandMenubar.vue'
 import CurrentUserButton from '@/components/topbar/CurrentUserButton.vue'
 import WorkflowTabs from '@/components/topbar/WorkflowTabs.vue'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { app } from '@/scripts/app'
+import { useSettingStore } from '@/stores/settingStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 import { electronAPI, isElectron, isNativeWindow } from '@/utils/envUtil'
 

src/components/topbar/WorkflowOverflowMenu.vue

@@ -23,8 +23,8 @@ import Button from 'primevue/button'
 import Menu from 'primevue/menu'
 import { computed, ref } from 'vue'
 
-import { useWorkflowService } from '@/platform/workflow/core/services/workflowService'
-import type { ComfyWorkflow } from '@/platform/workflow/management/stores/workflowStore'
+import { useWorkflowService } from '@/services/workflowService'
+import type { ComfyWorkflow } from '@/stores/workflowStore'
 
 const props = defineProps<{
   workflows: ComfyWorkflow[]

src/components/topbar/WorkflowTab.vue

@@ -40,11 +40,11 @@ import {
   usePragmaticDraggable,
   usePragmaticDroppable
 } from '@/composables/usePragmaticDragAndDrop'
-import { useSettingStore } from '@/platform/settings/settingStore'
-import { useWorkflowService } from '@/platform/workflow/core/services/workflowService'
-import { ComfyWorkflow } from '@/platform/workflow/management/stores/workflowStore'
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
-import { useWorkflowThumbnail } from '@/renderer/core/thumbnail/useWorkflowThumbnail'
+import { useWorkflowThumbnail } from '@/renderer/thumbnail/composables/useWorkflowThumbnail'
+import { useWorkflowService } from '@/services/workflowService'
+import { useSettingStore } from '@/stores/settingStore'
+import { ComfyWorkflow } from '@/stores/workflowStore'
+import { useWorkflowStore } from '@/stores/workflowStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 
 import WorkflowTabPopover from './WorkflowTabPopover.vue'