fix(ci): strip public assets from e2e coverage

.agents/checks/adr-compliance.md

@@ -33,15 +33,15 @@ Flag:
 - **New circular entity dependencies** — New circular imports between `LGraph` ↔ `Subgraph`, `LGraphNode` ↔ `LGraphCanvas`, or similar entity classes.
 - **Direct `graph._version++`** — Mutating the private version counter directly instead of through a public API. Extensions already depend on this side-channel; it must become a proper API.
 
-### Dedicated Stores and Data/Behavior Separation
+### Centralized Registries and ECS-Style Access
 
-Entity data lives in dedicated Pinia stores keyed by string IDs (`widgetValueStore`, `domWidgetStore`, `layoutStore`, `nodeOutputStore`, `subgraphNavigationStore`, `previewExposureStore`), not on entity instances.
+All entity data access should move toward centralized query patterns, not instance property access.
 
 Flag:
 
-- **New instance method/property patterns** — Adding `node.someProperty` or `node.someMethod()` for data that belongs in a dedicated store (e.g. widget values → `widgetValueStore` keyed by `WidgetId`).
+- **New instance method/property patterns** — Adding `node.someProperty` or `node.someMethod()` for data that should be a component in the World, queried via `world.getComponent(entityId, ComponentType)`.
 - **OOP inheritance for entity modeling** — Extending entity classes with new subclasses instead of composing behavior through components and systems.
-- **Duplicated authority** — Storing the same entity state in both a class property and a store, or across two stores, so ownership becomes ambiguous. Each piece of state should have one owning store.
+- **Scattered state** — New entity state stored in multiple locations (class properties, stores, local variables) instead of being consolidated in the World or in a single store.
 
 ### Extension Ecosystem Impact
 

.coderabbit.yaml

@@ -2,7 +2,6 @@ issue_enrichment:
   auto_enrich:
     enabled: true
 reviews:
-  profile: assertive
   high_level_summary: false
   request_changes_workflow: true
   auto_review:

.github/workflows/ci-dist-telemetry-scan.yaml

@@ -133,24 +133,3 @@ jobs:
             exit 1
           fi
           echo '✅ No Customer.io references found'
-
-      - name: Scan dist for Cloudflare Turnstile sitekey references
-        run: |
-          set -euo pipefail
-          echo '🔍 Scanning for Cloudflare Turnstile sitekeys...'
-          if rg --no-ignore -n \
-            -g '*.html' \
-            -g '*.js' \
-            -e '0x4AAAAAADnYZPVOpFCL_zeo' \
-            -e '0x4AAAAAADnYY4_Q0qxHZ5a7' \
-            -e '1x00000000000000000000AA' \
-            dist; then
-            echo '❌ ERROR: Cloudflare Turnstile sitekey found in dist assets!'
-            echo 'The per-env Turnstile sitekeys are cloud-only and must be tree-shaken from OSS builds.'
-            echo ''
-            echo 'To fix this:'
-            echo '1. Gate sitekey selection on the __DISTRIBUTION__ build define, not the runtime isCloud const'
-            echo '2. See getTurnstileSiteKey() in src/config/turnstile.ts'
-            exit 1
-          fi
-          echo '✅ No Turnstile sitekey references found'

.github/workflows/ci-tests-e2e-coverage.yaml

@@ -88,9 +88,9 @@ jobs:
       - name: Strip non-source entries from coverage
         if: steps.coverage-shards.outputs.has-coverage == 'true'
         run: |
-          # Drop served bundle scripts (localhost-8188/assets/*.js) that V8 records but have no source file on disk, which would abort genhtml.
           lcov --remove coverage/playwright/coverage.lcov \
             '*localhost-8188*' \
+            'assets/images/*' \
             -o coverage/playwright/coverage.lcov \
             --ignore-errors unused
           wc -l coverage/playwright/coverage.lcov
@@ -121,7 +121,8 @@ jobs:
             --title "ComfyUI E2E Coverage" \
             --no-function-coverage \
             --precision 1 \
-            --ignore-errors source,unmapped
+            --ignore-errors source,unmapped,range \
+            --synthesize-missing
 
       - name: Upload HTML report artifact
         if: steps.coverage-shards.outputs.has-coverage == 'true'

.github/workflows/cla.yml

@@ -41,7 +41,7 @@ jobs:
 
           # Allowlist bots so they don't need to sign (optional, comma-separated).
           # *[bot] is a catch-all for any GitHub App bot account.
-          allowlist: action@github.com,actions-user,ampagent,claude,comfy-pr-bot,GitHub Action,github-actions,Glary Bot,Glary-Bot,*[bot]
+          allowlist: actions-user,ampagent,claude,coderabbitai[bot],comfy-pr-bot,dependabot[bot],github-actions[bot],copilot-swe-agent[bot],devin-ai-integration[bot],*[bot]
 
           # Custom PR comment messages
           custom-notsigned-prcomment: |

.storybook/main.ts

@@ -83,16 +83,6 @@ const config: StorybookConfig = {
             replacement:
               process.cwd() + '/src/storybook/mocks/useBillingContext.ts'
           },
-          {
-            find: '@/composables/useFeatureFlags',
-            replacement:
-              process.cwd() + '/src/storybook/mocks/useFeatureFlags.ts'
-          },
-          {
-            find: '@/platform/workspace/stores/teamWorkspaceStore',
-            replacement:
-              process.cwd() + '/src/storybook/mocks/teamWorkspaceStore.ts'
-          },
           {
             find: '@/utils/formatUtil',
             replacement:

AGENTS.md

@@ -246,7 +246,7 @@ All architectural decisions are documented in `docs/adr/`. Code changes must be
 ### Entity Architecture Constraints (ADR 0003 + ADR 0008)
 
 1. **Command pattern for all mutations**: Every entity state change must be a serializable, idempotent, deterministic command — replayable, undoable, and transmittable over CRDT. No imperative fire-and-forget mutation APIs. Systems produce command batches, not direct side effects.
-2. **Dedicated stores over instance state**: Entity data lives in dedicated Pinia stores keyed by string IDs — widget values in `widgetValueStore` keyed by `WidgetId` (`graphId:nodeId:name`, see `src/types/widgetId.ts`), plus `domWidgetStore`, `layoutStore`, `nodeOutputStore`, `subgraphNavigationStore`, and `previewExposureStore`. Prefer a focused store to a single unified registry. Do not add new instance properties/methods to entity classes for data that belongs in a store. Do not use OOP inheritance for entity modeling.
+2. **Centralized registries and ECS-style access**: Entity data lives in the World (centralized registry), queried via `world.getComponent(entityId, ComponentType)`. Do not add new instance properties/methods to entity classes. Do not use OOP inheritance for entity modeling.
 3. **No god-object growth**: Do not add methods to `LGraphNode`, `LGraphCanvas`, `LGraph`, or `Subgraph`. Extract to systems, stores, or composables.
 4. **Plain data components**: ECS components are plain data objects — no methods, no back-references to parent entities. Behavior belongs in systems (pure functions).
 5. **Extension ecosystem impact**: Changes to entity callbacks (`onConnectionsChange`, `onRemoved`, `onAdded`, `onConnectInput/Output`, `onConfigure`, `onWidgetChanged`), `node.widgets` access, `node.serialize`, or `graph._version++` affect 40+ custom node repos and require migration guidance.

apps/website/e2e/launches.spec.ts

@@ -1,231 +0,0 @@
-import type { Page } from '@playwright/test'
-import { expect } from '@playwright/test'
-
-import { externalLinks } from '../src/config/routes'
-import { drops } from '../src/data/drops'
-import type { Locale } from '../src/i18n/translations'
-import { t } from '../src/i18n/translations'
-import { test } from './fixtures/blockExternalMedia'
-
-const PATH_EN = '/launches'
-const PATH_ZH = '/zh-CN/launches'
-const CLOUD_URL = 'https://cloud.comfy.org'
-
-const LOCALES: ReadonlyArray<readonly [string, Locale]> = [
-  [PATH_EN, 'en'],
-  [PATH_ZH, 'zh-CN']
-]
-
-function heroSection(page: Page, locale: Locale) {
-  return page.locator('section').filter({
-    has: page.getByRole('heading', {
-      level: 1,
-      name: t('launches.hero.title', locale)
-    })
-  })
-}
-
-function ctaSection(page: Page, locale: Locale) {
-  return page.locator('section').filter({
-    has: page.getByRole('heading', {
-      level: 2,
-      name: t('launches.cta.heading', locale)
-    })
-  })
-}
-
-function dropsSection(page: Page, locale: Locale) {
-  return page.locator('section').filter({
-    has: page.getByRole('heading', {
-      level: 2,
-      name: t('launches.section.title', locale)
-    })
-  })
-}
-
-test.describe('Launches landing — desktop @smoke', () => {
-  test('renders the configured title at /launches', async ({ page }) => {
-    await page.goto(PATH_EN)
-    await expect(page).toHaveTitle(t('launches.page.title', 'en'))
-  })
-
-  test('renders the localized title at /zh-CN/launches', async ({ page }) => {
-    await page.goto(PATH_ZH)
-    await expect(page).toHaveTitle(t('launches.page.title', 'zh-CN'))
-  })
-
-  test('is indexable at both locales', async ({ page }) => {
-    await page.goto(PATH_EN)
-    await expect(page.locator('meta[name="robots"]')).toHaveCount(0)
-
-    await page.goto(PATH_ZH)
-    await expect(page.locator('meta[name="robots"]')).toHaveCount(0)
-  })
-
-  test('hero h1 renders the localized title in both locales', async ({
-    page
-  }) => {
-    await page.goto(PATH_EN)
-    await expect(
-      page.getByRole('heading', {
-        level: 1,
-        name: t('launches.hero.title', 'en')
-      })
-    ).toBeVisible()
-
-    await page.goto(PATH_ZH)
-    await expect(
-      page.getByRole('heading', {
-        level: 1,
-        name: t('launches.hero.title', 'zh-CN')
-      })
-    ).toBeVisible()
-  })
-
-  test('hero primary CTA links to /download per locale', async ({ page }) => {
-    for (const [path, locale, expectedHref] of [
-      [PATH_EN, 'en', '/download'],
-      [PATH_ZH, 'zh-CN', '/zh-CN/download']
-    ] as const) {
-      await page.goto(path)
-      const primary = heroSection(page, locale).getByRole('link', {
-        name: t('launches.hero.primary', locale)
-      })
-      await expect(primary).toBeVisible()
-      await expect(primary).toHaveAttribute('href', expectedHref)
-    }
-  })
-
-  test('hero secondary CTA opens external Cloud in a new tab on both locales', async ({
-    page
-  }) => {
-    for (const [path, locale] of LOCALES) {
-      await page.goto(path)
-      const secondary = heroSection(page, locale).getByRole('link', {
-        name: t('launches.hero.secondary', locale)
-      })
-      await expect(secondary).toBeVisible()
-      await expect(secondary).toHaveAttribute('href', CLOUD_URL)
-      await expect(secondary).toHaveAttribute('target', '_blank')
-      await expect(secondary).toHaveAttribute('rel', 'noopener noreferrer')
-    }
-  })
-
-  test('closing CTA shows heading and both action buttons in both locales', async ({
-    page
-  }) => {
-    for (const [path, locale] of LOCALES) {
-      await page.goto(path)
-      const section = ctaSection(page, locale)
-      await expect(
-        section.getByRole('heading', {
-          level: 2,
-          name: t('launches.cta.heading', locale)
-        })
-      ).toBeVisible()
-
-      const primary = section.getByRole('link', {
-        name: t('launches.cta.primary', locale)
-      })
-      await expect(primary).toBeVisible()
-      await expect(primary).toHaveAttribute('href', externalLinks.cloud)
-      await expect(primary).toHaveAttribute('target', '_blank')
-      await expect(primary).toHaveAttribute('rel', 'noopener noreferrer')
-
-      const secondary = section.getByRole('link', {
-        name: t('launches.cta.secondary', locale)
-      })
-      await expect(secondary).toBeVisible()
-      await expect(secondary).toHaveAttribute('href', externalLinks.workflows)
-      await expect(secondary).toHaveAttribute('target', '_blank')
-      await expect(secondary).toHaveAttribute('rel', 'noopener noreferrer')
-    }
-  })
-
-  test('drops section renders one card per data entry with the correct localized href in both locales', async ({
-    page
-  }) => {
-    for (const [path, locale] of LOCALES) {
-      await page.goto(path)
-      const section = dropsSection(page, locale)
-
-      await expect(
-        section.getByRole('heading', {
-          level: 2,
-          name: t('launches.section.title', locale)
-        })
-      ).toBeVisible()
-
-      const cards = section.locator('[data-slot="card"]')
-      await expect(cards).toHaveCount(drops.length)
-
-      for (const [i, drop] of drops.entries()) {
-        const card = cards.nth(i)
-        await expect(card).toContainText(drop.title[locale])
-        const explore = card.getByRole('link', {
-          name: drop.cta.label[locale]
-        })
-        await expect(explore).toBeVisible()
-        await expect(explore).toHaveAttribute('href', drop.cta.href[locale])
-      }
-    }
-  })
-
-  test('desktop: first 4 drop cards are wider than cards 5+', async ({
-    page
-  }) => {
-    await page.goto(PATH_EN)
-    const cards = dropsSection(page, 'en').locator('[data-slot="card"]')
-    await expect(cards).toHaveCount(drops.length)
-
-    await expect
-      .poll(async () => {
-        const firstWidth = (await cards.nth(0).boundingBox())?.width ?? 0
-        const fifthWidth = (await cards.nth(4).boundingBox())?.width ?? 0
-        return firstWidth - fifthWidth
-      })
-      .toBeGreaterThan(0)
-  })
-})
-
-test.describe('Launches landing — mobile @mobile', () => {
-  test('drops grid stacks in a single column at mobile width', async ({
-    page
-  }) => {
-    await page.goto(PATH_EN)
-    const cards = dropsSection(page, 'en').locator('[data-slot="card"]')
-    await expect(cards).toHaveCount(drops.length)
-
-    const viewport = page.viewportSize()
-    expect(viewport, 'viewport size').not.toBeNull()
-
-    await expect
-      .poll(async () => (await cards.nth(0).boundingBox())?.width ?? 0)
-      .toBeGreaterThanOrEqual(viewport!.width * 0.7)
-
-    await expect
-      .poll(async () => {
-        const firstBox = await cards.nth(0).boundingBox()
-        const secondBox = await cards.nth(1).boundingBox()
-        if (!firstBox || !secondBox) return false
-        return secondBox.y >= firstBox.y + firstBox.height
-      })
-      .toBe(true)
-  })
-
-  test('closing CTA heading stays within viewport width', async ({ page }) => {
-    await page.goto(PATH_EN)
-    const heading = page.getByRole('heading', {
-      level: 2,
-      name: t('launches.cta.heading', 'en')
-    })
-    await heading.scrollIntoViewIfNeeded()
-    await expect(heading).toBeVisible()
-
-    const box = await heading.boundingBox()
-    expect(box, 'CTA heading bounding box').not.toBeNull()
-    const viewport = page.viewportSize()
-    expect(viewport, 'viewport size').not.toBeNull()
-    expect(box!.x + box!.width).toBeLessThanOrEqual(viewport!.width + 1)
-  })
-})

apps/website/src/components/blocks/CtaCenter01.vue

@@ -1,14 +1,10 @@
 <script setup lang="ts">
-import type { AnchorHTMLAttributes } from 'vue'
-
-import Button from '../ui/button/Button.vue'
-import { resolveRel } from '../../utils/cta'
+import BrandButton from '../common/BrandButton.vue'
 
 type Cta = {
   label: string
   href: string
-  target?: AnchorHTMLAttributes['target']
-  rel?: AnchorHTMLAttributes['rel']
+  target?: '_blank' | '_self' | '_parent' | '_top'
 }
 
 type TermsLink = {
@@ -16,11 +12,10 @@ type TermsLink = {
   href: string
 }
 
-const { heading, primaryCta, secondaryCta, termsLink } = defineProps<{
+defineProps<{
   heading: string
   primaryCta: Cta
-  secondaryCta?: Cta
-  termsLink?: TermsLink
+  termsLink: TermsLink
 }>()
 </script>
 
@@ -29,37 +24,23 @@ const { heading, primaryCta, secondaryCta, termsLink } = defineProps<{
     class="max-w-9xl mx-auto flex flex-col items-center px-6 py-16 text-center lg:py-24"
   >
     <h2
-      class="max-w-3xl text-4xl/snug font-light tracking-tight text-pretty text-primary-comfy-canvas lg:text-6xl/snug"
+      class="text-4xl font-light tracking-tight text-primary-comfy-canvas lg:text-6xl"
     >
       {{ heading }}
     </h2>
 
-    <div class="mt-10 flex flex-col gap-4 sm:flex-row lg:mt-12">
-      <Button
-        as="a"
-        :href="primaryCta.href"
-        :target="primaryCta.target"
-        :rel="resolveRel(primaryCta)"
-        variant="default"
-        size="lg"
-      >
-        {{ primaryCta.label }}
-      </Button>
-      <Button
-        v-if="secondaryCta"
-        as="a"
-        :href="secondaryCta.href"
-        :target="secondaryCta.target"
-        :rel="resolveRel(secondaryCta)"
-        variant="outline"
-        size="lg"
-      >
-        {{ secondaryCta.label }}
-      </Button>
-    </div>
+    <BrandButton
+      :href="primaryCta.href"
+      :target="primaryCta.target"
+      :rel="primaryCta.target === '_blank' ? 'noopener noreferrer' : undefined"
+      variant="outline"
+      size="lg"
+      class="mt-10 px-20 py-4 text-base uppercase lg:mt-12"
+    >
+      {{ primaryCta.label }}
+    </BrandButton>
 
     <a
-      v-if="termsLink"
       :href="termsLink.href"
       class="mt-8 text-sm text-primary-comfy-canvas/70 underline underline-offset-4 transition-colors hover:text-primary-comfy-canvas"
     >

apps/website/src/components/blocks/HeroLivestream01.vue

@@ -1,166 +0,0 @@
-<script setup lang="ts">
-import type { AnchorHTMLAttributes } from 'vue'
-import { computed, onMounted, ref } from 'vue'
-import { useNow } from '@vueuse/core'
-
-import Button from '../ui/button/Button.vue'
-import { resolveRel } from '../../utils/cta'
-
-type Cta = {
-  label: string
-  href: string
-  target?: AnchorHTMLAttributes['target']
-  rel?: AnchorHTMLAttributes['rel']
-}
-
-type Visual =
-  | {
-      type: 'image'
-      src: string
-      alt: string
-      width?: number
-      height?: number
-    }
-  | {
-      type: 'video'
-      src: string
-      alt: string
-      poster?: string
-      width?: number
-      height?: number
-    }
-
-const {
-  visual,
-  eyebrow,
-  title,
-  subtitle,
-  primaryCta,
-  secondaryCta,
-  youtubeVideoId,
-  startDateTime,
-  endDateTime
-} = defineProps<{
-  visual?: Visual
-  eyebrow?: string
-  title: string
-  subtitle?: string
-  primaryCta: Cta
-  secondaryCta?: Cta
-  youtubeVideoId: string
-  startDateTime: string
-  endDateTime: string
-}>()
-
-const embedUrl = computed(
-  () =>
-    `https://www.youtube-nocookie.com/embed/${youtubeVideoId}?autoplay=1&mute=1&rel=0`
-)
-
-// Keep SSR/initial paint deterministic on the logo and only flip to the embed
-// after client hydration — avoids a build-time `now` leaking into the markup.
-const mounted = ref(false)
-onMounted(() => {
-  mounted.value = true
-})
-
-const now = useNow({ interval: 30_000 })
-const startMs = computed(() => new Date(startDateTime).getTime())
-const endMs = computed(() => new Date(endDateTime).getTime())
-
-const isLive = computed(
-  () =>
-    mounted.value &&
-    now.value.getTime() >= startMs.value &&
-    now.value.getTime() < endMs.value
-)
-</script>
-
-<template>
-  <section
-    class="max-w-9xl mx-auto flex flex-col items-center px-6 py-16 text-center lg:py-24"
-  >
-    <div
-      v-if="isLive"
-      class="mb-10 aspect-video w-full overflow-hidden rounded-2xl lg:mb-12"
-    >
-      <iframe
-        :src="embedUrl"
-        :title="title"
-        class="size-full"
-        loading="lazy"
-        allow="autoplay; encrypted-media; picture-in-picture"
-        allowfullscreen
-      />
-    </div>
-    <slot v-else name="visual">
-      <img
-        v-if="visual?.type === 'image'"
-        :src="visual.src"
-        :alt="visual.alt"
-        :width="visual.width"
-        :height="visual.height"
-        fetchpriority="high"
-        decoding="async"
-        class="mb-10 h-auto w-full max-w-md lg:mb-12 lg:max-w-lg"
-      />
-      <video
-        v-else-if="visual?.type === 'video'"
-        :src="visual.src"
-        :poster="visual.poster"
-        :aria-label="visual.alt"
-        :width="visual.width"
-        :height="visual.height"
-        autoplay
-        loop
-        muted
-        playsinline
-        preload="metadata"
-        class="mb-10 h-auto w-full max-w-md lg:mb-12 lg:max-w-2xl"
-      />
-    </slot>
-
-    <p
-      v-if="eyebrow"
-      class="mb-4 text-sm font-medium tracking-wide text-primary-comfy-canvas/70 uppercase"
-    >
-      {{ eyebrow }}
-    </p>
-
-    <h1
-      class="max-w-3xl text-4xl/snug font-light tracking-tight text-pretty text-primary-comfy-canvas lg:text-6xl/snug"
-    >
-      {{ title }}
-    </h1>
-
-    <p
-      v-if="subtitle"
-      class="mt-6 max-w-2xl text-base text-primary-comfy-canvas/70 lg:text-lg"
-    >
-      {{ subtitle }}
-    </p>
-
-    <div class="mt-10 flex flex-col gap-4 sm:flex-row lg:mt-12">
-      <Button
-        as="a"
-        :href="primaryCta.href"
-        :target="primaryCta.target"
-        :rel="resolveRel(primaryCta)"
-        size="lg"
-      >
-        {{ primaryCta.label }}
-      </Button>
-      <Button
-        v-if="secondaryCta"
-        as="a"
-        :href="secondaryCta.href"
-        :target="secondaryCta.target"
-        :rel="resolveRel(secondaryCta)"
-        variant="outline"
-        size="lg"
-      >
-        {{ secondaryCta.label }}
-      </Button>
-    </div>
-  </section>
-</template>

apps/website/src/components/common/BrandButton.vue

@@ -6,7 +6,6 @@ import type { HTMLAttributes } from 'vue'
 
 import type { BrandButtonVariants } from './brandButton.variants'
 import { brandButtonVariants } from './brandButton.variants'
-import { resolveRel } from '../../utils/cta'
 
 const props = defineProps<{
   href?: string
@@ -17,8 +16,9 @@ const props = defineProps<{
   class?: HTMLAttributes['class']
 }>()
 
-const resolvedRel = computed(() =>
-  resolveRel({ rel: props.rel, target: props.target })
+const resolvedRel = computed(
+  () =>
+    props.rel ?? (props.target === '_blank' ? 'noopener noreferrer' : undefined)
 )
 </script>
 

apps/website/src/components/common/SiteFooter.vue

@@ -44,7 +44,6 @@ const topColumns: { title: string; links: FooterLink[] }[] = [
     title: t('footer.resources', locale),
     links: [
       { label: t('nav.learning', locale), href: routes.learning },
-      { label: t('nav.launches', locale), href: routes.launches },
       {
         label: t('footer.blog', locale),
         href: externalLinks.blog,

apps/website/src/components/ui/badge/Badge.vue

@@ -25,7 +25,7 @@ const {
     data-slot="badge"
     :data-variant="variant"
     :data-size="size"
-    :class="cn(badgeVariants({ size, variant }), className)"
+    :class="cn(badgeVariants({ variant, size }), className)"
   >
     <slot name="prepend">
       <component :is="prependIcon" v-if="prependIcon" />

apps/website/src/components/ui/badge/index.ts

@@ -4,16 +4,15 @@ import { cva } from 'cva'
 export const badgeVariants = cva({
   base: 'text-primary-warm-gray font-formula leading-none focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none [&>svg]:size-3',
   variants: {
-    size: {
-      md: 'px-4 py-1 text-xs',
-      xs: 'px-2 py-0.5 text-[9px]'
-    },
     variant: {
       default: 'bg-transparency-ink-t80',
       subtle: 'bg-transparency-white-t4 text-primary-comfy-canvas',
-      category: 'text-primary-comfy-yellow px-0 font-semibold uppercase',
       accent:
         'before:bg-primary-comfy-yellow relative isolate overflow-visible rounded-none bg-transparent px-2 py-0.5 text-[9px] font-bold tracking-wide text-primary-comfy-ink uppercase before:absolute before:inset-0 before:-z-10 before:-skew-x-12 before:rounded-sm'
+    },
+    size: {
+      md: 'px-4 py-1 text-xs',
+      xs: 'px-2 py-0.5 text-[9px]'
     }
   },
   defaultVariants: {

apps/website/src/components/ui/button/index.ts

@@ -8,8 +8,7 @@ export const buttonVariants = cva(
   {
     variants: {
       size: {
-        sm: 'h-8 px-4 py-2 text-xs md:text-sm',
-        default: 'h-10 px-6 py-2.5 text-xs md:text-sm',
+        default: 'h-10 px-6 py-2.5',
         lg: 'h-14 px-8 py-4 text-base'
       },
       variant: {
@@ -18,8 +17,6 @@ export const buttonVariants = cva(
         outline:
           'text-primary-comfy-yellow hover:bg-primary-comfy-yellow border uppercase hover:text-primary-comfy-ink',
         link: "text-primary-comfy-yellow h-auto justify-start px-0 py-1 text-base uppercase hover:opacity-90 [&_svg:not([class*='size-'])]:size-6",
-        underlineLink:
-          "text-primary-comfy-yellow relative h-auto justify-start px-0 py-1 uppercase after:absolute after:bottom-0 after:left-0 after:h-0.5 after:w-full after:origin-left after:scale-x-0 after:bg-current after:transition-transform after:duration-200 hover:opacity-90 hover:after:scale-x-100 [&_svg:not([class*='size-'])]:size-6",
         nav: 'text-primary-warm-white hover:text-primary-comfy-yellow h-auto justify-between px-0 py-1 text-start text-2xl font-medium',
         navMuted:
           'hover:text-primary-comfy-yellow h-auto w-full justify-between px-0 py-1 text-start text-2xl font-medium text-primary-comfy-canvas uppercase'

apps/website/src/components/ui/card/Card.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@comfyorg/tailwind-utils'
-
-const { class: className } = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="card"
-    :class="
-      cn(
-        'bg-transparency-white-t4 text-primary-warm-white rounded-4.5xl flex flex-col gap-6 shadow-sm',
-        className
-      )
-    "
-  >
-    <slot />
-  </div>
-</template>

apps/website/src/components/ui/card/CardContent.vue

@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@comfyorg/tailwind-utils'
-
-const { class: className } = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div data-slot="card-content" :class="cn('px-6', className)">
-    <slot />
-  </div>
-</template>

apps/website/src/components/ui/card/CardDescription.vue

@@ -1,19 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@comfyorg/tailwind-utils'
-
-const { class: className } = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="card-description"
-    :class="
-      cn('line-clamp-3 text-base text-primary-comfy-canvas/70', className)
-    "
-  >
-    <slot />
-  </div>
-</template>

apps/website/src/components/ui/card/CardFooter.vue

@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@comfyorg/tailwind-utils'
-
-const { class: className } = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div data-slot="card-footer" :class="cn('flex items-center', className)">
-    <slot />
-  </div>
-</template>

apps/website/src/components/ui/card/CardHeader.vue

@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@comfyorg/tailwind-utils'
-
-const { class: className } = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div data-slot="card-header" :class="cn('flex flex-col gap-1.5', className)">
-    <slot />
-  </div>
-</template>

apps/website/src/components/ui/card/CardTitle.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@comfyorg/tailwind-utils'
-
-const { class: className } = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="card-title"
-    :class="
-      cn(
-        'text-xl leading-none font-medium text-primary-comfy-canvas md:text-2xl',
-        className
-      )
-    "
-  >
-    <slot />
-  </div>
-</template>

apps/website/src/composables/useHeroLogo.ts

@@ -22,12 +22,6 @@ interface HeroLogoConfig {
   cursorTiltStrength: number
   bgScale: number
   slideDuration: number
-  svgMarkup: string
-  fitAxis: 'width' | 'height'
-  targetSize: number
-  respectReducedMotion: boolean
-  baseUrl: string
-  fadeInDurationMs: number
 }
 
 const DEFAULTS: HeroLogoConfig = {
@@ -40,25 +34,19 @@ const DEFAULTS: HeroLogoConfig = {
   extrudeDepth: 200,
   cursorTiltStrength: 0.5,
   bgScale: 0.8,
-  slideDuration: 0.4,
-  svgMarkup: SVG_MARKUP,
-  fitAxis: 'height',
-  targetSize: 3,
-  respectReducedMotion: true,
-  baseUrl: BASE_URL,
-  fadeInDurationMs: 0
+  slideDuration: 0.4
 }
 
-function buildImageUrls(baseUrl: string): string[] {
+function buildImageUrls(): string[] {
   return Array.from({ length: IMAGE_COUNT }, (_, i) => {
     const index = String(i).padStart(5, '0')
-    return `${baseUrl}/image_sequence_${index}.webp`
+    return `${BASE_URL}/image_sequence_${index}.webp`
   })
 }
 
-function parseShapes(markup: string): THREE.Shape[] {
+function parseShapes(): THREE.Shape[] {
   const loader = new SVGLoader()
-  const svgData = loader.parse(markup)
+  const svgData = loader.parse(SVG_MARKUP)
   const shapes: THREE.Shape[] = []
   svgData.paths.forEach((path) => {
     shapes.push(...SVGLoader.createShapes(path))
@@ -97,8 +85,7 @@ export function useHeroLogo(
   onMounted(async () => {
     try {
       const container = containerRef.value
-      if (!container || (cfg.respectReducedMotion && prefersReducedMotion()))
-        return
+      if (!container || prefersReducedMotion()) return
 
       const { width, height } = container.getBoundingClientRect()
 
@@ -115,9 +102,6 @@ export function useHeroLogo(
       renderer.domElement.style.width = '100%'
       renderer.domElement.style.height = '100%'
       renderer.domElement.style.opacity = '0'
-      if (cfg.fadeInDurationMs > 0) {
-        renderer.domElement.style.transition = `opacity ${cfg.fadeInDurationMs}ms ease`
-      }
       renderer.domElement.setAttribute('aria-hidden', 'true')
       container.appendChild(renderer.domElement)
 
@@ -142,36 +126,24 @@ export function useHeroLogo(
       camera.position.z = cfg.zoom
 
       // SVG shape
-      const shapes = parseShapes(cfg.svgMarkup)
+      const shapes = parseShapes()
       const tempGeo = new THREE.ShapeGeometry(shapes)
       tempGeo.computeBoundingBox()
-      const bb = tempGeo.boundingBox
-      if (!bb) {
-        tempGeo.dispose()
-        cleanup?.()
-        return
-      }
+      const bb = tempGeo.boundingBox!
       const cx = (bb.max.x + bb.min.x) / 2
       const cy = (bb.max.y + bb.min.y) / 2
-      const fitExtent =
-        cfg.fitAxis === 'width' ? bb.max.x - bb.min.x : bb.max.y - bb.min.y
-      if (fitExtent <= 0) {
-        tempGeo.dispose()
-        cleanup?.()
-        return
-      }
-      const scaleFactor = cfg.targetSize / fitExtent
+      const scaleFactor = 3 / (bb.max.y - bb.min.y)
       tempGeo.dispose()
 
       // Image sequence textures — load first frame eagerly, rest lazily
-      const urls = buildImageUrls(cfg.baseUrl)
+      const urls = buildImageUrls()
       const textures = await loadTextures(urls.slice(0, 1))
       if (disposed) return
 
       renderer.domElement.style.opacity = '1'
       loaded.value = true
 
-      void loadTextures(urls.slice(1)).then((rest) => {
+      loadTextures(urls.slice(1)).then((rest) => {
         if (!disposed) textures.push(...rest)
       })
 

apps/website/src/config/routes.ts

@@ -8,7 +8,6 @@ const baseRoutes = {
   cloudEnterprise: '/cloud/enterprise',
   api: '/api',
   gallery: '/gallery',
-  launches: '/launches',
   about: '/about',
   careers: '/careers',
   customers: '/customers',
@@ -60,7 +59,6 @@ export const externalLinks = {
   discord: 'https://discord.com/invite/comfyorg',
   docs: 'https://docs.comfy.org/',
   docsApi: 'https://docs.comfy.org/api-reference/cloud',
-  docsMcp: 'https://docs.comfy.org/agent-tools/cloud',
   docsSubscription: 'https://docs.comfy.org/support/subscription/subscribing',
   github: 'https://github.com/Comfy-Org/ComfyUI',
   githubInstall: 'https://github.com/Comfy-Org/ComfyUI#installing',

apps/website/src/data/drops.ts

@@ -1,248 +0,0 @@
-// Image URLs are placeholders at media.comfy.org/website/drops/<id>.png —
-// asset uploads and native zh-CN review are pending follow-ups (see
-// apps/website/.scratch/drops-page/PRD.md).
-import { externalLinks } from '../config/routes'
-import type { LocalizedText } from '../i18n/translations'
-
-type DropMedia =
-  | { type: 'image'; src: string; alt: LocalizedText }
-  | { type: 'video'; src: string; alt: LocalizedText; poster?: string }
-
-export type Drop = {
-  id: string
-  badge?: LocalizedText
-  category: LocalizedText
-  media: DropMedia
-  title: LocalizedText
-  description: LocalizedText
-  cta: { label: LocalizedText; href: LocalizedText }
-}
-
-const EXPLORE: LocalizedText = { en: 'EXPLORE', 'zh-CN': '探索' }
-const PLATFORM: LocalizedText = { en: 'Platform', 'zh-CN': '平台' }
-const CLOUD: LocalizedText = { en: 'Cloud', 'zh-CN': '云端' }
-const COMMUNITY: LocalizedText = { en: 'Community', 'zh-CN': '社区' }
-const DEVELOPER: LocalizedText = { en: 'Developer', 'zh-CN': '开发者' }
-const MODELS_AND_NODES: LocalizedText = {
-  en: 'Models & Nodes',
-  'zh-CN': '模型与节点'
-}
-const NEW_BADGE: LocalizedText = { en: 'NEW', 'zh-CN': '新' }
-const FEATURED_BADGE: LocalizedText = { en: 'FEATURED', 'zh-CN': '精选' }
-
-function imageFor(fileName: string, alt: LocalizedText): DropMedia {
-  return {
-    type: 'image',
-    src: `https://media.comfy.org/website/drops/${fileName}`,
-    alt
-  }
-}
-
-function videoFor(
-  fileName: string,
-  alt: LocalizedText,
-  poster?: string
-): DropMedia {
-  return {
-    type: 'video',
-    src: `https://media.comfy.org/website/drops/${fileName}`,
-    alt,
-    ...(poster && {
-      poster: `https://media.comfy.org/website/drops/${poster}`
-    })
-  }
-}
-
-export const drops: readonly Drop[] = [
-  {
-    id: 'desktop-client',
-    badge: NEW_BADGE,
-    category: PLATFORM,
-    media: imageFor('Drops_2x2card_Desktop.jpg', {
-      en: 'New Desktop Client',
-      'zh-CN': '新桌面客户端'
-    }),
-    title: { en: 'New Desktop Client', 'zh-CN': '新桌面客户端' },
-    description: {
-      en: 'A faster, redesigned desktop app for ComfyUI — one-click install and managed updates.',
-      'zh-CN': '更快、重新设计的 ComfyUI 桌面应用程序 — 一键安装与受管更新。'
-    },
-    cta: {
-      label: EXPLORE,
-      href: { en: '/download', 'zh-CN': '/zh-CN/download' }
-    }
-  },
-  {
-    id: 'app-mode',
-    badge: NEW_BADGE,
-    category: PLATFORM,
-    media: videoFor('Drops_2x2card_APP.mp4', {
-      en: 'App Mode',
-      'zh-CN': 'App 模式'
-    }),
-    title: { en: 'App Mode', 'zh-CN': 'App 模式' },
-    description: {
-      en: 'A simplified view of your workflows. Flip back to the node graph anytime to go deeper.',
-      'zh-CN': '工作流的简化视图。随时切换回节点图视图以深入了解。'
-    },
-    // TODO: no destination page yet — link out when App Mode lands.
-    cta: {
-      label: EXPLORE,
-      href: {
-        en: 'https://docs.comfy.org/interface/app-mode',
-        'zh-CN': 'https://docs.comfy.org/zh/interface/app-mode'
-      }
-    }
-  },
-  {
-    id: 'comfy-api',
-    badge: NEW_BADGE,
-    category: DEVELOPER,
-    media: imageFor('Drops_2x2card_API.jpg', {
-      en: 'Comfy API',
-      'zh-CN': 'Comfy API'
-    }),
-    title: { en: 'Comfy API', 'zh-CN': 'Comfy API' },
-    description: {
-      en: 'Turn any workflow into a production endpoint. Automate generation and scale to thousands of outputs.',
-      'zh-CN': '将任意工作流变成生产端点。自动化生成并扩展到数千个输出。'
-    },
-    cta: {
-      label: EXPLORE,
-      href: { en: '/api', 'zh-CN': '/zh-CN/api' }
-    }
-  },
-  {
-    id: 'comfy-mcp',
-    badge: NEW_BADGE,
-    category: CLOUD,
-    media: imageFor('Drops_2x2card_MCP.jpg', {
-      en: 'Comfy MCP',
-      'zh-CN': 'Comfy MCP'
-    }),
-    title: { en: 'Comfy MCP', 'zh-CN': 'Comfy MCP' },
-    description: {
-      en: 'The full power of ComfyUI from anywhere — no setup, no GPU required.',
-      'zh-CN': '随时随地体验 ComfyUI 的全部能力 — 无需配置，无需 GPU。'
-    },
-    cta: {
-      label: EXPLORE,
-      href: { en: externalLinks.docsMcp, 'zh-CN': externalLinks.docsMcp }
-    }
-  },
-  {
-    id: 'community-workflows',
-    category: COMMUNITY,
-    media: imageFor('Drops_3x3card_Comm Workflows.jpg', {
-      en: 'Community Workflows',
-      'zh-CN': '社区工作流'
-    }),
-    title: {
-      en: 'Community Workflows',
-      'zh-CN': '社区工作流'
-    },
-    description: {
-      en: 'Browse and remix thousands of community-shared workflows. Start from a proven template.',
-      'zh-CN': '浏览和混搭数千个社区共享的工作流。从经过验证的模板开始。'
-    },
-    cta: {
-      label: EXPLORE,
-      href: { en: externalLinks.workflows, 'zh-CN': externalLinks.workflows }
-    }
-  },
-  {
-    id: 'supported-models',
-    category: MODELS_AND_NODES,
-    media: imageFor('Drops_Supported models.jpg', {
-      en: 'Supported Models',
-      'zh-CN': '支持的模型'
-    }),
-    title: { en: 'Supported Models', 'zh-CN': '支持的模型' },
-    description: {
-      en: 'Run the latest open and partner models — every checkpoint, LoRA, and ControlNet, ready to use in your graph.',
-      'zh-CN':
-        '运行最新的开源和合作伙伴模型 — 每个 checkpoint、LoRA 和 ControlNet 都可直接在工作流中使用。'
-    },
-    cta: {
-      label: EXPLORE,
-      href: { en: '/p/supported-models', 'zh-CN': '/zh-CN/p/supported-models' }
-    }
-  },
-  {
-    id: 'supported-nodes',
-    category: MODELS_AND_NODES,
-    media: videoFor('Drops_3x3card_supported nodes.mp4', {
-      en: 'Supported Nodes',
-      'zh-CN': '支持的节点'
-    }),
-    title: { en: 'Supported Nodes', 'zh-CN': '支持的节点' },
-    description: {
-      en: 'Thousands of community and partner nodes, curated and verified to run on Comfy Cloud.',
-      'zh-CN':
-        '数千个社区与合作伙伴节点，经过精选与验证，可在 Comfy Cloud 上运行。'
-    },
-    cta: {
-      label: EXPLORE,
-      href: {
-        en: '/cloud/supported-nodes',
-        'zh-CN': '/zh-CN/cloud/supported-nodes'
-      }
-    }
-  },
-  {
-    id: 'comfy-enterprise',
-    category: CLOUD,
-    media: imageFor('Drops_3x3card_enterprise.png', {
-      en: 'Comfy Enterprise',
-      'zh-CN': 'Comfy 企业版'
-    }),
-    title: { en: 'Comfy Enterprise', 'zh-CN': 'Comfy 企业版' },
-    description: {
-      en: 'Enterprise-grade infrastructure for the creative engine inside your organization.',
-      'zh-CN': '为您组织内创意引擎提供的企业级基础设施。'
-    },
-    cta: {
-      label: EXPLORE,
-      href: { en: '/cloud/enterprise', 'zh-CN': '/zh-CN/cloud/enterprise' }
-    }
-  },
-  {
-    id: 'learning-hub',
-    category: COMMUNITY,
-    media: imageFor('Drops_3x3_Learninghub.jpg', {
-      en: 'Learning Hub',
-      'zh-CN': '学习中心'
-    }),
-    title: { en: 'Learning Hub', 'zh-CN': '学习中心' },
-    description: {
-      en: 'Walkthroughs and ready-to-run workflows to take you from first render to production pipeline.',
-      'zh-CN': '配套教程与开箱即用的工作流，带您从第一次渲染走向生产管线。'
-    },
-    cta: {
-      label: { en: 'START LEARNING', 'zh-CN': '开始学习' },
-      href: { en: '/learning', 'zh-CN': '/zh-CN/learning' }
-    }
-  },
-  {
-    id: 'share-comfy',
-    badge: NEW_BADGE,
-    category: COMMUNITY,
-    media: videoFor('Drops_3x3card_Affilliate.mp4', {
-      en: 'Comfy Affiliate',
-      'zh-CN': 'Comfy Affiliate'
-    }),
-    title: {
-      en: 'Comfy Affiliate',
-      'zh-CN': 'Comfy Affiliate'
-    },
-    description: {
-      en: 'Share Comfy with your audience and earn for every creator you bring on board.',
-      'zh-CN': '与您的受众分享 Comfy，为您带来的每一位创作者获得回报。'
-    },
-    // /affiliates is locale-invariant: same URL in both locales.
-    cta: {
-      label: { en: 'LEARN MORE', 'zh-CN': '了解更多' },
-      href: { en: '/affiliates', 'zh-CN': '/affiliates' }
-    }
-  }
-]

apps/website/src/data/mainNavigation.ts

@@ -180,11 +180,6 @@ export function getMainNavigation(locale: Locale): NavItem[] {
             },
             // TODO: no /brand page yet
             // { label: t('nav.brand', locale), href: '#' },
-            {
-              label: t('nav.launches', locale),
-              href: routes.launches,
-              badge: 'new'
-            },
             {
               label: t('nav.blogs', locale),
               href: externalLinks.blog,

apps/website/src/i18n/translations.ts

@@ -1849,7 +1849,6 @@ const translations = {
   'nav.aboutUs': { en: 'About Us', 'zh-CN': '关于我们' },
   'nav.careers': { en: 'Careers', 'zh-CN': '招聘' },
   'nav.customerStories': { en: 'Customer Stories', 'zh-CN': '客户故事' },
-  'nav.launches': { en: 'Launches', 'zh-CN': '发布' },
   'nav.downloadLocal': { en: 'DOWNLOAD DESKTOP', 'zh-CN': '下载桌面版' },
   'nav.launchCloud': { en: 'LAUNCH CLOUD', 'zh-CN': '启动云端' },
   'nav.ctaDesktopPrefix': { en: 'DOWNLOAD', 'zh-CN': '下载' },
@@ -4929,70 +4928,6 @@ const translations = {
   'affiliate.cta.termsLabel': {
     en: 'Read the affiliate program terms',
     'zh-CN': '阅读联盟计划条款'
-  },
-
-  // Launches page (/launches) — head metadata
-  // zh-CN strings pending native review (see apps/website/.scratch/drops-page/PRD.md)
-  'launches.page.title': {
-    en: 'ComfyUI Live Demo & Q&A — June 29 Launch Livestream',
-    'zh-CN': 'ComfyUI 直播演示与问答 — 6 月 29 日发布直播'
-  },
-  'launches.page.description': {
-    en: 'Join the ComfyUI livestream on June 29 for a hands-on product demo and live Q&A. See what’s new across desktop, cloud, and community, and get your questions answered.',
-    'zh-CN':
-      '6 月 29 日加入 ComfyUI 直播，观看实操产品演示并参与实时问答。了解桌面、云端和社区的最新内容，并获得解答。'
-  },
-
-  // Launches page (/launches) — hero section
-  // zh-CN strings pending native review (see apps/website/.scratch/drops-page/PRD.md)
-  'launches.hero.title': {
-    en: 'Everything new in ComfyUI',
-    'zh-CN': 'ComfyUI 全新内容'
-  },
-  'launches.hero.primary': {
-    en: 'Download Desktop',
-    'zh-CN': '下载桌面版'
-  },
-  'launches.hero.secondary': {
-    en: 'Launch Cloud',
-    'zh-CN': '启动云端'
-  },
-  'launches.hero.visualAlt': {
-    en: 'Comfy',
-    'zh-CN': 'Comfy'
-  },
-
-  // Launches page (/launches) — subscribe banner
-  // zh-CN strings pending native review (see apps/website/.scratch/drops-page/PRD.md)
-  'launches.banner.text': {
-    en: 'Join the live stream. Get answers in real time.',
-    'zh-CN': '加入直播，实时获得解答。'
-  },
-  'launches.banner.cta': {
-    en: 'Join livestream',
-    'zh-CN': '加入直播'
-  },
-
-  // Launches page (/launches) — closing CTA
-  // zh-CN strings pending native review (see apps/website/.scratch/drops-page/PRD.md)
-  'launches.cta.heading': {
-    en: 'Everything Comfy ships. All in one place.',
-    'zh-CN': 'Comfy 的全部内容，一处尽享。'
-  },
-  'launches.cta.primary': {
-    en: 'Open Comfy Cloud',
-    'zh-CN': '打开 Comfy Cloud'
-  },
-  'launches.cta.secondary': {
-    en: 'Try Workflow',
-    'zh-CN': '试用工作流'
-  },
-
-  // Launches page (/launches) — launches grid
-  // zh-CN strings pending native review (see apps/website/.scratch/drops-page/PRD.md)
-  'launches.section.title': {
-    en: 'Latest Launches',
-    'zh-CN': '最新发布'
   }
 } as const satisfies Record<string, Record<Locale, string>>
 

apps/website/src/pages/launches.astro

@@ -1,20 +0,0 @@
----
-import BaseLayout from '../layouts/BaseLayout.astro'
-import CtaSection from '../templates/drops/CtaSection.vue'
-import DropsSection from '../templates/drops/DropsSection.vue'
-import HeroSection from '../templates/drops/HeroSection.vue'
-import SubscribeBanner from '../templates/drops/SubscribeBanner.vue'
-import { t } from '../i18n/translations'
-
-const locale = 'en' as const
----
-
-<BaseLayout
-  title={t('launches.page.title', locale)}
-  description={t('launches.page.description', locale)}
->
-  <SubscribeBanner locale={locale} client:load />
-  <HeroSection locale={locale} client:load />
-  <DropsSection locale={locale} />
-  <CtaSection locale={locale} />
-</BaseLayout>

apps/website/src/pages/zh-CN/launches.astro

@@ -1,20 +0,0 @@
----
-import BaseLayout from '../../layouts/BaseLayout.astro'
-import CtaSection from '../../templates/drops/CtaSection.vue'
-import DropsSection from '../../templates/drops/DropsSection.vue'
-import HeroSection from '../../templates/drops/HeroSection.vue'
-import SubscribeBanner from '../../templates/drops/SubscribeBanner.vue'
-import { t } from '../../i18n/translations'
-
-const locale = 'zh-CN' as const
----
-
-<BaseLayout
-  title={t('launches.page.title', locale)}
-  description={t('launches.page.description', locale)}
->
-  <SubscribeBanner locale={locale} client:load />
-  <HeroSection locale={locale} client:load />
-  <DropsSection locale={locale} />
-  <CtaSection locale={locale} />
-</BaseLayout>

apps/website/src/templates/drops/CtaSection.vue

@@ -1,25 +0,0 @@
-<script setup lang="ts">
-import type { Locale } from '../../i18n/translations'
-
-import CtaCenter01 from '../../components/blocks/CtaCenter01.vue'
-import { externalLinks } from '../../config/routes'
-import { t } from '../../i18n/translations'
-
-const { locale = 'en' } = defineProps<{ locale?: Locale }>()
-</script>
-
-<template>
-  <CtaCenter01
-    :heading="t('launches.cta.heading', locale)"
-    :primary-cta="{
-      label: t('launches.cta.primary', locale),
-      href: externalLinks.cloud,
-      target: '_blank'
-    }"
-    :secondary-cta="{
-      label: t('launches.cta.secondary', locale),
-      href: externalLinks.workflows,
-      target: '_blank'
-    }"
-  />
-</template>

apps/website/src/templates/drops/DropCard.vue

@@ -1,76 +0,0 @@
-<script setup lang="ts">
-import type { Drop } from '../../data/drops'
-import type { Locale } from '../../i18n/translations'
-import Badge from '../../components/ui/badge/Badge.vue'
-
-import ButtonPill from '../../components/ui/button-pill/ButtonPill.vue'
-import Card from '../../components/ui/card/Card.vue'
-import CardContent from '../../components/ui/card/CardContent.vue'
-import CardDescription from '../../components/ui/card/CardDescription.vue'
-import CardFooter from '../../components/ui/card/CardFooter.vue'
-import CardHeader from '../../components/ui/card/CardHeader.vue'
-import CardTitle from '../../components/ui/card/CardTitle.vue'
-
-const { drop, locale } = defineProps<{
-  drop: Drop
-  locale: Locale
-}>()
-</script>
-
-<template>
-  <Card class="group/pill-trigger relative h-full overflow-hidden">
-    <a
-      :href="drop.cta.href[locale]"
-      :aria-label="`${drop.title[locale]} — ${drop.cta.label[locale]}`"
-      class="rounded-4.5xl focus-visible:ring-primary-comfy-yellow absolute inset-0 z-10 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none"
-    />
-
-    <div class="flex flex-col-reverse">
-      <CardHeader class="gap-2 px-6">
-        <Badge variant="category">
-          {{ drop.category[locale] }}
-        </Badge>
-        <CardTitle class="pt-4">
-          {{ drop.title[locale] }}
-        </CardTitle>
-        <CardDescription>
-          {{ drop.description[locale] }}
-        </CardDescription>
-      </CardHeader>
-
-      <CardContent class="relative p-2">
-        <div class="aspect-video w-full overflow-hidden rounded-4xl">
-          <img
-            v-if="drop.media.type === 'image'"
-            :src="drop.media.src"
-            :alt="drop.media.alt[locale]"
-            loading="lazy"
-            decoding="async"
-            class="size-full object-cover object-center transition-transform duration-500 ease-out group-hover/pill-trigger:scale-105"
-          />
-          <video
-            v-else
-            :src="drop.media.src"
-            :poster="drop.media.poster"
-            :aria-label="drop.media.alt[locale]"
-            autoplay
-            loop
-            muted
-            playsinline
-            preload="metadata"
-            class="size-full object-cover object-center transition-transform duration-500 ease-out group-hover/pill-trigger:scale-105"
-          />
-        </div>
-        <Badge v-if="drop.badge" variant="accent" class="absolute top-6 left-8">
-          {{ drop.badge[locale] }}
-        </Badge>
-      </CardContent>
-    </div>
-
-    <CardFooter class="mt-auto px-6 pb-6">
-      <ButtonPill as="span" variant="ghost" icon-position="left">
-        {{ drop.cta.label[locale] }}
-      </ButtonPill>
-    </CardFooter>
-  </Card>
-</template>

apps/website/src/templates/drops/DropsSection.vue

@@ -1,29 +0,0 @@
-<script setup lang="ts">
-import type { Locale } from '../../i18n/translations'
-
-import DropCard from './DropCard.vue'
-import { drops } from '../../data/drops'
-import { t } from '../../i18n/translations'
-
-const { locale = 'en' } = defineProps<{ locale?: Locale }>()
-</script>
-
-<template>
-  <section class="max-w-9xl mx-auto px-6 py-16 lg:py-24">
-    <h2
-      class="text-primary-warm-white text-3xl font-light tracking-tight lg:text-5xl"
-    >
-      {{ t('launches.section.title', locale) }}
-    </h2>
-
-    <div class="mt-10 grid grid-cols-1 gap-6 md:grid-cols-6 lg:mt-12">
-      <div
-        v-for="(drop, index) in drops"
-        :key="drop.id"
-        :class="index < 4 ? 'md:col-span-3' : 'md:col-span-2'"
-      >
-        <DropCard :drop :locale />
-      </div>
-    </div>
-  </section>
-</template>

apps/website/src/templates/drops/HeroSection.vue

@@ -1,35 +0,0 @@
-<script setup lang="ts">
-import type { Locale } from '../../i18n/translations'
-
-import HeroLivestream01 from '../../components/blocks/HeroLivestream01.vue'
-import LaunchesHeroLogo from './LaunchesHeroLogo.vue'
-import { externalLinks, getRoutes } from '../../config/routes'
-import { t } from '../../i18n/translations'
-import { livestream } from './livestream'
-
-const { locale = 'en' } = defineProps<{ locale?: Locale }>()
-
-const routes = getRoutes(locale)
-</script>
-
-<template>
-  <HeroLivestream01
-    :title="t('launches.hero.title', locale)"
-    :primary-cta="{
-      label: t('launches.hero.primary', locale),
-      href: routes.download
-    }"
-    :secondary-cta="{
-      label: t('launches.hero.secondary', locale),
-      href: externalLinks.cloud,
-      target: '_blank'
-    }"
-    :youtube-video-id="livestream.youtubeVideoId"
-    :start-date-time="livestream.startDateTime"
-    :end-date-time="livestream.endDateTime"
-  >
-    <template #visual>
-      <LaunchesHeroLogo :label="t('launches.hero.visualAlt', locale)" />
-    </template>
-  </HeroLivestream01>
-</template>

apps/website/src/templates/drops/SubscribeBanner.vue

@@ -1,61 +0,0 @@
-<script setup lang="ts">
-import { useTimeoutFn } from '@vueuse/core'
-import { onMounted, ref } from 'vue'
-
-import type { Locale } from '../../i18n/translations'
-
-import { t } from '../../i18n/translations'
-import Button from '@/components/ui/button/Button.vue'
-import { resolveRel } from '../../utils/cta'
-import { livestream } from './livestream'
-
-const { locale = 'en' } = defineProps<{ locale?: Locale }>()
-
-const signUpHref = `https://www.youtube.com/watch?v=${livestream.youtubeVideoId}`
-const signUpRel = resolveRel({ target: '_blank' })
-
-// Hide once the livestream window closes — both for visitors arriving after
-// the event and for visitors whose tab is open when it ends.
-const endMs = new Date(livestream.endDateTime).getTime()
-const visible = ref(true)
-
-// useTimeoutFn auto-clears on unmount. Arm it client-side only so SSR never
-// schedules a long-lived server timer.
-const { start } = useTimeoutFn(
-  () => {
-    visible.value = false
-  },
-  () => Math.max(0, endMs - Date.now()),
-  { immediate: false }
-)
-
-onMounted(() => {
-  if (endMs - Date.now() <= 0) {
-    visible.value = false
-  } else {
-    start()
-  }
-})
-</script>
-
-<template>
-  <div v-if="visible" class="px-4">
-    <div
-      class="bg-primary-comfy-plum max-w-8xl rounded-5xl text-primary-warm-white mx-auto flex w-full flex-col items-center justify-center gap-2 px-6 py-5 text-center text-sm sm:flex-row sm:gap-4"
-    >
-      <p class="ppformula-text-center">
-        {{ t('launches.banner.text', locale) }}
-      </p>
-      <Button
-        :href="signUpHref"
-        as="a"
-        variant="underlineLink"
-        size="sm"
-        target="_blank"
-        :rel="signUpRel"
-      >
-        {{ t('launches.banner.cta', locale) }}
-      </Button>
-    </div>
-  </div>
-</template>

apps/website/src/templates/drops/livestream.ts

@@ -1,5 +0,0 @@
-export const livestream = {
-  youtubeVideoId: 'yo7b_zHd20g',
-  startDateTime: '2026-06-29T15:00:00Z',
-  endDateTime: '2026-07-02T17:15:00Z'
-} as const

apps/website/src/utils/cta.test.ts

@@ -1,18 +0,0 @@
-import { describe, expect, it } from 'vitest'
-
-import { resolveRel } from './cta'
-
-describe('resolveRel', () => {
-  it('prefers an explicit rel over the target-derived default', () => {
-    expect(resolveRel({ rel: 'nofollow', target: '_blank' })).toBe('nofollow')
-  })
-
-  it('adds noopener noreferrer for _blank targets', () => {
-    expect(resolveRel({ target: '_blank' })).toBe('noopener noreferrer')
-  })
-
-  it('returns undefined for non-blank targets', () => {
-    expect(resolveRel({ target: '_self' })).toBeUndefined()
-    expect(resolveRel({})).toBeUndefined()
-  })
-})

apps/website/src/utils/cta.ts

@@ -1,10 +0,0 @@
-import type { AnchorHTMLAttributes } from 'vue'
-
-export function resolveRel(cta: {
-  rel?: AnchorHTMLAttributes['rel']
-  target?: AnchorHTMLAttributes['target']
-}): AnchorHTMLAttributes['rel'] {
-  return (
-    cta.rel ?? (cta.target === '_blank' ? 'noopener noreferrer' : undefined)
-  )
-}

browser_tests/assets/missing/missing_model_nested_promoted_widget.json

@@ -1,197 +0,0 @@
-{
-  "id": "test-missing-model-nested-promoted-widget",
-  "revision": 0,
-  "last_node_id": 4,
-  "last_link_id": 0,
-  "nodes": [
-    {
-      "id": 3,
-      "type": "outer-subgraph-with-promoted-missing-model",
-      "pos": [10, 250],
-      "size": [400, 200],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "title": "Resolved Shared Outer Subgraph",
-      "inputs": [],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": ["resolved_model.safetensors"]
-    },
-    {
-      "id": 4,
-      "type": "outer-subgraph-with-promoted-missing-model",
-      "pos": [450, 250],
-      "size": [400, 200],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "title": "Outer Subgraph with Promoted Missing Model",
-      "inputs": [],
-      "outputs": [],
-      "properties": {},
-      "widgets_values": ["fake_model.safetensors"]
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "outer-subgraph-with-promoted-missing-model",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 2,
-          "lastLinkId": 2,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "Outer Subgraph with Promoted Missing Model",
-        "inputNode": {
-          "id": -10,
-          "bounding": [100, 200, 120, 60]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [600, 200, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "outer-ckpt-name-input-id",
-            "name": "ckpt_name",
-            "type": "COMBO",
-            "linkIds": [2],
-            "pos": { "0": 150, "1": 220 }
-          }
-        ],
-        "outputs": [],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 2,
-            "type": "inner-subgraph-with-promoted-missing-model",
-            "pos": [250, 180],
-            "size": [400, 200],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "ckpt_name",
-                "name": "ckpt_name",
-                "type": "COMBO",
-                "widget": {
-                  "name": "ckpt_name"
-                },
-                "link": 2
-              }
-            ],
-            "outputs": [],
-            "properties": {},
-            "widgets_values": ["fake_model.safetensors"]
-          }
-        ],
-        "links": [
-          {
-            "id": 2,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 2,
-            "target_slot": 0,
-            "type": "COMBO"
-          }
-        ]
-      },
-      {
-        "id": "inner-subgraph-with-promoted-missing-model",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 1,
-          "lastLinkId": 1,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "Inner Subgraph with Promoted Missing Model",
-        "inputNode": {
-          "id": -10,
-          "bounding": [100, 200, 120, 60]
-        },
-        "outputNode": {
-          "id": -20,
-          "bounding": [500, 200, 120, 60]
-        },
-        "inputs": [
-          {
-            "id": "inner-ckpt-name-input-id",
-            "name": "ckpt_name",
-            "type": "COMBO",
-            "linkIds": [1],
-            "pos": { "0": 150, "1": 220 }
-          }
-        ],
-        "outputs": [],
-        "widgets": [],
-        "nodes": [
-          {
-            "id": 1,
-            "type": "CheckpointLoaderSimple",
-            "pos": [250, 180],
-            "size": [315, 98],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "inputs": [
-              {
-                "localized_name": "ckpt_name",
-                "name": "ckpt_name",
-                "type": "COMBO",
-                "widget": {
-                  "name": "ckpt_name"
-                },
-                "link": 1
-              }
-            ],
-            "outputs": [
-              { "name": "MODEL", "type": "MODEL", "links": null },
-              { "name": "CLIP", "type": "CLIP", "links": null },
-              { "name": "VAE", "type": "VAE", "links": null }
-            ],
-            "properties": {
-              "Node name for S&R": "CheckpointLoaderSimple"
-            },
-            "widgets_values": ["fake_model.safetensors"]
-          }
-        ],
-        "links": [
-          {
-            "id": 1,
-            "origin_id": -10,
-            "origin_slot": 0,
-            "target_id": 1,
-            "target_slot": 0,
-            "type": "COMBO"
-          }
-        ]
-      }
-    ]
-  },
-  "config": {},
-  "extra": {
-    "ds": {
-      "scale": 1,
-      "offset": [0, 0]
-    }
-  },
-  "models": [
-    {
-      "name": "fake_model.safetensors",
-      "url": "http://localhost:8188/api/devtools/fake_model.safetensors",
-      "directory": "checkpoints"
-    }
-  ],
-  "version": 0.4
-}

browser_tests/fixtures/components/SidebarTab.ts

@@ -93,7 +93,7 @@ export class NodeLibrarySidebarTabV2 extends SidebarTab {
   public readonly searchInput: Locator
   public readonly sidebarContent: Locator
   public readonly allTab: Locator
-  public readonly essentialsTab: Locator
+  public readonly blueprintsTab: Locator
   public readonly sortButton: Locator
   public readonly nodePreview: Locator
 
@@ -101,8 +101,8 @@ export class NodeLibrarySidebarTabV2 extends SidebarTab {
     super(page, 'node-library')
     this.searchInput = page.getByPlaceholder('Search...')
     this.sidebarContent = page.locator('.sidebar-content-container')
-    this.allTab = this.getTab('All nodes')
-    this.essentialsTab = this.getTab('Essentials')
+    this.allTab = this.getTab('All')
+    this.blueprintsTab = this.getTab('Blueprints')
     this.sortButton = this.sidebarContent.getByRole('button', { name: 'Sort' })
     this.nodePreview = page.getByTestId(TestIds.sidebar.nodePreviewCard)
   }

browser_tests/fixtures/data/cloudWorkspace.ts

@@ -1,96 +0,0 @@
-import type {
-  BillingStatusResponse,
-  Member,
-  Plan,
-  WorkspaceWithRole
-} from '@/platform/workspace/api/workspaceApi'
-import type { RemoteConfig } from '@/platform/remoteConfig/types'
-
-// `/api/features` is the remote-config source: production builds resolve the
-// workspaces flag from it (the `ff:` localStorage override is dev-only).
-export const WORKSPACE_FEATURE_FLAG: RemoteConfig = {
-  team_workspaces_enabled: true
-}
-
-export const TEAM_WORKSPACE: WorkspaceWithRole = {
-  id: 'ws-team',
-  name: 'Team Comfy',
-  type: 'team',
-  created_at: '2025-01-01T00:00:00Z',
-  joined_at: '2025-01-02T00:00:00Z',
-  role: 'owner',
-  subscription_tier: 'PRO'
-}
-
-export const CREATOR: Member = {
-  id: 'u-liz',
-  name: 'Liz',
-  email: 'liz@test.comfy.org',
-  joined_at: '2025-01-01T00:00:00Z',
-  role: 'owner',
-  is_original_owner: true
-}
-
-// Identity must match the CloudAuthHelper mock user so this row counts as
-// "(You)".
-export const VIEWER: Member = {
-  id: 'u-me',
-  name: 'E2E Test User',
-  email: 'e2e@test.comfy.org',
-  joined_at: '2025-01-02T00:00:00Z',
-  role: 'owner',
-  is_original_owner: false
-}
-
-export const MEMBER_JANE: Member = {
-  id: 'u-jane',
-  name: 'Jane',
-  email: 'jane@test.comfy.org',
-  joined_at: '2025-01-03T00:00:00Z',
-  role: 'member',
-  is_original_owner: false
-}
-
-export const MEMBER_JOHN: Member = {
-  id: 'u-john',
-  name: 'John',
-  email: 'john@test.comfy.org',
-  joined_at: '2025-01-04T00:00:00Z',
-  role: 'member',
-  is_original_owner: false
-}
-
-export const DEFAULT_TEAM_MEMBERS: Member[] = [
-  CREATOR,
-  VIEWER,
-  MEMBER_JANE,
-  MEMBER_JOHN
-]
-
-export const TEAM_BILLING_STATUS: BillingStatusResponse = {
-  is_active: true,
-  subscription_status: 'active',
-  subscription_tier: 'PRO',
-  subscription_duration: 'MONTHLY',
-  plan_slug: 'pro-monthly',
-  billing_status: 'paid',
-  has_funds: true,
-  renewal_date: '2099-02-20T00:00:00Z'
-}
-
-// `max_seats > 1` on the current plan is what flips `isOnTeamPlan`, which gates
-// the whole role-management UI.
-export const TEAM_PRO_PLAN: Plan = {
-  slug: 'pro-monthly',
-  tier: 'PRO',
-  duration: 'MONTHLY',
-  price_cents: 10000,
-  credits_cents: 21100,
-  max_seats: 30,
-  availability: { available: true },
-  seat_summary: {
-    seat_count: 4,
-    total_cost_cents: 40000,
-    total_credits_cents: 0
-  }
-}

browser_tests/fixtures/helpers/CloudWorkspaceMockHelper.ts

@@ -1,150 +0,0 @@
-import type { Page, Route } from '@playwright/test'
-
-import type { Member } from '@/platform/workspace/api/workspaceApi'
-
-import { mockSystemStats } from '@e2e/fixtures/data/systemStats'
-import {
-  DEFAULT_TEAM_MEMBERS,
-  TEAM_BILLING_STATUS,
-  TEAM_PRO_PLAN,
-  TEAM_WORKSPACE,
-  WORKSPACE_FEATURE_FLAG
-} from '@e2e/fixtures/data/cloudWorkspace'
-import { CloudAuthHelper } from '@e2e/fixtures/helpers/CloudAuthHelper'
-
-interface RoleChangeRequest {
-  url: string
-  role: string
-}
-
-interface MemberMockState {
-  members: Member[]
-  patches: RoleChangeRequest[]
-}
-
-const jsonRoute = (body: unknown) => ({
-  status: 200,
-  contentType: 'application/json',
-  body: JSON.stringify(body)
-})
-
-/**
- * Boots the cloud app against fully mocked workspace + billing endpoints so
- * member/role specs can drive a raw `page` (the `comfyPage` fixture would try
- * to reach the OSS devtools backend during setup).
- *
- * Returns the mutable mock state: `members` reflects PATCH-applied roles and
- * `patches` records every role-change request for assertion.
- */
-export class CloudWorkspaceMockHelper {
-  constructor(private readonly page: Page) {}
-
-  async setup(
-    members: Member[] = DEFAULT_TEAM_MEMBERS
-  ): Promise<MemberMockState> {
-    const state = await this.mockBoot(members)
-    await new CloudAuthHelper(this.page).mockAuth()
-    await this.page.addInitScript(() => {
-      localStorage.setItem('Comfy.userId', 'test-user-e2e')
-      localStorage.setItem('Comfy.Workspace.LastWorkspaceId', 'ws-team')
-    })
-    return state
-  }
-
-  private async mockBoot(members: Member[]): Promise<MemberMockState> {
-    const state: MemberMockState = {
-      members: members.map((m) => ({ ...m })),
-      patches: []
-    }
-    const { page } = this
-
-    await page.route('**/api/features', (r) =>
-      r.fulfill(jsonRoute(WORKSPACE_FEATURE_FLAG))
-    )
-    await page.route('**/api/system_stats', (r) =>
-      r.fulfill(jsonRoute(mockSystemStats))
-    )
-    await page.route('**/api/users', (r) =>
-      r.fulfill(
-        jsonRoute({
-          storage: 'server',
-          migrated: true,
-          users: { 'test-user-e2e': 'E2E Test User' }
-        })
-      )
-    )
-    // A non-empty settings payload with TutorialCompleted marks the user as
-    // returning, so the new-user Templates dialog never auto-opens to block the
-    // Settings button. Errors tab off suppresses the model-folder 401 toast.
-    await page.route('**/api/settings', (r) =>
-      r.fulfill(
-        jsonRoute({
-          'Comfy.TutorialCompleted': true,
-          'Comfy.RightSidePanel.ShowErrorsTab': false
-        })
-      )
-    )
-    await page.route('**/api/userdata**', (r) => r.fulfill(jsonRoute([])))
-    await page.route('**/api/extensions', (r) => r.fulfill(jsonRoute([])))
-    await page.route('**/api/object_info', (r) => r.fulfill(jsonRoute({})))
-    await page.route('**/api/global_subgraphs', (r) => r.fulfill(jsonRoute({})))
-    await page.route('**/api/i18n', (r) => r.fulfill(jsonRoute({})))
-    await page.route('**/api/auth/session', (r) =>
-      r.fulfill(jsonRoute({ token: 'mock-workspace-token' }))
-    )
-    await page.route('**/api/auth/token', (r) =>
-      r.fulfill(jsonRoute({ token: 'mock-workspace-token' }))
-    )
-    await page.route('**/releases**', (r) => r.fulfill(jsonRoute([])))
-
-    await page.route('**/api/workspaces', (r) =>
-      r.fulfill(jsonRoute({ workspaces: [TEAM_WORKSPACE] }))
-    )
-
-    await page.route('**/api/workspace/members**', (route: Route) => {
-      const request = route.request()
-      if (request.method() === 'PATCH') {
-        const url = request.url()
-        const id = url.match(/\/api\/workspace\/members\/([^/?]+)/)?.[1]
-        const { role } = request.postDataJSON() as { role: Member['role'] }
-        state.patches.push({ url, role })
-        const member = state.members.find((m) => m.id === id)
-        if (member) member.role = role
-        // Echo the updated row like the real BE; the store merges only the role
-        // locally, so the response body shape is not load-bearing.
-        return route.fulfill(jsonRoute(member))
-      }
-      return route.fulfill(
-        jsonRoute({
-          members: state.members,
-          pagination: { offset: 0, limit: 50, total: state.members.length }
-        })
-      )
-    })
-    await page.route('**/api/workspace/invites', (r) =>
-      r.fulfill(jsonRoute({ invites: [] }))
-    )
-
-    await page.route('**/api/billing/status', (r) =>
-      r.fulfill(jsonRoute(TEAM_BILLING_STATUS))
-    )
-    await page.route('**/api/billing/balance', (r) =>
-      r.fulfill(
-        jsonRoute({
-          amount_micros: 6000,
-          currency: 'usd',
-          effective_balance_micros: 6000,
-          cloud_credit_balance_micros: 5000,
-          prepaid_balance_micros: 1000
-        })
-      )
-    )
-    await page.route('**/api/billing/plans', (r) =>
-      r.fulfill(
-        jsonRoute({ current_plan_slug: 'pro-monthly', plans: [TEAM_PRO_PLAN] })
-      )
-    )
-
-    return state
-  }
-}

browser_tests/fixtures/utils/cloudBillingMocks.ts

@@ -1,34 +0,0 @@
-import type { Page } from '@playwright/test'
-
-import { jsonRoute } from '@e2e/fixtures/utils/jsonRoute'
-
-/**
- * Minimal valid billing shapes so the billing facade resolves while a
- * subscription dialog mounts. Active personal sub with zero balance.
- */
-export async function mockBilling(page: Page) {
-  await page.route('**/api/billing/status', (r) =>
-    r.fulfill(
-      jsonRoute({
-        is_active: true,
-        has_funds: true,
-        subscription_status: 'active',
-        subscription_tier: 'pro',
-        subscription_duration: 'MONTHLY',
-        billing_status: 'paid'
-      })
-    )
-  )
-  await page.route('**/api/billing/balance', (r) =>
-    r.fulfill(jsonRoute({ amount_micros: 0, currency: 'usd' }))
-  )
-  await page.route('**/api/billing/plans', (r) =>
-    r.fulfill(jsonRoute({ plans: [] }))
-  )
-  await page.route('**/customers/cloud-subscription-status', (r) =>
-    r.fulfill(jsonRoute({ is_active: false }))
-  )
-  await page.route('**/customers/balance', (r) =>
-    r.fulfill(jsonRoute({ amount_micros: 0, currency: 'usd' }))
-  )
-}

browser_tests/fixtures/utils/cloudBootMocks.ts

@@ -1,64 +0,0 @@
-import type { Page } from '@playwright/test'
-
-import type { RemoteConfig } from '@/platform/remoteConfig/types'
-
-import { mockSystemStats } from '@e2e/fixtures/data/systemStats'
-import { CloudAuthHelper } from '@e2e/fixtures/helpers/CloudAuthHelper'
-import { jsonRoute } from '@e2e/fixtures/utils/jsonRoute'
-
-interface CloudBootOptions {
-  /** Remote-config payload for `/api/features` (enables the flags under test). */
-  features: RemoteConfig
-  /** Body for `/api/settings` (defaults to `{}`). */
-  settings?: unknown
-}
-
-/**
- * Stub the core endpoints the cloud app hits on boot so a raw `page` reaches the
- * working app without falling through to the OSS devtools backend. Specs layer
- * their own feature- or flow-specific routes on top.
- */
-export async function mockCloudBoot(
-  page: Page,
-  { features, settings = {} }: CloudBootOptions
-) {
-  await page.route('**/api/features', (r) => r.fulfill(jsonRoute(features)))
-  await page.route('**/api/system_stats', (r) =>
-    r.fulfill(jsonRoute(mockSystemStats))
-  )
-  await page.route('**/api/users', (r) =>
-    r.fulfill(
-      jsonRoute({
-        storage: 'server',
-        migrated: true,
-        users: { 'test-user-e2e': 'E2E Test User' }
-      })
-    )
-  )
-  await page.route('**/api/user', (r) =>
-    r.fulfill(jsonRoute({ status: 'active' }))
-  )
-  await page.route('**/api/settings', (r) => r.fulfill(jsonRoute(settings)))
-  await page.route('**/api/userdata**', (r) => r.fulfill(jsonRoute([])))
-  await page.route('**/api/extensions', (r) => r.fulfill(jsonRoute([])))
-  await page.route('**/api/object_info', (r) => r.fulfill(jsonRoute({})))
-  await page.route('**/api/global_subgraphs', (r) => r.fulfill(jsonRoute({})))
-  await page.route('**/api/i18n', (r) => r.fulfill(jsonRoute({})))
-  await page.route('**/api/auth/session', (r) =>
-    r.fulfill(jsonRoute({ token: 'mock-workspace-token' }))
-  )
-  await page.route('**/releases**', (r) => r.fulfill(jsonRoute([])))
-}
-
-/**
- * Mock Firebase auth and pre-select the e2e user so the cloud app boots
- * signed-in. The signed-in email (`e2e@test.comfy.org`) is what the
- * original-owner gate matches against the members self-row.
- */
-export async function bootCloud(page: Page) {
-  const auth = new CloudAuthHelper(page)
-  await auth.mockAuth()
-  await page.addInitScript(() => {
-    localStorage.setItem('Comfy.userId', 'test-user-e2e')
-  })
-}

browser_tests/fixtures/utils/jsonRoute.ts

@@ -1,12 +0,0 @@
-/**
- * Build a 200 JSON body for `route.fulfill()`. Generic so callers can type the
- * payload (e.g. `jsonRoute({ ... } satisfies RemoteConfig)`) and catch contract
- * drift against the real API shape.
- */
-export function jsonRoute<T>(body: T) {
-  return {
-    status: 200,
-    contentType: 'application/json',
-    body: JSON.stringify(body)
-  }
-}

browser_tests/fixtures/utils/objectInfo.ts

@@ -1,136 +0,0 @@
-import type { Page, Route } from '@playwright/test'
-
-import {
-  getComboSpecComboOptions,
-  isComboInputSpec,
-  isComboInputSpecV1
-} from '@/schemas/nodeDefSchema'
-import type {
-  ComboInputSpec,
-  ComboInputSpecV2,
-  ComfyNodeDef,
-  InputSpec
-} from '@/schemas/nodeDefSchema'
-
-export type ObjectInfoResponse = Record<string, ComfyNodeDef>
-
-type ComboInput = ComboInputSpec | ComboInputSpecV2
-
-const OBJECT_INFO_ROUTE = '**/object_info'
-
-function getRequiredInput(
-  objectInfo: ObjectInfoResponse,
-  nodeType: string,
-  inputName: string
-): InputSpec {
-  const nodeInfo = objectInfo[nodeType]
-  if (!nodeInfo) {
-    throw new Error(`Missing object_info entry for ${nodeType}`)
-  }
-
-  const requiredInputs = nodeInfo.input?.required
-  if (!requiredInputs) {
-    throw new Error(`Missing required inputs for ${nodeType}`)
-  }
-
-  const input = requiredInputs[inputName]
-  if (!input) {
-    throw new Error(`Missing input ${nodeType}.${inputName}`)
-  }
-
-  return input
-}
-
-function getComboInput(
-  objectInfo: ObjectInfoResponse,
-  nodeType: string,
-  inputName: string
-): ComboInput {
-  const input = getRequiredInput(objectInfo, nodeType, inputName)
-  if (isComboInputSpec(input)) {
-    return input
-  }
-
-  throw new Error(`Expected ${nodeType}.${inputName} to be a combo input`)
-}
-
-export function setComboInputOptions(
-  objectInfo: ObjectInfoResponse,
-  nodeType: string,
-  inputName: string,
-  values: ReadonlyArray<string | number>
-): void {
-  const input = getComboInput(objectInfo, nodeType, inputName)
-  const nextValues = [...values]
-
-  if (isComboInputSpecV1(input)) {
-    input[0] = nextValues
-    return
-  }
-
-  input[1] = { ...input[1], options: nextValues }
-}
-
-export function appendComboInputOptions(
-  objectInfo: ObjectInfoResponse,
-  nodeType: string,
-  inputName: string,
-  values: ReadonlyArray<string | number>
-): void {
-  const input = getComboInput(objectInfo, nodeType, inputName)
-  setComboInputOptions(objectInfo, nodeType, inputName, [
-    ...getComboSpecComboOptions(input),
-    ...values
-  ])
-}
-
-export async function routeObjectInfoFromSetupApi(
-  page: Page,
-  customize?: (objectInfo: ObjectInfoResponse) => void | Promise<void>
-): Promise<() => Promise<void>> {
-  const setupApiUrl =
-    process.env.PLAYWRIGHT_SETUP_API_URL ?? 'http://127.0.0.1:8188'
-  const objectInfoUrl = new URL('/object_info', setupApiUrl).toString()
-
-  const objectInfoRouteHandler = async (route: Route) => {
-    let objectInfo: ObjectInfoResponse
-    try {
-      const response = await fetch(objectInfoUrl, {
-        signal: AbortSignal.timeout(5_000)
-      })
-      if (!response.ok) {
-        await route.fulfill({
-          status: response.status,
-          contentType: response.headers.get('content-type') ?? 'text/plain',
-          body: await response.text()
-        })
-        return
-      }
-
-      objectInfo = (await response.json()) as ObjectInfoResponse
-    } catch (error) {
-      const message = error instanceof Error ? error.message : String(error)
-      await route.fulfill({
-        status: 502,
-        contentType: 'application/json',
-        body: JSON.stringify({
-          error: `Failed to fetch setup object_info from ${objectInfoUrl}: ${message}`
-        })
-      })
-      return
-    }
-
-    await customize?.(objectInfo)
-    await route.fulfill({
-      status: 200,
-      contentType: 'application/json',
-      body: JSON.stringify(objectInfo)
-    })
-  }
-
-  await page.route(OBJECT_INFO_ROUTE, objectInfoRouteHandler)
-  return async () => {
-    if (page.isClosed()) return
-    await page.unroute(OBJECT_INFO_ROUTE, objectInfoRouteHandler)
-  }
-}

browser_tests/fixtures/utils/promotedMissingModel.ts

@@ -1,424 +0,0 @@
-import { readFileSync } from 'fs'
-
-import { expect } from '@playwright/test'
-import type { Locator } from '@playwright/test'
-
-import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
-import { TestIds } from '@e2e/fixtures/selectors'
-import { loadWorkflowAndOpenErrorsTab } from '@e2e/fixtures/helpers/ErrorsTabHelper'
-import { assetPath } from '@e2e/fixtures/utils/paths'
-import { PropertiesPanelHelper } from '@e2e/tests/propertiesPanel/PropertiesPanelHelper'
-
-import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/workflowSchema'
-
-const PROMOTED_MODEL_WIDGET_NAME = 'ckpt_name'
-
-export interface PromotedMissingModelWorkflow {
-  workflowName: string
-  hostNodeId: number
-  hostNodeTitle: string
-  sharedDefinitionSiblingHostNodeId?: number
-  sharedDefinitionSiblingHostNodeTitle?: string
-}
-
-type RootWorkflowNode = {
-  id: number | string
-  widgets_values?: unknown[] | Record<string, unknown>
-}
-
-type RootWorkflowData = ComfyWorkflowJSON & {
-  nodes?: RootWorkflowNode[]
-}
-
-export const NESTED_PROMOTED_MISSING_MODEL_WORKFLOW: PromotedMissingModelWorkflow =
-  {
-    workflowName: 'missing/missing_model_nested_promoted_widget',
-    hostNodeId: 4,
-    hostNodeTitle: 'Outer Subgraph with Promoted Missing Model',
-    sharedDefinitionSiblingHostNodeId: 3,
-    sharedDefinitionSiblingHostNodeTitle: 'Resolved Shared Outer Subgraph'
-  }
-
-export function getMissingModelLabel(group: Locator, modelName: string) {
-  return group.getByRole('button', { name: modelName, exact: true })
-}
-
-export async function expectSingleMissingModelReference(
-  group: Locator,
-  modelName: string
-) {
-  await expectMissingModelReferenceCount(group, modelName, 1)
-}
-
-export async function expectMissingModelReferenceCount(
-  group: Locator,
-  modelName: string,
-  count: number
-) {
-  await expect(getMissingModelLabel(group, modelName)).toHaveCount(1)
-  const badge = group.getByTestId(TestIds.dialogs.missingModelReferenceCount)
-  if (count === 1) {
-    await expect(badge).toBeHidden()
-    return
-  }
-  await expect(badge).toBeVisible()
-  await expect(badge).toHaveText(String(count))
-}
-
-export async function loadPromotedMissingModelAndOpenErrorsTab(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow,
-  modelName: string
-): Promise<Locator> {
-  await loadWorkflowAndOpenErrorsTab(comfyPage, workflow.workflowName)
-
-  const missingModelGroup = comfyPage.page.getByTestId(
-    TestIds.dialogs.missingModelsGroup
-  )
-  await expectSingleMissingModelReference(missingModelGroup, modelName)
-  return missingModelGroup
-}
-
-export async function loadPromotedMissingModelWithHostValuesAndOpenErrorsTab(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow,
-  hostValues: Record<number, string>,
-  modelName: string,
-  expectedReferenceCount: number
-): Promise<Locator> {
-  await loadPromotedMissingModelWithHostValues(comfyPage, workflow, hostValues)
-
-  const errorOverlay = comfyPage.page.getByTestId(TestIds.dialogs.errorOverlay)
-  await expect(errorOverlay).toBeVisible()
-  await errorOverlay.getByTestId(TestIds.dialogs.errorOverlaySeeErrors).click()
-  await expect(errorOverlay).toBeHidden()
-
-  const missingModelGroup = comfyPage.page.getByTestId(
-    TestIds.dialogs.missingModelsGroup
-  )
-  await expectMissingModelReferenceCount(
-    missingModelGroup,
-    modelName,
-    expectedReferenceCount
-  )
-  return missingModelGroup
-}
-
-export async function expectNoMissingModelUi(comfyPage: ComfyPage) {
-  const panel = new PropertiesPanelHelper(comfyPage.page)
-  await expect(
-    comfyPage.page.getByTestId(TestIds.dialogs.errorOverlay)
-  ).toBeHidden()
-  await panel.open(comfyPage.actionbar.propertiesButton)
-  await expect(
-    panel.root.getByTestId(TestIds.propertiesPanel.errorsTab)
-  ).toBeHidden()
-  await expect(
-    comfyPage.page.getByTestId(TestIds.dialogs.missingModelsGroup)
-  ).toBeHidden()
-}
-
-export async function selectVueComboPromotedModelByTitle(
-  comfyPage: ComfyPage,
-  nodeTitle: string,
-  modelName: string
-) {
-  await comfyPage.vueNodes.selectComboOption(
-    nodeTitle,
-    PROMOTED_MODEL_WIDGET_NAME,
-    modelName
-  )
-}
-
-export async function selectVueAssetPromotedModel(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow,
-  currentModelName: string,
-  modelName: string
-) {
-  await selectModelFromFormDropdown(
-    comfyPage,
-    comfyPage.vueNodes.getNodeByTitle(workflow.hostNodeTitle),
-    currentModelName,
-    modelName
-  )
-}
-
-export async function selectSectionComboPromotedModel(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow,
-  modelName: string
-) {
-  const panel = await openHostNodeParametersPanel(comfyPage, workflow)
-  const combo = panel.contentArea.getByRole('combobox', {
-    name: PROMOTED_MODEL_WIDGET_NAME,
-    exact: true
-  })
-  await combo.click()
-  await comfyPage.page
-    .getByRole('option', { name: modelName, exact: true })
-    .click()
-}
-
-export async function selectSectionAssetPromotedModel(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow,
-  currentModelName: string,
-  modelName: string
-) {
-  const panel = await openHostNodeParametersPanel(comfyPage, workflow)
-  await selectModelFromFormDropdown(
-    comfyPage,
-    panel.contentArea,
-    currentModelName,
-    modelName
-  )
-}
-
-export async function setLegacyPromotedComboModel(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow,
-  modelName: string
-) {
-  await comfyPage.page.evaluate(
-    ({ hostNodeId, widgetName, value }) => {
-      type LegacyPromotedWidget = {
-        name?: string
-        value?: unknown
-        callback?: (value: string) => void
-        setValue?: (
-          value: string,
-          options: {
-            e: PointerEvent
-            node: unknown
-            canvas: unknown
-          }
-        ) => void
-      }
-      type LegacyPromotedNode = {
-        onWidgetChanged?: (
-          name: string,
-          newValue: string,
-          oldValue: unknown,
-          widget: LegacyPromotedWidget
-        ) => void
-        widgets?: LegacyPromotedWidget[]
-      }
-      type LegacyPromotedGraph = {
-        getNodeById: (nodeId: number) => LegacyPromotedNode | undefined
-      }
-
-      const currentGraph = window.app?.graph as LegacyPromotedGraph | undefined
-      const hostNode: LegacyPromotedNode | undefined =
-        currentGraph?.getNodeById(hostNodeId)
-      if (!hostNode) {
-        throw new Error(`Expected subgraph host node ${hostNodeId}`)
-      }
-
-      const widget = hostNode.widgets?.find(
-        (entry) => entry.name === widgetName
-      ) as LegacyPromotedWidget | undefined
-      if (!widget) {
-        throw new Error(`Expected host ${widgetName} widget`)
-      }
-
-      const oldValue = widget.value
-      if (widget.setValue) {
-        widget.setValue(value, {
-          e: new PointerEvent('pointerup'),
-          node: hostNode,
-          canvas: window.app!.canvas
-        })
-        return
-      }
-
-      widget.value = value
-      widget.callback?.(value)
-      hostNode.onWidgetChanged?.(
-        widget.name ?? widgetName,
-        value,
-        oldValue,
-        widget
-      )
-    },
-    {
-      hostNodeId: workflow.hostNodeId,
-      widgetName: PROMOTED_MODEL_WIDGET_NAME,
-      value: modelName
-    }
-  )
-}
-
-export async function selectLegacyPromotedAssetModel(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow,
-  assetId: string
-) {
-  await clickLegacyHostPromotedWidget(comfyPage, workflow)
-
-  const modal = comfyPage.page.locator(
-    '[data-component-id="AssetBrowserModal"]'
-  )
-  await expect(modal).toBeVisible()
-  const assetCard = modal.locator(`[data-asset-id="${assetId}"]`)
-  await expect(assetCard).toBeVisible()
-  await assetCard.getByRole('button', { name: 'Use', exact: true }).click()
-  await expect(modal).toBeHidden()
-}
-
-export async function expectResolvedPromotedModelSuppressesStaleInteriorErrors(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow,
-  expectedStaleInteriorWidgets: Array<{
-    subgraphNodeIdToEnter: string
-    nodeTitle: string
-  }>,
-  resolvedModelName: string,
-  staleModelName: string
-) {
-  await loadPromotedMissingModelWithHostValues(comfyPage, workflow, {
-    [workflow.hostNodeId]: resolvedModelName
-  })
-
-  const promotedModelCombo = comfyPage.vueNodes
-    .getNodeByTitle(workflow.hostNodeTitle)
-    .getByRole('combobox', { name: PROMOTED_MODEL_WIDGET_NAME, exact: true })
-  await expect(promotedModelCombo).toContainText(resolvedModelName)
-  await expectNoMissingModelUi(comfyPage)
-
-  for (const step of expectedStaleInteriorWidgets) {
-    await enterSubgraphForStaleInteriorCheck(
-      comfyPage,
-      step.subgraphNodeIdToEnter
-    )
-    await expect.poll(() => comfyPage.subgraph.isInSubgraph()).toBe(true)
-    await comfyPage.nextFrame()
-
-    const node = comfyPage.vueNodes.getNodeByTitle(step.nodeTitle)
-    await expect(node).toBeVisible()
-
-    const staleCombo = node.getByRole('combobox', {
-      name: PROMOTED_MODEL_WIDGET_NAME,
-      exact: true
-    })
-    await expect(
-      staleCombo,
-      `${step.nodeTitle} should expose the stale linked interior widget`
-    ).toBeDisabled()
-    await expect(
-      staleCombo,
-      `${step.nodeTitle} should keep the stale interior value`
-    ).toContainText(staleModelName)
-    await expectNoMissingModelUi(comfyPage)
-  }
-}
-
-async function openHostNodeParametersPanel(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow
-): Promise<PropertiesPanelHelper> {
-  await comfyPage.vueNodes.selectNode(String(workflow.hostNodeId))
-  const panel = new PropertiesPanelHelper(comfyPage.page)
-  await panel.open(comfyPage.actionbar.propertiesButton)
-  await expect(panel.getTab('Parameters')).toBeVisible()
-  await panel.switchToTab('Parameters')
-  return panel
-}
-
-async function loadPromotedMissingModelWithHostValues(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow,
-  hostValues: Record<number, string>
-) {
-  const graphData = readPromotedMissingModelWorkflow(workflow.workflowName)
-  for (const [hostNodeId, value] of Object.entries(hostValues)) {
-    setRootHostWidgetValue(graphData, Number(hostNodeId), value)
-  }
-
-  await comfyPage.workflow.loadGraphData(graphData)
-  await comfyPage.vueNodes.waitForNodes()
-}
-
-function readPromotedMissingModelWorkflow(workflowName: string) {
-  return JSON.parse(
-    readFileSync(assetPath(`${workflowName}.json`), 'utf-8')
-  ) as RootWorkflowData
-}
-
-function setRootHostWidgetValue(
-  graphData: RootWorkflowData,
-  hostNodeId: number,
-  value: string
-) {
-  const hostNode = graphData.nodes?.find(
-    (node) => Number(node.id) === hostNodeId
-  )
-  if (!hostNode) throw new Error(`Expected host node ${hostNodeId}`)
-
-  if (Array.isArray(hostNode.widgets_values)) {
-    hostNode.widgets_values[0] = value
-    return
-  }
-
-  hostNode.widgets_values = {
-    ...(hostNode.widgets_values ?? {}),
-    [PROMOTED_MODEL_WIDGET_NAME]: value
-  }
-}
-
-async function selectModelFromFormDropdown(
-  comfyPage: ComfyPage,
-  root: Locator,
-  currentModelName: string,
-  nextModelName: string
-) {
-  const trigger = root
-    .getByRole('button', { name: currentModelName, exact: true })
-    .first()
-  await expect(trigger).toBeVisible()
-  await trigger.click()
-
-  const menu = comfyPage.page.getByTestId('form-dropdown-menu')
-  await expect(menu).toBeVisible()
-  await menu.getByText(nextModelName, { exact: true }).click()
-  await expect(menu).toBeHidden()
-}
-
-async function clickLegacyHostPromotedWidget(
-  comfyPage: ComfyPage,
-  workflow: PromotedMissingModelWorkflow
-) {
-  const hostNode = await comfyPage.nodeOps.getNodeRefById(workflow.hostNodeId)
-  await hostNode.centerOnNode()
-  const widget = await hostNode.getWidgetByName(PROMOTED_MODEL_WIDGET_NAME)
-  await widget.click()
-}
-
-async function enterSubgraphForStaleInteriorCheck(
-  comfyPage: ComfyPage,
-  nodeId: string
-) {
-  const numericNodeId = Number(nodeId)
-  if (Number.isNaN(numericNodeId)) {
-    throw new Error(`Expected numeric subgraph node id, got ${nodeId}`)
-  }
-
-  const normalizedNodeId = String(numericNodeId)
-  const enterButton =
-    comfyPage.vueNodes.getSubgraphEnterButton(normalizedNodeId)
-  if ((await enterButton.count()) > 0) {
-    await comfyPage.vueNodes.enterSubgraph(normalizedNodeId)
-    return
-  }
-
-  await comfyPage.page.evaluate((targetNodeId) => {
-    const graph = window.app?.canvas.graph
-    const node = graph?.getNodeById(targetNodeId)
-    if (!node?.isSubgraphNode()) {
-      throw new Error(`Expected visible subgraph node ${targetNodeId}`)
-    }
-    window.app!.canvas.setGraph(node.subgraph)
-  }, numericNodeId)
-  await comfyPage.nextFrame()
-  await comfyPage.vueNodes.waitForNodes()
-}

browser_tests/fixtures/utils/workspaceMocks.ts

@@ -1,68 +0,0 @@
-import type { Page } from '@playwright/test'
-
-import type {
-  Member,
-  WorkspaceWithRole
-} from '@/platform/workspace/api/workspaceApi'
-
-import { jsonRoute } from '@e2e/fixtures/utils/jsonRoute'
-
-export function workspace(
-  type: 'personal' | 'team',
-  role: 'owner' | 'member'
-): WorkspaceWithRole {
-  return {
-    id: `ws-${type}`,
-    name: type === 'team' ? 'My Team' : 'Personal Workspace',
-    type,
-    role,
-    created_at: '2026-01-01T00:00:00Z',
-    joined_at: '2026-01-01T00:00:00Z'
-  }
-}
-
-export function member(
-  overrides: Partial<Member> & Pick<Member, 'email' | 'role'>
-): Member {
-  return {
-    id: `user-${overrides.email}`,
-    name: overrides.email,
-    joined_at: '2026-01-01T00:00:00Z',
-    is_original_owner: false,
-    ...overrides
-  }
-}
-
-/**
- * Stub the workspace resolution + members list so the cloud app boots into the
- * given workspace with the given roster (drives the original-owner gate).
- */
-export async function mockWorkspace(
-  page: Page,
-  ws: WorkspaceWithRole,
-  members: Member[]
-) {
-  await page.route('**/api/workspaces', async (route) => {
-    if (route.request().method() !== 'GET') return route.fallback()
-    await route.fulfill(jsonRoute({ workspaces: [ws] }))
-  })
-  await page.route('**/api/auth/token', (r) =>
-    r.fulfill(
-      jsonRoute({
-        token: 'mock-workspace-token',
-        expires_at: new Date(Date.now() + 60 * 60 * 1000).toISOString(),
-        workspace: { id: ws.id, name: ws.name, type: ws.type },
-        role: ws.role,
-        permissions: []
-      })
-    )
-  )
-  await page.route('**/api/workspace/members**', (r) =>
-    r.fulfill(
-      jsonRoute({
-        members,
-        pagination: { offset: 0, limit: 50, total: members.length }
-      })
-    )
-  )
-}

browser_tests/tests/billingFacadeConsumers.spec.ts

@@ -3,10 +3,6 @@ import type { Page } from '@playwright/test'
 
 import type { CloudSubscriptionStatusResponse } from '@/platform/cloud/subscription/composables/useSubscription'
 import type { RemoteConfig } from '@/platform/remoteConfig/types'
-import type {
-  BillingBalanceResponse,
-  BillingStatusResponse
-} from '@/platform/workspace/api/workspaceApi'
 
 import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
 import { mockSystemStats } from '@e2e/fixtures/data/systemStats'
@@ -16,12 +12,12 @@ import { CloudAuthHelper } from '@e2e/fixtures/helpers/CloudAuthHelper'
  * Billing facade consumers — FE-933 (B3) regression.
  *
  * The repointed surfaces (avatar popover tier badge / balance, free-tier
- * dialog renewal date) must keep rendering from `useBillingContext`. The facade
- * selects its backend by flag: `team_workspaces_enabled: false` routes through
- * the legacy `/customers/*` endpoints, while `true` routes a personal workspace
- * through the workspace `/api/billing/*` endpoints. Both shapes are mocked here.
- * Drives a raw `page` (not the `comfyPage` fixture) so the cloud app boots
- * against fully mocked endpoints — same pattern as creditsTile.spec.ts.
+ * dialog renewal date) must keep rendering from `useBillingContext`, which in
+ * a personal workspace routes through the legacy `/customers/*` endpoints
+ * (mocked here). Drives a raw `page` (not the `comfyPage` fixture) so the
+ * cloud app boots against fully mocked endpoints — same pattern as
+ * creditsTile.spec.ts. `team_workspaces_enabled: false` keeps the topbar on
+ * the legacy popover variant that FE-933 repointed.
  */
 const APP_URL = process.env.PLAYWRIGHT_TEST_URL || 'http://localhost:8188'
 
@@ -31,25 +27,6 @@ const jsonRoute = (body: unknown) => ({
   body: JSON.stringify(body)
 })
 
-// The workspace `/api/billing/status` shape mirrors the legacy subscription
-// status; map the fields so a single test fixture drives both backends.
-const toWorkspaceStatus = (
-  s: CloudSubscriptionStatusResponse
-): BillingStatusResponse => ({
-  is_active: s.is_active ?? false,
-  subscription_tier: s.subscription_tier ?? undefined,
-  subscription_duration: s.subscription_duration ?? undefined,
-  renewal_date: s.renewal_date ?? undefined,
-  cancel_at: s.end_date ?? undefined,
-  has_funds: s.has_fund ?? true
-})
-
-const mockBalance: BillingBalanceResponse = {
-  amount_micros: 6000, // -> 12,660 credits
-  currency: 'usd',
-  effective_balance_micros: 6000
-}
-
 async function mockCloudBoot(
   page: Page,
   subscriptionStatus: CloudSubscriptionStatusResponse,
@@ -83,7 +60,8 @@ async function mockCloudBoot(
   )
   await page.route('**/releases**', (r) => r.fulfill(jsonRoute([])))
 
-  // Single personal workspace.
+  // Single personal workspace: keeps the billing facade on the legacy
+  // `/customers/*` path when team workspaces are enabled.
   await page.route('**/api/workspaces', (r) =>
     r.fulfill(
       jsonRoute({
@@ -99,24 +77,17 @@ async function mockCloudBoot(
     )
   )
 
-  // Legacy backend (team_workspaces_enabled: false).
   await page.route('**/customers/cloud-subscription-status', (r) =>
     r.fulfill(jsonRoute(subscriptionStatus))
   )
   await page.route('**/customers/balance', (r) =>
-    r.fulfill(jsonRoute(mockBalance))
-  )
-
-  // Workspace backend (team_workspaces_enabled: true) — a personal workspace
-  // now routes through `/api/billing/*`.
-  await page.route('**/api/billing/status', (r) =>
-    r.fulfill(jsonRoute(toWorkspaceStatus(subscriptionStatus)))
-  )
-  await page.route('**/api/billing/balance', (r) =>
-    r.fulfill(jsonRoute(mockBalance))
-  )
-  await page.route('**/api/billing/plans', (r) =>
-    r.fulfill(jsonRoute({ plans: [] }))
+    r.fulfill(
+      jsonRoute({
+        amount_micros: 6000, // -> 12,660 credits
+        currency: 'usd',
+        effective_balance_micros: 6000
+      })
+    )
   )
 }
 
@@ -163,10 +134,10 @@ test.describe('Billing facade consumers (FE-933)', { tag: '@cloud' }, () => {
   }) => {
     test.setTimeout(60_000)
 
-    // Boots with team workspaces enabled (production shape); the facade routes a
-    // personal workspace through the workspace `/api/billing/*` endpoints. With
-    // subscription gating on, an inactive FREE user gets the "Subscribe to run"
-    // button, which opens the free-tier dialog on click. (refreshRemoteConfig
+    // Boots with team workspaces enabled (production shape); the facade still
+    // routes a personal workspace through `/customers/*`. With subscription
+    // gating on, an inactive FREE user gets the "Subscribe to run" button,
+    // which opens the free-tier dialog on click. (refreshRemoteConfig
     // overwrites window.__CONFIG__ from /api/features, so the flags must come
     // from the features mock, not an init script.)
     await mockCloudBoot(

browser_tests/tests/cloudSurveyGate.spec.ts

@@ -4,7 +4,8 @@ import type { Page } from '@playwright/test'
 import type { RemoteConfig } from '@/platform/remoteConfig/types'
 
 import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
-import { bootCloud, mockCloudBoot } from '@e2e/fixtures/utils/cloudBootMocks'
+import { mockSystemStats } from '@e2e/fixtures/data/systemStats'
+import { CloudAuthHelper } from '@e2e/fixtures/helpers/CloudAuthHelper'
 
 /**
  * getSurveyCompletedStatus fails safe: a transient 401 on `/` must not bounce a
@@ -15,12 +16,51 @@ import { bootCloud, mockCloudBoot } from '@e2e/fixtures/utils/cloudBootMocks'
  */
 const APP_URL = process.env.PLAYWRIGHT_TEST_URL || 'http://localhost:8188'
 
-// `/api/features` is the remote-config source: production builds resolve
-// `onboardingSurveyEnabled` from it (the `ff:` localStorage override is
-// dev-only). Enable the survey so the gate is actually live.
-const BOOT_FEATURES = {
-  onboarding_survey_enabled: true
-} satisfies RemoteConfig
+function jsonRoute(body: unknown) {
+  return {
+    status: 200,
+    contentType: 'application/json',
+    body: JSON.stringify(body)
+  }
+}
+
+async function mockCloudBoot(page: Page) {
+  // `/api/features` is the remote-config source: production builds resolve
+  // `onboardingSurveyEnabled` from it (the `ff:` localStorage override is
+  // dev-only). Enable the survey so the gate is actually live.
+  await page.route('**/api/features', (r) =>
+    r.fulfill(
+      jsonRoute({ onboarding_survey_enabled: true } satisfies RemoteConfig)
+    )
+  )
+  await page.route('**/api/system_stats', (r) =>
+    r.fulfill(jsonRoute(mockSystemStats))
+  )
+  await page.route('**/api/users', (r) =>
+    r.fulfill(
+      jsonRoute({
+        storage: 'server',
+        migrated: true,
+        users: { 'test-user-e2e': 'E2E Test User' }
+      })
+    )
+  )
+  // Cloud user status (getUserCloudStatus) — an active account so the gate
+  // proceeds to the survey check instead of bouncing back to login.
+  await page.route('**/api/user', (r) =>
+    r.fulfill(jsonRoute({ status: 'active' }))
+  )
+  await page.route('**/api/settings', (r) => r.fulfill(jsonRoute({})))
+  await page.route('**/api/userdata**', (r) => r.fulfill(jsonRoute([])))
+  await page.route('**/api/extensions', (r) => r.fulfill(jsonRoute([])))
+  await page.route('**/api/object_info', (r) => r.fulfill(jsonRoute({})))
+  await page.route('**/api/global_subgraphs', (r) => r.fulfill(jsonRoute({})))
+  await page.route('**/api/i18n', (r) => r.fulfill(jsonRoute({})))
+  await page.route('**/api/auth/session', (r) =>
+    r.fulfill(jsonRoute({ token: 'mock-workspace-token' }))
+  )
+  await page.route('**/releases**', (r) => r.fulfill(jsonRoute([])))
+}
 
 // Genuine "not completed": the cloud backend returns 404 for a survey key that
 // was never stored. This is the response that must still route to the survey.
@@ -49,13 +89,22 @@ async function mockSurveyTransient401(page: Page) {
   )
 }
 
+async function bootCloud(page: Page) {
+  const auth = new CloudAuthHelper(page)
+  await auth.mockAuth()
+  // Pre-select the mock user to skip the user-select screen.
+  await page.addInitScript(() => {
+    localStorage.setItem('Comfy.userId', 'test-user-e2e')
+  })
+}
+
 test.describe('Cloud onboarding survey gate', { tag: '@cloud' }, () => {
   test('a transient 401 on the survey check does not bounce a working user to the survey', async ({
     page
   }) => {
-    test.slow()
+    test.setTimeout(60_000)
 
-    await mockCloudBoot(page, { features: BOOT_FEATURES })
+    await mockCloudBoot(page)
     await mockSurveyTransient401(page)
     await bootCloud(page)
 
@@ -73,9 +122,9 @@ test.describe('Cloud onboarding survey gate', { tag: '@cloud' }, () => {
   test('a not-completed (404) user landing on / is routed to the survey', async ({
     page
   }) => {
-    test.slow()
+    test.setTimeout(60_000)
 
-    await mockCloudBoot(page, { features: BOOT_FEATURES })
+    await mockCloudBoot(page)
     await mockSurveyNotCompleted(page)
     await bootCloud(page)
 

browser_tests/tests/currentUserPopoverCredits.spec.ts

@@ -2,10 +2,7 @@ import { expect } from '@playwright/test'
 
 import type { CloudSubscriptionStatusResponse } from '@/platform/cloud/subscription/composables/useSubscription'
 import type { RemoteConfig } from '@/platform/remoteConfig/types'
-import type {
-  BillingStatusResponse,
-  WorkspaceWithRole
-} from '@/platform/workspace/api/workspaceApi'
+import type { WorkspaceWithRole } from '@/platform/workspace/api/workspaceApi'
 import type { WorkspaceTokenResponse } from '@/platform/workspace/stores/workspaceAuthStore'
 import type { operations } from '@/types/comfyRegistryTypes'
 import { comfyPageFixture } from '@e2e/fixtures/ComfyPage'
@@ -54,20 +51,6 @@ const mockSubscriptionStatus: CloudSubscriptionStatusResponse = {
   end_date: FUTURE_DATE
 }
 
-// With team workspaces enabled, the facade routes a personal workspace through
-// `/api/billing/*`. The cancelled-but-active state maps to `is_active: true`
-// with `subscription_status: 'canceled'`; a paid tier keeps "Add credits"
-// visible (free tier would swap it for "Upgrade to add credits").
-const mockBillingStatus: BillingStatusResponse = {
-  is_active: true,
-  subscription_status: 'canceled',
-  subscription_tier: 'PRO',
-  subscription_duration: 'MONTHLY',
-  has_funds: true,
-  cancel_at: FUTURE_DATE,
-  renewal_date: FUTURE_DATE
-}
-
 // ~6.3M credits — a 7-digit balance is what pushes the second action button out
 // of the popover before the fix.
 const mockBalance: CustomerBalanceResponse = {
@@ -122,32 +105,6 @@ const test = comfyPageFixture.extend({
       })
     )
 
-    // Flag-on (team workspaces enabled) routes a personal workspace through the
-    // workspace billing endpoints, so the popover sources its data from here.
-    await page.route('**/api/billing/status', (route) =>
-      route.fulfill({
-        status: 200,
-        contentType: 'application/json',
-        body: JSON.stringify(mockBillingStatus)
-      })
-    )
-
-    await page.route('**/api/billing/balance', (route) =>
-      route.fulfill({
-        status: 200,
-        contentType: 'application/json',
-        body: JSON.stringify(mockBalance)
-      })
-    )
-
-    await page.route('**/api/billing/plans', (route) =>
-      route.fulfill({
-        status: 200,
-        contentType: 'application/json',
-        body: JSON.stringify({ plans: [] })
-      })
-    )
-
     await use(page)
   }
 })

browser_tests/tests/dialogs/creditsTile.spec.ts

@@ -1,264 +0,0 @@
-import { expect } from '@playwright/test'
-import type { Page } from '@playwright/test'
-
-import type { RemoteConfig } from '@/platform/remoteConfig/types'
-import type { BillingStatusResponse } from '@/platform/workspace/api/workspaceApi'
-
-import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
-import { mockSystemStats } from '@e2e/fixtures/data/systemStats'
-import { CloudAuthHelper } from '@e2e/fixtures/helpers/CloudAuthHelper'
-
-// Drives a raw `page` (not the `comfyPage` fixture) so the cloud app boots
-// against fully mocked endpoints; `comfyPage` would try to reach the OSS
-// devtools backend during setup.
-
-/**
- * Credits tile (Settings ▸ Workspace ▸ Plan & Credits) — DES-247 / FE-964.
- *
- * The credits tile only lives inside the authenticated cloud app, which the
- * shared `comfyPage` fixture can't boot (it expects the OSS devtools backend).
- * Instead this drives a raw page: mock Firebase auth + every boot endpoint so
- * the cloud app initializes against fully stubbed data. With team workspaces
- * enabled the facade routes a personal workspace through the workspace
- * `/api/billing/*` endpoints (mocked with an active Pro subscription); the
- * legacy `/customers/*` shapes are mocked too for the flag-off path. The tile
- * should then render its total / progress bar / monthly+additional breakdown /
- * add-credits.
- */
-const APP_URL = process.env.PLAYWRIGHT_TEST_URL || 'http://localhost:8188'
-
-const jsonRoute = (body: unknown) => ({
-  status: 200,
-  contentType: 'application/json',
-  body: JSON.stringify(body)
-})
-
-// Legacy `/customers/balance` and workspace `/api/billing/balance` share the
-// same response shape, so one body fulfills both endpoints.
-const balanceRoute = (balance: {
-  amount: number
-  monthly: number
-  prepaid: number
-}) =>
-  jsonRoute({
-    amount_micros: balance.amount,
-    currency: 'usd',
-    effective_balance_micros: balance.amount,
-    cloud_credit_balance_micros: balance.monthly,
-    prepaid_balance_micros: balance.prepaid
-  })
-
-// 6000 -> 12,660 total; 5000 -> 10,550 monthly remaining; 1000 -> 2,110 extra.
-const DEFAULT_BALANCE = { amount: 6000, monthly: 5000, prepaid: 1000 }
-
-const mockBillingStatus: BillingStatusResponse = {
-  is_active: true,
-  subscription_tier: 'PRO',
-  subscription_duration: 'MONTHLY',
-  renewal_date: '2099-02-20T12:00:00Z',
-  has_funds: true
-}
-
-async function mockCloudBoot(page: Page) {
-  // Frontend-origin boot endpoints (proxied to the backend in production).
-  // `/api/features` is the remote-config source: production builds resolve
-  // `teamWorkspacesEnabled` from it (the `ff:` localStorage override is
-  // dev-only), and the flag gates the Workspace settings panel.
-  await page.route('**/api/features', (r) =>
-    r.fulfill(
-      jsonRoute({ team_workspaces_enabled: true } satisfies RemoteConfig)
-    )
-  )
-  await page.route('**/api/system_stats', (r) =>
-    r.fulfill(jsonRoute(mockSystemStats))
-  )
-  // Include the mock user so the multi-user select screen auto-selects it
-  // (paired with the `Comfy.userId` localStorage seed below).
-  await page.route('**/api/users', (r) =>
-    r.fulfill(
-      jsonRoute({
-        storage: 'server',
-        migrated: true,
-        users: { 'test-user-e2e': 'E2E Test User' }
-      })
-    )
-  )
-  // Non-empty settings with a completed tutorial keep the cloud app from
-  // booting as a new user, whose Workflow Templates dialog would otherwise
-  // auto-open and intercept the Settings click behind its modal backdrop.
-  await page.route('**/api/settings', (r) =>
-    r.fulfill(jsonRoute({ 'Comfy.TutorialCompleted': true }))
-  )
-  await page.route('**/api/userdata**', (r) => r.fulfill(jsonRoute([])))
-  await page.route('**/api/extensions', (r) => r.fulfill(jsonRoute([])))
-  await page.route('**/api/object_info', (r) => r.fulfill(jsonRoute({})))
-  await page.route('**/api/global_subgraphs', (r) => r.fulfill(jsonRoute({})))
-  await page.route('**/api/i18n', (r) => r.fulfill(jsonRoute({})))
-  await page.route('**/api/auth/session', (r) =>
-    r.fulfill(jsonRoute({ token: 'mock-workspace-token' }))
-  )
-  await page.route('**/releases**', (r) => r.fulfill(jsonRoute([])))
-
-  // Single personal workspace.
-  await page.route('**/api/workspaces', (r) =>
-    r.fulfill(
-      jsonRoute({
-        workspaces: [
-          {
-            id: 'ws-personal',
-            name: 'Personal Workspace',
-            type: 'personal',
-            role: 'owner'
-          }
-        ]
-      })
-    )
-  )
-
-  // Legacy billing (flag-off path, api.comfy.org/customers/*).
-  await page.route('**/customers/cloud-subscription-status', (r) =>
-    r.fulfill(
-      jsonRoute({
-        is_active: true,
-        subscription_tier: 'PRO',
-        subscription_duration: 'MONTHLY',
-        renewal_date: '2099-02-20T12:00:00Z',
-        end_date: null
-      })
-    )
-  )
-  await page.route('**/customers/balance', (r) =>
-    r.fulfill(balanceRoute(DEFAULT_BALANCE))
-  )
-
-  // Workspace billing (flag-on path) — a personal workspace now routes through
-  // `/api/billing/*`.
-  await page.route('**/api/billing/status', (r) =>
-    r.fulfill(jsonRoute(mockBillingStatus))
-  )
-  await page.route('**/api/billing/balance', (r) =>
-    r.fulfill(balanceRoute(DEFAULT_BALANCE))
-  )
-  await page.route('**/api/billing/plans', (r) =>
-    r.fulfill(jsonRoute({ plans: [] }))
-  )
-}
-
-async function mockBalance(
-  page: Page,
-  balance: { amount: number; monthly: number; prepaid: number }
-) {
-  await page.unroute('**/customers/balance')
-  await page.unroute('**/api/billing/balance')
-  await page.route('**/customers/balance', (r) =>
-    r.fulfill(balanceRoute(balance))
-  )
-  await page.route('**/api/billing/balance', (r) =>
-    r.fulfill(balanceRoute(balance))
-  )
-}
-
-/** Boots the mocked cloud app and opens Settings ▸ Workspace ▸ Plan & Credits. */
-async function openPlanAndCredits(page: Page) {
-  const auth = new CloudAuthHelper(page)
-  await auth.mockAuth()
-
-  // Pre-select the mock user to skip the user-select screen.
-  await page.addInitScript(() => {
-    localStorage.setItem('Comfy.userId', 'test-user-e2e')
-  })
-
-  await page.goto(APP_URL)
-  await page.waitForFunction(() => !!window.app?.extensionManager, null, {
-    timeout: 45_000
-  })
-
-  // Open Settings ▸ Workspace.
-  await page
-    .getByRole('button', { name: /^Settings/ })
-    .first()
-    .click()
-  const dialog = page.getByTestId('settings-dialog')
-  await expect(dialog).toBeVisible()
-  await dialog.locator('nav').getByRole('button', { name: 'Workspace' }).click()
-
-  return dialog.getByRole('main')
-}
-
-test.describe('Credits tile (Plan & Credits)', { tag: '@cloud' }, () => {
-  test('renders the unified tile with breakdown and add-credits', async ({
-    page
-  }) => {
-    test.setTimeout(60_000)
-
-    await mockCloudBoot(page)
-
-    const content = await openPlanAndCredits(page)
-
-    // Total + remaining suffix (Pro monthly allowance = 21,100; remaining
-    // 10,550 -> used 10,550).
-    await expect(content.getByText('Total credits')).toBeVisible()
-    await expect(content.getByText('12,660')).toBeVisible()
-
-    // Monthly usage bar header + used / left-of-total labels.
-    await expect(content.getByText('Monthly', { exact: true })).toBeVisible()
-    await expect(content.getByText(/Refills Feb/)).toBeVisible()
-    await expect(content.getByText('10,550 used')).toBeVisible()
-    await expect(content.getByText('10,550 left of 21,100')).toBeVisible()
-
-    // Additional credits row + subtitle.
-    await expect(content.getByText('Additional credits')).toBeVisible()
-    await expect(content.getByText('2,110')).toBeVisible()
-    await expect(content.getByText('Used after monthly runs out')).toBeVisible()
-
-    // Permission-gated add-credits action (personal owner can top up).
-    await expect(
-      content.getByRole('button', { name: 'Add credits' })
-    ).toBeVisible()
-
-    // Narrow container (DES-247 responsive variants): drop the used/remaining
-    // labels and the breakdown subtitle, compact the monthly summary numbers.
-    await page.setViewportSize({ width: 360, height: 800 })
-    await expect(content.getByText('10,550 used')).toBeHidden()
-    await expect(content.getByText('remaining', { exact: true })).toBeHidden()
-    await expect(content.getByText('Used after monthly runs out')).toBeHidden()
-    await expect(content.getByText('10,550 left of 21,100')).toBeHidden()
-    await expect(content.getByText('11K left of 21K')).toBeVisible()
-  })
-
-  test('renders the depleted-credit empty states', async ({ page }) => {
-    test.setTimeout(60_000)
-
-    await mockCloudBoot(page)
-    // Monthly allowance fully spent; additional credits keep generation going.
-    await mockBalance(page, { amount: 1000, monthly: 0, prepaid: 1000 })
-
-    const content = await openPlanAndCredits(page)
-
-    // 0-monthly state: depletion notice + IN USE badge on additional credits.
-    await expect(
-      content.getByText('Monthly credits are used up. Refills Feb 20')
-    ).toBeVisible()
-    await expect(
-      content.getByText("You're now spending additional credits.")
-    ).toBeVisible()
-    await expect(content.getByText('In use')).toBeVisible()
-    await expect(content.getByText('0 left of 21,100')).toBeVisible()
-
-    // Drain the remaining additional credits and refresh the tile: the
-    // out-of-credits notice takes over and the badge drops.
-    await mockBalance(page, { amount: 0, monthly: 0, prepaid: 0 })
-    await content.getByRole('button', { name: 'Refresh credits' }).click()
-
-    await expect(
-      content.getByText("You're out of credits. Credits refill Feb 20")
-    ).toBeVisible()
-    await expect(
-      content.getByText('Add more credits to continue generating.')
-    ).toBeVisible()
-    await expect(content.getByText('In use')).toBeHidden()
-    await expect(
-      content.getByRole('button', { name: 'Add credits' })
-    ).toBeVisible()
-  })
-})

browser_tests/tests/dialogs/memberRoleChange.spec.ts

@@ -1,264 +0,0 @@
-import { expect } from '@playwright/test'
-import type { Locator, Page } from '@playwright/test'
-
-import type { Member } from '@/platform/workspace/api/workspaceApi'
-
-import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
-import {
-  CREATOR,
-  MEMBER_JANE,
-  MEMBER_JOHN,
-  VIEWER
-} from '@e2e/fixtures/data/cloudWorkspace'
-import { CloudWorkspaceMockHelper } from '@e2e/fixtures/helpers/CloudWorkspaceMockHelper'
-
-// Drives a raw `page` (not the `comfyPage` fixture) so the cloud app boots
-// against fully mocked endpoints; `comfyPage` would try to reach the OSS
-// devtools backend during setup.
-
-/**
- * Member role change (Settings ▸ Workspace ▸ Members) — Figma 2993-15512.
- *
- * The viewer is a promoted owner (not the workspace creator), so the spec can
- * distinguish the creator guard from the self guard: the creator row and the
- * viewer's own row hide the row menu, every other row exposes
- * "Change role ›" (Owner / Member) plus "Remove member". Promoting a member
- * sends PATCH /api/workspace/members/:id {role}, flips the Role column,
- * re-sorts the row under the creator, and the promoted owner stays demotable.
- */
-const APP_URL = process.env.PLAYWRIGHT_TEST_URL || 'http://localhost:8188'
-
-async function openMembersTab(page: Page): Promise<Locator> {
-  await page.goto(APP_URL)
-  await page.waitForFunction(() => !!window.app?.extensionManager, null, {
-    timeout: 45_000
-  })
-
-  await page
-    .getByRole('button', { name: /^Settings/ })
-    .first()
-    .click()
-  const dialog = page.getByTestId('settings-dialog')
-  await expect(dialog).toBeVisible()
-  await dialog.locator('nav').getByRole('button', { name: 'Workspace' }).click()
-
-  const content = dialog.getByRole('main')
-  await content.getByRole('tab', { name: /Members/ }).click()
-  await expect(content.getByText('4 of 30 members')).toBeVisible()
-  return content
-}
-
-function memberRow(content: Locator, email: string): Locator {
-  return content
-    .locator('div.grid')
-    .filter({ has: content.page().getByText(email, { exact: true }) })
-}
-
-function menuButton(row: Locator): Locator {
-  return row.getByRole('button', { name: 'More Options' })
-}
-
-// Reka submenus open on real pointer travel or keyboard; Playwright's
-// synthetic hover doesn't trigger the pointermove handler, so drive the
-// subtrigger with ArrowRight instead.
-async function openChangeRoleSubmenu(page: Page) {
-  const trigger = page.getByRole('menuitem', { name: 'Change role' })
-  await expect(trigger).toBeVisible()
-  await trigger.press('ArrowRight')
-  await expect(
-    page.getByRole('menuitemradio', { name: 'Owner', exact: true })
-  ).toBeVisible()
-}
-
-test.describe('Member role change (Members tab)', { tag: '@cloud' }, () => {
-  test.describe.configure({ timeout: 60_000 })
-
-  test('row menus respect creator and self guards', async ({ page }) => {
-    await new CloudWorkspaceMockHelper(page).setup()
-    const content = await openMembersTab(page)
-
-    // US8/US9 — no row actions on the creator row (Liz) nor on the viewer's
-    // own row; the two plain members each expose a menu.
-    await expect(
-      menuButton(memberRow(content, MEMBER_JOHN.email))
-    ).toBeVisible()
-    await expect(
-      menuButton(memberRow(content, MEMBER_JANE.email))
-    ).toBeVisible()
-    await expect(menuButton(memberRow(content, CREATOR.email))).toHaveCount(0)
-    await expect(menuButton(memberRow(content, VIEWER.email))).toHaveCount(0)
-
-    // US1/US12 — the row menu exposes Change role and the FE-768 remove flow.
-    await menuButton(memberRow(content, MEMBER_JANE.email)).click()
-    await expect(
-      page.getByRole('menuitem', { name: 'Change role' })
-    ).toBeVisible()
-    await page.getByRole('menuitem', { name: 'Remove member' }).click()
-    await expect(page.getByText('Remove this member?')).toBeVisible()
-  })
-
-  test('selecting the current role is a no-op', async ({ page }) => {
-    const state = await new CloudWorkspaceMockHelper(page).setup()
-    const content = await openMembersTab(page)
-
-    const janeRow = memberRow(content, MEMBER_JANE.email)
-    await menuButton(janeRow).click()
-    await openChangeRoleSubmenu(page)
-
-    // The current role is a checked radio item so assistive tech can announce
-    // which role is active.
-    await expect(
-      page.getByRole('menuitemradio', { name: 'Member', exact: true })
-    ).toHaveAttribute('aria-checked', 'true')
-    await expect(
-      page.getByRole('menuitemradio', { name: 'Owner', exact: true })
-    ).toHaveAttribute('aria-checked', 'false')
-
-    await page
-      .getByRole('menuitemradio', { name: 'Member', exact: true })
-      .click()
-
-    await expect(page.getByRole('heading', { name: /an owner\?/ })).toHaveCount(
-      0
-    )
-    expect(state.patches).toHaveLength(0)
-  })
-
-  test('promote dialog shows the Figma copy and cancelling keeps the role', async ({
-    page
-  }) => {
-    const state = await new CloudWorkspaceMockHelper(page).setup()
-    const content = await openMembersTab(page)
-
-    const janeRow = memberRow(content, MEMBER_JANE.email)
-    await menuButton(janeRow).click()
-    await openChangeRoleSubmenu(page)
-    await page
-      .getByRole('menuitemradio', { name: 'Owner', exact: true })
-      .click()
-
-    await expect(
-      page.getByRole('heading', { name: 'Make Jane an owner?' })
-    ).toBeVisible()
-    await expect(page.getByText("They'll be able to:")).toBeVisible()
-    await expect(page.getByText('Add additional credits')).toBeVisible()
-    await expect(
-      page.getByText('Manage members, payment methods, and workspace settings')
-    ).toBeVisible()
-    await expect(
-      page.getByText(
-        'Promote and demote other owners (except the workspace creator).'
-      )
-    ).toBeVisible()
-
-    await page.getByRole('button', { name: 'Cancel', exact: true }).click()
-    await expect(
-      page.getByRole('heading', { name: 'Make Jane an owner?' })
-    ).toHaveCount(0)
-    await expect(janeRow.getByText('Member', { exact: true })).toBeVisible()
-    expect(state.patches).toHaveLength(0)
-  })
-
-  test('promoting a member re-sorts the row under the creator and stays demotable', async ({
-    page
-  }) => {
-    const state = await new CloudWorkspaceMockHelper(page).setup()
-    const content = await openMembersTab(page)
-
-    const emails = content.getByText(/@test\.comfy\.org/)
-    await expect(emails).toHaveText([
-      CREATOR.email,
-      VIEWER.email,
-      MEMBER_JOHN.email,
-      MEMBER_JANE.email
-    ])
-
-    const janeRow = memberRow(content, MEMBER_JANE.email)
-    await menuButton(janeRow).click()
-    await openChangeRoleSubmenu(page)
-    await page
-      .getByRole('menuitemradio', { name: 'Owner', exact: true })
-      .click()
-    await page.getByRole('button', { name: 'Make owner' }).click()
-
-    await expect(page.getByText('Role updated')).toBeVisible()
-    await expect(janeRow.getByText('Owner', { exact: true })).toBeVisible()
-    await expect(emails).toHaveText([
-      CREATOR.email,
-      VIEWER.email,
-      MEMBER_JANE.email,
-      MEMBER_JOHN.email
-    ])
-    expect(state.patches).toEqual([
-      {
-        url: expect.stringContaining('/api/workspace/members/u-jane'),
-        role: 'owner'
-      }
-    ])
-
-    // The promoted owner keeps its row menu (still demotable).
-    await expect(menuButton(janeRow)).toBeVisible()
-  })
-
-  test('demoting an owner returns them to member', async ({ page }) => {
-    const ownerJane: Member = { ...MEMBER_JANE, role: 'owner' }
-    const state = await new CloudWorkspaceMockHelper(page).setup([
-      CREATOR,
-      VIEWER,
-      ownerJane,
-      MEMBER_JOHN
-    ])
-    const content = await openMembersTab(page)
-
-    const janeRow = memberRow(content, MEMBER_JANE.email)
-    await expect(janeRow.getByText('Owner', { exact: true })).toBeVisible()
-
-    await menuButton(janeRow).click()
-    await openChangeRoleSubmenu(page)
-    await page
-      .getByRole('menuitemradio', { name: 'Member', exact: true })
-      .click()
-    await expect(
-      page.getByRole('heading', { name: 'Demote Jane to member?' })
-    ).toBeVisible()
-    await expect(page.getByText("They'll lose admin access.")).toBeVisible()
-    await page.getByRole('button', { name: 'Demote to member' }).click()
-
-    await expect(janeRow.getByText('Member', { exact: true })).toBeVisible()
-    expect(state.patches).toEqual([
-      {
-        url: expect.stringContaining('/api/workspace/members/u-jane'),
-        role: 'member'
-      }
-    ])
-  })
-
-  test('failed role change keeps the dialog open with an error toast', async ({
-    page
-  }) => {
-    await new CloudWorkspaceMockHelper(page).setup()
-    // Override the member route so PATCH fails after boot succeeds.
-    await page.route('**/api/workspace/members/**', (route) =>
-      route.request().method() === 'PATCH'
-        ? route.fulfill({ status: 500, body: '{}' })
-        : route.fallback()
-    )
-    const content = await openMembersTab(page)
-
-    const janeRow = memberRow(content, MEMBER_JANE.email)
-    await menuButton(janeRow).click()
-    await openChangeRoleSubmenu(page)
-    await page
-      .getByRole('menuitemradio', { name: 'Owner', exact: true })
-      .click()
-    await page.getByRole('button', { name: 'Make owner' }).click()
-
-    // US10 — error toast, dialog stays open, role unchanged.
-    await expect(page.getByText('Failed to update role')).toBeVisible()
-    await expect(
-      page.getByRole('heading', { name: 'Make Jane an owner?' })
-    ).toBeVisible()
-    await page.getByRole('button', { name: 'Cancel', exact: true }).click()
-    await expect(janeRow.getByText('Member', { exact: true })).toBeVisible()
-  })
-})

browser_tests/tests/dialogs/pricingTableDeepLink.spec.ts

@@ -1,128 +0,0 @@
-import { expect } from '@playwright/test'
-import type { Page } from '@playwright/test'
-
-import type { RemoteConfig } from '@/platform/remoteConfig/types'
-import type {
-  Member,
-  WorkspaceWithRole
-} from '@/platform/workspace/api/workspaceApi'
-
-import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
-import { mockBilling } from '@e2e/fixtures/utils/cloudBillingMocks'
-import { bootCloud, mockCloudBoot } from '@e2e/fixtures/utils/cloudBootMocks'
-import { jsonRoute } from '@e2e/fixtures/utils/jsonRoute'
-import {
-  member,
-  mockWorkspace,
-  workspace
-} from '@e2e/fixtures/utils/workspaceMocks'
-
-/**
- * The `?pricing=` deep link opens the pricing table on app load, gated to the
- * original owner (canManageSubscriptionLifecycle). Drives a raw `page` so the
- * cloud app boots against fully mocked endpoints, like the survey-gate spec.
- */
-const APP_URL = process.env.PLAYWRIGHT_TEST_URL || 'http://localhost:8188'
-
-// CloudAuthHelper.mockAuth() signs in as this email; the original-owner gate
-// matches it against the members self-row.
-const SELF_EMAIL = 'e2e@test.comfy.org'
-
-const BOOT_FEATURES = { team_workspaces_enabled: true } satisfies RemoteConfig
-// Disable the experimental Asset API: with it on (cloud default) the unmocked
-// asset endpoints 403 and workflow restore throws uncaught, aborting the
-// GraphCanvas onMounted chain before the deep-link loader.
-const BOOT_SETTINGS = { 'Comfy.Assets.UseAssetAPI': false }
-
-// The deep-link loader runs at the tail of GraphCanvas onMounted, so the boot
-// chain must not throw before it: a missing settings subpath, prompt exec_info,
-// or queue status each abort that chain.
-async function mockGraphBootExtras(page: Page) {
-  // Boot only reads these; fall back on any write so an unexpected POST/PUT
-  // surfaces instead of being masked by a blanket 200.
-  await page.route('**/api/settings/**', (route) => {
-    if (route.request().method() !== 'GET') return route.fallback()
-    return route.fulfill(jsonRoute({}))
-  })
-  await page.route('**/api/prompt', (route) => {
-    if (route.request().method() !== 'GET') return route.fallback()
-    return route.fulfill(jsonRoute({ exec_info: { queue_remaining: 0 } }))
-  })
-  await page.route('**/api/queue', (route) => {
-    if (route.request().method() !== 'GET') return route.fallback()
-    return route.fulfill(jsonRoute({ queue_running: [], queue_pending: [] }))
-  })
-}
-
-async function setupCloudApp(
-  page: Page,
-  ws: WorkspaceWithRole,
-  members: Member[]
-) {
-  await mockCloudBoot(page, {
-    features: BOOT_FEATURES,
-    settings: BOOT_SETTINGS
-  })
-  await mockGraphBootExtras(page)
-  await mockBilling(page)
-  await mockWorkspace(page, ws, members)
-  await bootCloud(page)
-}
-
-const pricingHeading = (page: Page) =>
-  page.getByRole('heading', { name: 'Choose a Plan' })
-
-test.describe('Pricing table deep link', { tag: '@cloud' }, () => {
-  test('opens the pricing table for a personal owner', async ({ page }) => {
-    test.slow()
-    await setupCloudApp(page, workspace('personal', 'owner'), [])
-
-    await page.goto(`${APP_URL}/?pricing=1`)
-
-    await expect(pricingHeading(page)).toBeVisible({ timeout: 45_000 })
-    await expect(page).not.toHaveURL(/[?&]pricing=/)
-  })
-
-  test('opens on the Team tab for ?pricing=team', async ({ page }) => {
-    test.slow()
-    await setupCloudApp(page, workspace('personal', 'owner'), [])
-
-    await page.goto(`${APP_URL}/?pricing=team`)
-
-    await expect(pricingHeading(page)).toBeVisible({ timeout: 45_000 })
-    await expect(
-      page.getByRole('button', { name: 'For Teams' })
-    ).toHaveAttribute('aria-pressed', 'true')
-  })
-
-  test('opens for a team original owner', async ({ page }) => {
-    test.slow()
-    await setupCloudApp(page, workspace('team', 'owner'), [
-      member({ email: SELF_EMAIL, role: 'owner', is_original_owner: true })
-    ])
-
-    await page.goto(`${APP_URL}/?pricing=1`)
-
-    await expect(pricingHeading(page)).toBeVisible({ timeout: 45_000 })
-  })
-
-  test('is a silent no-op for a team member', async ({ page }) => {
-    test.slow()
-    await setupCloudApp(page, workspace('team', 'member'), [
-      member({
-        email: 'creator@test.comfy.org',
-        role: 'owner',
-        is_original_owner: true
-      }),
-      member({ email: SELF_EMAIL, role: 'member' })
-    ])
-
-    await page.goto(`${APP_URL}/?pricing=1`)
-
-    await page.waitForFunction(() => !!window.app?.extensionManager, null, {
-      timeout: 45_000
-    })
-    await expect(page).not.toHaveURL(/[?&]pricing=/)
-    await expect(pricingHeading(page)).toBeHidden()
-  })
-})

browser_tests/tests/nodeLibraryEssentials.spec.ts

@@ -33,11 +33,49 @@ test.describe('Node Library Essentials Tab', { tag: '@ui' }, () => {
     })
   })
 
+  test('Node library opens via sidebar', async ({ comfyPage }) => {
+    const tabButton = comfyPage.page.locator('.node-library-tab-button')
+    await tabButton.click()
+
+    const sidebarContent = comfyPage.page.locator(
+      '.comfy-vue-side-bar-container'
+    )
+    await expect(sidebarContent).toBeVisible()
+  })
+
+  test('Essentials tab is visible in node library', async ({ comfyPage }) => {
+    const tabButton = comfyPage.page.locator('.node-library-tab-button')
+    await tabButton.click()
+
+    const essentialsTab = comfyPage.page.getByRole('tab', {
+      name: /essentials/i
+    })
+    await expect(essentialsTab).toBeVisible()
+  })
+
+  test('Clicking essentials tab shows essential node cards', async ({
+    comfyPage
+  }) => {
+    const tabButton = comfyPage.page.locator('.node-library-tab-button')
+    await tabButton.click()
+
+    const essentialsTab = comfyPage.page.getByRole('tab', {
+      name: /essentials/i
+    })
+    await essentialsTab.click()
+
+    const essentialCards = comfyPage.page.locator('[data-node-name]')
+    await expect(essentialCards.first()).toBeVisible()
+  })
+
   test('Essential node cards have node names', async ({ comfyPage }) => {
-    await comfyPage.settings.setSetting('Comfy.NodeLibrary.NewDesign', true)
-    const tab = comfyPage.menu.nodeLibraryTabV2
-    await tab.open()
-    await tab.essentialsTab.click()
+    const tabButton = comfyPage.page.locator('.node-library-tab-button')
+    await tabButton.click()
+
+    const essentialsTab = comfyPage.page.getByRole('tab', {
+      name: /essentials/i
+    })
+    await essentialsTab.click()
 
     const firstCard = comfyPage.page.locator('[data-node-name]').first()
     await expect(firstCard).toBeVisible()
@@ -48,18 +86,21 @@ test.describe('Node Library Essentials Tab', { tag: '@ui' }, () => {
   test('Node library can switch between all and essentials tabs', async ({
     comfyPage
   }) => {
-    await comfyPage.settings.setSetting('Comfy.NodeLibrary.NewDesign', true)
-    const tab = comfyPage.menu.nodeLibraryTabV2
-    await tab.open()
-    await tab.allTab.click()
+    const tabButton = comfyPage.page.locator('.node-library-tab-button')
+    await tabButton.click()
 
-    await tab.essentialsTab.click()
-    await expect(tab.essentialsTab).toHaveAttribute('aria-selected', 'true')
+    const essentialsTab = comfyPage.page.getByRole('tab', {
+      name: /essentials/i
+    })
+    const allNodesTab = comfyPage.page.getByRole('tab', { name: /^all$/i })
+
+    await essentialsTab.click()
+    await expect(essentialsTab).toHaveAttribute('aria-selected', 'true')
     const essentialCards = comfyPage.page.locator('[data-node-name]')
     await expect(essentialCards.first()).toBeVisible()
 
-    await tab.allTab.click()
-    await expect(tab.allTab).toHaveAttribute('aria-selected', 'true')
-    await expect(tab.essentialsTab).toHaveAttribute('aria-selected', 'false')
+    await allNodesTab.click()
+    await expect(allNodesTab).toHaveAttribute('aria-selected', 'true')
+    await expect(essentialsTab).toHaveAttribute('aria-selected', 'false')
   })
 })

browser_tests/tests/propertiesPanel/errorsTabCloudMissingModels.spec.ts

@@ -10,18 +10,7 @@ import {
   countAssetRequestsByTag,
   createCloudAssetsFixture
 } from '@e2e/fixtures/assetApiFixture'
-import {
-  cleanupFakeModel,
-  loadWorkflowAndOpenErrorsTab
-} from '@e2e/fixtures/helpers/ErrorsTabHelper'
-import {
-  NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-  expectNoMissingModelUi,
-  loadPromotedMissingModelAndOpenErrorsTab,
-  selectLegacyPromotedAssetModel,
-  selectSectionAssetPromotedModel,
-  selectVueAssetPromotedModel
-} from '@e2e/fixtures/utils/promotedMissingModel'
+import { loadWorkflowAndOpenErrorsTab } from '@e2e/fixtures/helpers/ErrorsTabHelper'
 import { TestIds } from '@e2e/fixtures/selectors'
 import { PropertiesPanelHelper } from '@e2e/tests/propertiesPanel/PropertiesPanelHelper'
 
@@ -31,8 +20,6 @@ const WORKFLOW = 'missing/nested_subgraph_installed_model'
 const IMPORT_SECTIONS_WORKFLOW = 'missing/cloud_missing_model_import_sections'
 const OUTER_SUBGRAPH_NODE_ID = '205'
 const LOTUS_MODEL_NAME = 'lotus-depth-d-v1-1.safetensors'
-const FAKE_MODEL_NAME = 'fake_model.safetensors'
-const RESOLVED_PROMOTED_MODEL_NAME = 'resolved_model.safetensors'
 const CLOUD_IMPORTABLE_MODEL_NAME = 'cloud_importable_model.safetensors'
 const CLOUD_UNKNOWN_MODEL_NAME = 'cloud_unknown_model.safetensors'
 const CLOUD_IMPORTED_CANONICAL_MODEL_NAME =
@@ -68,25 +55,7 @@ const EXISTING_CLOUD_IMPORTABLE_MODEL: Asset & { hash?: string } = {
   }
 }
 
-const RESOLVED_PROMOTED_MODEL_ASSET: Asset & { hash?: string } = {
-  id: 'test-resolved-promoted-model',
-  name: RESOLVED_PROMOTED_MODEL_NAME,
-  hash: 'blake3:0000000000000000000000000000000000000000000000000000000000000205',
-  size: 1_024,
-  mime_type: 'application/octet-stream',
-  tags: ['models', 'checkpoints'],
-  created_at: '2026-05-05T00:00:00Z',
-  updated_at: '2026-05-05T00:00:00Z',
-  last_access_time: '2026-05-05T00:00:00Z',
-  user_metadata: {
-    filename: RESOLVED_PROMOTED_MODEL_NAME
-  }
-}
-
 const test = createCloudAssetsFixture([LOTUS_DIFFUSION_MODEL])
-const promotedModelTest = createCloudAssetsFixture([
-  RESOLVED_PROMOTED_MODEL_ASSET
-])
 
 function getRequestedIncludeTags(requestUrl: string): string[] {
   return (
@@ -394,84 +363,3 @@ test.describe(
     })
   }
 )
-
-promotedModelTest.describe(
-  'Errors tab - Cloud promoted subgraph missing models',
-  { tag: '@cloud' },
-  () => {
-    promotedModelTest.beforeEach(async ({ comfyPage }) => {
-      await cleanupFakeModel(comfyPage)
-      await comfyPage.settings.setSetting('Comfy.Assets.UseAssetAPI', true)
-      await comfyPage.settings.setSetting(
-        'Comfy.RightSidePanel.ShowErrorsTab',
-        true
-      )
-    })
-
-    promotedModelTest.afterEach(async ({ comfyPage }) => {
-      await cleanupFakeModel(comfyPage)
-    })
-
-    promotedModelTest(
-      'Changing a Cloud Vue promoted asset widget clears a nested subgraph error',
-      { tag: ['@vue-nodes', '@widget', '@subgraph'] },
-      async ({ comfyPage }) => {
-        await loadPromotedMissingModelAndOpenErrorsTab(
-          comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          FAKE_MODEL_NAME
-        )
-
-        await selectVueAssetPromotedModel(
-          comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          FAKE_MODEL_NAME,
-          RESOLVED_PROMOTED_MODEL_NAME
-        )
-
-        await expectNoMissingModelUi(comfyPage)
-      }
-    )
-
-    promotedModelTest(
-      'Changing a Cloud Vue promoted asset from the Parameters tab clears a nested subgraph error',
-      { tag: ['@vue-nodes', '@widget', '@subgraph'] },
-      async ({ comfyPage }) => {
-        await loadPromotedMissingModelAndOpenErrorsTab(
-          comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          FAKE_MODEL_NAME
-        )
-
-        await selectSectionAssetPromotedModel(
-          comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          FAKE_MODEL_NAME,
-          RESOLVED_PROMOTED_MODEL_NAME
-        )
-
-        await expectNoMissingModelUi(comfyPage)
-      }
-    )
-
-    promotedModelTest(
-      'Changing a Cloud legacy promoted asset clears a nested subgraph error',
-      { tag: ['@canvas', '@widget', '@subgraph'] },
-      async ({ comfyPage }) => {
-        await loadPromotedMissingModelAndOpenErrorsTab(
-          comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          FAKE_MODEL_NAME
-        )
-
-        await selectLegacyPromotedAssetModel(
-          comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          RESOLVED_PROMOTED_MODEL_ASSET.id
-        )
-
-        await expectNoMissingModelUi(comfyPage)
-      }
-    )
-  }
-)

browser_tests/tests/propertiesPanel/errorsTabMissingMediaRuntime.spec.ts

@@ -8,10 +8,6 @@ import {
 } from '@e2e/fixtures/assetApiFixture'
 import { comfyPageFixture } from '@e2e/fixtures/ComfyPage'
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
-import {
-  routeObjectInfoFromSetupApi,
-  setComboInputOptions
-} from '@e2e/fixtures/utils/objectInfo'
 import {
   createRouteMockJob,
   jobsRouteFixture
@@ -90,6 +86,50 @@ interface CloudUploadAssetState {
   isUploadedAssetAvailable: boolean
 }
 
+type ObjectInfoResponse = Record<
+  string,
+  { input?: { required?: Record<string, unknown> } }
+>
+
+function setComboInputOptions(
+  objectInfo: ObjectInfoResponse,
+  nodeType: string,
+  inputName: string,
+  values: string[]
+) {
+  const nodeInfo = objectInfo[nodeType]
+  if (!nodeInfo) {
+    throw new Error(`Missing object_info entry for ${nodeType}`)
+  }
+
+  const requiredInputs = nodeInfo.input?.required
+  if (!requiredInputs) {
+    throw new Error(`Missing required inputs for ${nodeType}`)
+  }
+
+  const input = requiredInputs[inputName]
+  if (!Array.isArray(input)) {
+    throw new Error(`Expected ${nodeType}.${inputName} to be a combo input`)
+  }
+
+  const [valuesOrType, options] = input
+  const optionsObject =
+    options && typeof options === 'object' && !Array.isArray(options)
+  if (Array.isArray(valuesOrType)) {
+    input[0] = values
+  } else if (valuesOrType !== 'COMBO') {
+    throw new Error(`Expected ${nodeType}.${inputName} to have combo options`)
+  }
+
+  if (optionsObject) {
+    Object.assign(options, { options: values })
+  } else if (!Array.isArray(valuesOrType)) {
+    throw new Error(
+      `Expected ${nodeType}.${inputName} to have options metadata`
+    )
+  }
+}
+
 async function routeCloudBootstrapApis(page: Page) {
   await page.route('**/api/settings**', async (route) => {
     await route.fulfill({
@@ -121,10 +161,57 @@ async function routeCloudBootstrapApis(page: Page) {
   })
 }
 
+async function routeSetupObjectInfo(
+  page: Page,
+  customize?: (objectInfo: ObjectInfoResponse) => void
+) {
+  const setupApiUrl =
+    process.env.PLAYWRIGHT_SETUP_API_URL ?? 'http://127.0.0.1:8188'
+  const objectInfoUrl = new URL('/object_info', setupApiUrl).toString()
+
+  const objectInfoRouteHandler = async (route: Route) => {
+    try {
+      const response = await fetch(objectInfoUrl, {
+        signal: AbortSignal.timeout(5_000)
+      })
+      if (!response.ok) {
+        await route.fulfill({
+          status: response.status,
+          contentType: response.headers.get('content-type') ?? 'text/plain',
+          body: await response.text()
+        })
+        return
+      }
+
+      const objectInfo = (await response.json()) as ObjectInfoResponse
+      customize?.(objectInfo)
+
+      await route.fulfill({
+        status: response.status,
+        contentType: 'application/json',
+        body: JSON.stringify(objectInfo)
+      })
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error)
+      await route.fulfill({
+        status: 502,
+        contentType: 'application/json',
+        body: JSON.stringify({
+          error: `Failed to fetch setup object_info from ${objectInfoUrl}: ${message}`
+        })
+      })
+    }
+  }
+
+  await page.route('**/object_info', objectInfoRouteHandler)
+  return async () =>
+    await page.unroute('**/object_info', objectInfoRouteHandler)
+}
+
 const cloudOutputTest = createCloudAssetsFixture([cloudOutputAsset]).extend({
   page: async ({ page }, use) => {
     await routeCloudBootstrapApis(page)
-    const unrouteObjectInfo = await routeObjectInfoFromSetupApi(page)
+    const unrouteObjectInfo = await routeSetupObjectInfo(page)
 
     try {
       await use(page)
@@ -138,16 +225,13 @@ const cloudEmptyMediaInputsTest = createCloudAssetsFixture([]).extend({
   page: async ({ page }, use) => {
     await routeCloudBootstrapApis(page)
 
-    const unrouteObjectInfo = await routeObjectInfoFromSetupApi(
-      page,
-      (objectInfo) => {
-        for (const node of emptyMediaLoaderNodes) {
-          setComboInputOptions(objectInfo, node.nodeType, node.widgetName, [
-            node.serverOnlyOption
-          ])
-        }
+    const unrouteObjectInfo = await routeSetupObjectInfo(page, (objectInfo) => {
+      for (const node of emptyMediaLoaderNodes) {
+        setComboInputOptions(objectInfo, node.nodeType, node.widgetName, [
+          node.serverOnlyOption
+        ])
       }
-    )
+    })
 
     try {
       await use(page)
@@ -162,7 +246,7 @@ const cloudUploadRaceTest = comfyPageFixture.extend<{
 }>({
   page: async ({ page }, use) => {
     await routeCloudBootstrapApis(page)
-    const unrouteObjectInfo = await routeObjectInfoFromSetupApi(page)
+    const unrouteObjectInfo = await routeSetupObjectInfo(page)
 
     const state: CloudUploadAssetState = {
       isUploadedAssetAvailable: false

browser_tests/tests/propertiesPanel/errorsTabModeAware.spec.ts

@@ -8,46 +8,12 @@ import {
   openErrorsTab,
   loadWorkflowAndOpenErrorsTab
 } from '@e2e/fixtures/helpers/ErrorsTabHelper'
-import {
-  appendComboInputOptions,
-  routeObjectInfoFromSetupApi
-} from '@e2e/fixtures/utils/objectInfo'
-import {
-  NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-  expectMissingModelReferenceCount,
-  expectNoMissingModelUi,
-  expectResolvedPromotedModelSuppressesStaleInteriorErrors,
-  expectSingleMissingModelReference,
-  getMissingModelLabel,
-  loadPromotedMissingModelAndOpenErrorsTab,
-  loadPromotedMissingModelWithHostValuesAndOpenErrorsTab,
-  selectSectionComboPromotedModel,
-  selectVueComboPromotedModelByTitle,
-  setLegacyPromotedComboModel
-} from '@e2e/fixtures/utils/promotedMissingModel'
 
 const FAKE_MODEL_NAME = 'fake_model.safetensors'
-const RESOLVED_PROMOTED_MODEL_NAME = 'resolved_model.safetensors'
 
-const promotedModelTest = test.extend({
-  page: async ({ page }, use) => {
-    const unrouteObjectInfo = await routeObjectInfoFromSetupApi(
-      page,
-      (objectInfo) =>
-        appendComboInputOptions(
-          objectInfo,
-          'CheckpointLoaderSimple',
-          'ckpt_name',
-          [RESOLVED_PROMOTED_MODEL_NAME]
-        )
-    )
-    try {
-      await use(page)
-    } finally {
-      await unrouteObjectInfo()
-    }
-  }
-})
+function getModelLabel(group: Locator, modelName: string = FAKE_MODEL_NAME) {
+  return group.getByRole('button', { name: modelName, exact: true })
+}
 
 async function expectReferenceBadge(group: Locator, count: number) {
   await expect(
@@ -203,9 +169,7 @@ test.describe('Errors tab - Mode-aware errors', { tag: '@ui' }, () => {
         TestIds.dialogs.missingModelsGroup
       )
       await expect(missingModelGroup).toBeVisible()
-      await expect(
-        getMissingModelLabel(missingModelGroup, FAKE_MODEL_NAME)
-      ).toBeVisible()
+      await expect(getModelLabel(missingModelGroup)).toBeVisible()
 
       const node = await comfyPage.nodeOps.getNodeRefById('1')
       await node.click('title')
@@ -301,9 +265,7 @@ test.describe('Errors tab - Mode-aware errors', { tag: '@ui' }, () => {
 
       const node1 = await comfyPage.nodeOps.getNodeRefById('1')
       await node1.click('title')
-      await expect(
-        getMissingModelLabel(missingModelGroup, FAKE_MODEL_NAME)
-      ).toBeVisible()
+      await expect(getModelLabel(missingModelGroup)).toBeVisible()
       await expect(
         missingModelGroup.getByTestId(TestIds.dialogs.missingModelLocate)
       ).toHaveCount(1)
@@ -419,184 +381,92 @@ test.describe('Errors tab - Mode-aware errors', { tag: '@ui' }, () => {
       await cleanupFakeModel(comfyPage)
     })
 
-    promotedModelTest(
-      'Changing an OSS Vue promoted model clears a nested subgraph error',
-      { tag: ['@vue-nodes', '@widget', '@subgraph'] },
-      async ({ comfyPage }) => {
-        let missingModelGroup: Locator
-
-        await test.step('A: shared-definition active host reports the missing model', async () => {
-          missingModelGroup = await loadPromotedMissingModelAndOpenErrorsTab(
-            comfyPage,
-            NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-            FAKE_MODEL_NAME
-          )
-        })
-
-        await test.step('B: bypassing the resolved sibling host keeps the active host error visible', async () => {
-          const siblingHostNodeId =
-            NESTED_PROMOTED_MISSING_MODEL_WORKFLOW.sharedDefinitionSiblingHostNodeId
-          if (siblingHostNodeId === undefined) {
-            throw new Error('Expected a shared-definition sibling host')
-          }
-
-          const siblingHost =
-            await comfyPage.nodeOps.getNodeRefById(siblingHostNodeId)
-          await siblingHost.centerOnNode()
-          await siblingHost.click('title')
-          await comfyPage.keyboard.bypass()
-          await expect.poll(() => siblingHost.isBypassed()).toBeTruthy()
-          await comfyPage.canvas.click({ position: { x: 700, y: 650 } })
-          await openErrorsTab(comfyPage)
-          await expectSingleMissingModelReference(
-            missingModelGroup,
-            FAKE_MODEL_NAME
-          )
-        })
-
-        await test.step('C: changing the active host promoted widget resolves the model', async () => {
-          const activeHost = await comfyPage.nodeOps.getNodeRefById(
-            NESTED_PROMOTED_MISSING_MODEL_WORKFLOW.hostNodeId
-          )
-          await activeHost.centerOnNode()
-          await selectVueComboPromotedModelByTitle(
-            comfyPage,
-            NESTED_PROMOTED_MISSING_MODEL_WORKFLOW.hostNodeTitle,
-            RESOLVED_PROMOTED_MODEL_NAME
-          )
-        })
-
-        await test.step('D: the missing model UI clears', async () => {
-          await expectNoMissingModelUi(comfyPage)
-        })
-
-        await test.step('E: two missing shared-definition hosts report two references', async () => {
-          const siblingHostNodeId =
-            NESTED_PROMOTED_MISSING_MODEL_WORKFLOW.sharedDefinitionSiblingHostNodeId
-          if (siblingHostNodeId === undefined) {
-            throw new Error('Expected a shared-definition sibling host')
-          }
-
-          missingModelGroup =
-            await loadPromotedMissingModelWithHostValuesAndOpenErrorsTab(
-              comfyPage,
-              NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-              {
-                [siblingHostNodeId]: FAKE_MODEL_NAME,
-                [NESTED_PROMOTED_MISSING_MODEL_WORKFLOW.hostNodeId]:
-                  FAKE_MODEL_NAME
-              },
-              FAKE_MODEL_NAME,
-              2
-            )
-        })
-
-        await test.step('F: changing one missing host leaves the other missing reference', async () => {
-          await selectVueComboPromotedModelByTitle(
-            comfyPage,
-            NESTED_PROMOTED_MISSING_MODEL_WORKFLOW.hostNodeTitle,
-            RESOLVED_PROMOTED_MODEL_NAME
-          )
-          await expectMissingModelReferenceCount(
-            missingModelGroup,
-            FAKE_MODEL_NAME,
-            1
-          )
-        })
-
-        await test.step('G: changing the remaining missing host clears the model error', async () => {
-          const siblingHostTitle =
-            NESTED_PROMOTED_MISSING_MODEL_WORKFLOW.sharedDefinitionSiblingHostNodeTitle
-          if (siblingHostTitle === undefined) {
-            throw new Error('Expected a shared-definition sibling host title')
-          }
-
-          await selectVueComboPromotedModelByTitle(
-            comfyPage,
-            siblingHostTitle,
-            RESOLVED_PROMOTED_MODEL_NAME
-          )
-          await expectNoMissingModelUi(comfyPage)
-        })
-      }
-    )
-
-    promotedModelTest(
-      'Changing an OSS Vue promoted model from the Parameters tab clears a nested subgraph error',
-      { tag: ['@vue-nodes', '@widget', '@subgraph'] },
-      async ({ comfyPage }) => {
-        await loadPromotedMissingModelAndOpenErrorsTab(
-          comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          FAKE_MODEL_NAME
-        )
-
-        await selectSectionComboPromotedModel(
-          comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          RESOLVED_PROMOTED_MODEL_NAME
-        )
-
-        await expectNoMissingModelUi(comfyPage)
-      }
-    )
-
-    promotedModelTest(
-      'Changing an OSS legacy promoted model clears a nested subgraph error',
+    test(
+      'Resolving a promoted missing model widget through the legacy canvas path clears its error',
       { tag: ['@canvas', '@widget', '@subgraph'] },
       async ({ comfyPage }) => {
+        const resolvedModelName = 'v1-5-pruned-emaonly-fp16.safetensors'
+
         await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', false)
-        await loadPromotedMissingModelAndOpenErrorsTab(
+        await loadWorkflowAndOpenErrorsTab(
           comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          FAKE_MODEL_NAME
+          'missing/missing_model_promoted_widget'
         )
 
-        await setLegacyPromotedComboModel(
-          comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          RESOLVED_PROMOTED_MODEL_NAME
+        const missingModelGroup = comfyPage.page.getByTestId(
+          TestIds.dialogs.missingModelsGroup
         )
+        await expect(getModelLabel(missingModelGroup)).toBeVisible()
 
-        await expectNoMissingModelUi(comfyPage)
+        await comfyPage.page.evaluate((value) => {
+          const hostNode = window.app!.graph!.getNodeById(2)
+          if (!hostNode?.isSubgraphNode()) {
+            throw new Error('Expected subgraph host node')
+          }
+
+          const interiorNode = hostNode.subgraph.getNodeById(1)
+          const widget = interiorNode?.widgets?.find(
+            (entry) => entry.name === 'ckpt_name'
+          )
+          type SettableWidget = typeof widget & {
+            setValue?: (
+              value: string,
+              options: {
+                e: PointerEvent
+                node: unknown
+                canvas: unknown
+              }
+            ) => void
+          }
+          const settableWidget = widget as SettableWidget | undefined
+
+          if (!settableWidget?.setValue) {
+            throw new Error('Expected concrete ckpt_name widget')
+          }
+
+          settableWidget.setValue(value, {
+            e: new PointerEvent('pointerup'),
+            node: hostNode,
+            canvas: window.app!.canvas
+          })
+        }, resolvedModelName)
+
+        await expect(missingModelGroup).toBeHidden()
       }
     )
 
-    promotedModelTest(
+    test(
       'Refreshing a resolved promoted missing model clears the combo invalid state',
       { tag: ['@widget', '@subgraph'] },
       async ({ comfyPage }) => {
         await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
         await loadWorkflowAndOpenErrorsTab(
           comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW.workflowName
+          'missing/missing_model_promoted_widget'
         )
         await comfyPage.vueNodes.waitForNodes()
 
         const missingModelGroup = comfyPage.page.getByTestId(
           TestIds.dialogs.missingModelsGroup
         )
-        await expect(
-          getMissingModelLabel(missingModelGroup, FAKE_MODEL_NAME)
-        ).toBeVisible()
+        await expect(getModelLabel(missingModelGroup)).toBeVisible()
 
         const promotedModelCombo = comfyPage.vueNodes
-          .getNodeByTitle(NESTED_PROMOTED_MISSING_MODEL_WORKFLOW.hostNodeTitle)
+          .getNodeByTitle('Subgraph with Promoted Missing Model')
           .getByRole('combobox', { name: 'ckpt_name', exact: true })
         await expect(promotedModelCombo).toHaveAttribute('aria-invalid', 'true')
 
-        const unrouteObjectInfo = await routeObjectInfoFromSetupApi(
-          comfyPage.page,
-          (objectInfo) =>
-            appendComboInputOptions(
-              objectInfo,
-              'CheckpointLoaderSimple',
-              'ckpt_name',
-              [FAKE_MODEL_NAME, RESOLVED_PROMOTED_MODEL_NAME]
-            )
-        )
-
+        const objectInfoRoute = /\/object_info$/
         try {
+          await comfyPage.page.route(objectInfoRoute, async (route) => {
+            const response = await route.fetch()
+            const objectInfo = await response.json()
+            const ckptName =
+              objectInfo.CheckpointLoaderSimple.input.required.ckpt_name
+            ckptName[0] = [...ckptName[0], 'fake_model.safetensors']
+            await route.fulfill({ response, json: objectInfo })
+          })
+
           await comfyPage.page
             .getByTestId(TestIds.dialogs.missingModelRefresh)
             .click()
@@ -608,31 +478,11 @@ test.describe('Errors tab - Mode-aware errors', { tag: '@ui' }, () => {
             'true'
           )
         } finally {
-          await unrouteObjectInfo()
+          await comfyPage.page.unroute(objectInfoRoute)
         }
       }
     )
 
-    promotedModelTest(
-      'Reloading a resolved nested promoted model ignores stale interior values',
-      { tag: ['@vue-nodes', '@widget', '@subgraph'] },
-      async ({ comfyPage }) => {
-        await expectResolvedPromotedModelSuppressesStaleInteriorErrors(
-          comfyPage,
-          NESTED_PROMOTED_MISSING_MODEL_WORKFLOW,
-          [
-            {
-              subgraphNodeIdToEnter: '4',
-              nodeTitle: 'Inner Subgraph with Promoted Missing Model'
-            },
-            { subgraphNodeIdToEnter: '2', nodeTitle: 'Load Checkpoint' }
-          ],
-          RESOLVED_PROMOTED_MODEL_NAME,
-          FAKE_MODEL_NAME
-        )
-      }
-    )
-
     test('Bypassing a subgraph hides interior errors, un-bypassing restores them', async ({
       comfyPage
     }) => {

browser_tests/tests/sidebar/nodeLibraryV2.spec.ts

@@ -10,6 +10,20 @@ test.describe('Node library sidebar V2', () => {
     await tab.open()
   })
 
+  test('Can switch between tabs', async ({ comfyPage }) => {
+    const tab = comfyPage.menu.nodeLibraryTabV2
+
+    await expect(tab.allTab).toHaveAttribute('aria-selected', 'true')
+
+    await tab.blueprintsTab.click()
+    await expect(tab.blueprintsTab).toHaveAttribute('aria-selected', 'true')
+    await expect(tab.allTab).toHaveAttribute('aria-selected', 'false')
+
+    await tab.allTab.click()
+    await expect(tab.allTab).toHaveAttribute('aria-selected', 'true')
+    await expect(tab.blueprintsTab).toHaveAttribute('aria-selected', 'false')
+  })
+
   test('All tab displays node tree with folders', async ({ comfyPage }) => {
     const tab = comfyPage.menu.nodeLibraryTabV2
 
@@ -109,9 +123,8 @@ test.describe('Node library sidebar V2', () => {
 
   test('Blueprint previews include description', async ({ comfyPage }) => {
     const tab = comfyPage.menu.nodeLibraryTabV2
-    await tab.allTab.click()
+    await tab.blueprintsTab.click()
 
-    await tab.expandFolder('Comfy Blueprints')
     await tab.getNode('test blueprint').hover()
     await expect(tab.nodePreview, 'Preview displays on hover').toBeVisible()
     await expect(tab.nodePreview).toContainText('Inverts the image')

browser_tests/tests/subgraph/subgraphPromotion.spec.ts

@@ -471,10 +471,11 @@ test.describe(
           'subgraphs/subgraph-with-promoted-text-widget'
         )
 
+        let initialWidgetCount = 0
         await expect
           .poll(() => getPromotedWidgetCount(comfyPage, '11'))
           .toBeGreaterThan(0)
-        const initialWidgetCount = await getPromotedWidgetCount(comfyPage, '11')
+        initialWidgetCount = await getPromotedWidgetCount(comfyPage, '11')
 
         const subgraphNode = await comfyPage.nodeOps.getNodeRefById('11')
         await subgraphNode.navigateIntoSubgraph()

browser_tests/tests/vueNodes/interactions/node/move.spec.ts

@@ -6,7 +6,6 @@ import {
 } from '@e2e/fixtures/ComfyPage'
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import type { Position } from '@e2e/fixtures/types'
-import { VueNodeFixture } from '@e2e/fixtures/utils/vueNodeFixtures'
 
 test.describe('Vue Node Moving', { tag: '@vue-nodes' }, () => {
   const getHeaderPos = async (
@@ -360,55 +359,6 @@ test.describe('Vue Node Moving', { tag: '@vue-nodes' }, () => {
     expect(await getOffset(), 'drag canceled').toEqual(secondaryOffset)
   })
 
-  test('dragging a node moves all selected items', async ({
-    comfyPage,
-    comfyMouse
-  }) => {
-    const samplerLocator = comfyPage.vueNodes.getNodeByTitle('KSampler')
-    const ksampler = new VueNodeFixture(samplerLocator)
-    const loaderLocator = comfyPage.vueNodes.getNodeByTitle('Load Checkpoint')
-    const loader = new VueNodeFixture(loaderLocator)
-
-    await test.step('create graph with group and reroute', async () => {
-      await comfyPage.nodeOps.clearGraph()
-      await comfyPage.searchBoxV2.addNode('Load Checkpoint')
-      const samplerOptions = { position: { x: 800, y: 200 } }
-      await comfyPage.searchBoxV2.addNode('KSampler', samplerOptions)
-      await ksampler.getSlot('model').dragTo(loader.getSlot('MODEL'))
-
-      await test.step('add reroute', async () => {
-        const b1 = await ksampler.getSlot('model').boundingBox()
-        const b2 = await loader.getSlot('MODEL').boundingBox()
-        if (!b1 || !b2) throw new Error('Failed to get bounds')
-
-        const x = (b1.x + b2.x + (b1.width + b2.width) / 2) / 2
-        const y = (b1.y + b2.y + (b1.height + b2.height) / 2) / 2
-        await comfyPage.page.keyboard.down('Alt')
-        await comfyPage.page.mouse.click(x, y)
-        await comfyPage.page.keyboard.up('Alt')
-
-        const rerouteCount = () =>
-          comfyPage.page.evaluate(() => graph!.reroutes.size)
-        await expect.poll(rerouteCount).toBe(1)
-      })
-
-      await comfyPage.keyboard.selectAll()
-      await comfyPage.page.keyboard.press('Control+G')
-      await comfyPage.keyboard.selectAll()
-    })
-
-    const getReroutePos = () =>
-      comfyPage.page.evaluate(() => [...graph!.reroutes.values()][0])
-    const getGroupPos = () =>
-      comfyPage.page.evaluate(() => graph!.groups[0].pos)
-    const initialReroutePos = await getReroutePos()
-    const initialGroupPos = await getGroupPos()
-    await comfyMouse.dragElementBy(ksampler.title, { x: 100 })
-
-    await expect.poll(getReroutePos).not.toEqual(initialReroutePos)
-    await expect.poll(getGroupPos).not.toEqual(initialGroupPos)
-  })
-
   test(
     '@mobile should allow moving nodes by dragging on touch devices',
     { tag: '@screenshot' },

browser_tests/tests/vueNodes/interactions/node/tooltips.spec.ts

@@ -1,26 +0,0 @@
-import {
-  comfyExpect as expect,
-  comfyPageFixture as test
-} from '@e2e/fixtures/ComfyPage'
-
-test.describe('tooltips', { tag: '@vue-nodes' }, async () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.settings.setSetting('Comfy.EnableTooltips', true)
-    await comfyPage.settings.setSetting('LiteGraph.Node.TooltipDelay', 0)
-  })
-
-  test('widget value tooltips', async ({ comfyPage }) => {
-    const tooltip = comfyPage.page.locator('.p-tooltip-text')
-    await comfyPage.vueNodes.getWidgetByName('load check', 'ckpt_name').hover()
-    await expect(tooltip, 'displays for combos').toContainText('v1-5-pruned')
-
-    await comfyPage.vueNodes.getWidgetByName('ksampler', 'seed').hover()
-    await expect(tooltip, 'displays for numbers').toContainText('15668')
-
-    await comfyPage.vueNodes.getNodeLocator('6').getByLabel('text').hover()
-    await expect(tooltip).toBeVisible()
-    await expect(tooltip, "doesn't display for prompts").not.toContainText(
-      'purple galaxy bottle'
-    )
-  })
-})

browser_tests/tests/vueNodes/widgets/widgetReactivity.spec.ts

@@ -73,16 +73,4 @@ test.describe('Vue Widget Reactivity', { tag: '@vue-nodes' }, () => {
 
     await expect(widget, 'Widget has restored value').toHaveText('scale width')
   })
-
-  test('Dynamic children have separate state', async ({ comfyPage }) => {
-    const nodeName = 'Node With Dynamic Combo'
-    await comfyPage.searchBoxV2.addNode(nodeName, {
-      position: { x: 200, y: 150 }
-    })
-    const child = comfyPage.vueNodes.getWidgetByName(nodeName, 'suboption')
-    await expect(child, 'initial state').toHaveText('1x')
-
-    await comfyPage.vueNodes.selectComboOption(nodeName, 'combo', 'option2')
-    await expect(child, 'child of same name has new state').toHaveText('2x')
-  })
 })

docs/adr/0008-entity-component-system.md

@@ -6,21 +6,6 @@ Date: 2026-03-23
 
 Proposed
 
-### Amendment (2026-06-19, PR 12617)
-
-The single central registry this ADR calls the "World" was superseded during
-implementation. Runtime entity data is held in dedicated Pinia stores keyed by
-string IDs — `widgetValueStore`, `domWidgetStore`, `layoutStore`,
-`nodeOutputStore`, `subgraphNavigationStore`, and `previewExposureStore`.
-Widget values are keyed by `WidgetId` (`graphId:nodeId:name`, see
-`src/types/widgetId.ts`); the `world/*` layer (`widgetValueIO`, `entityIds`,
-`brand`, `WidgetEntityId`) was deleted. The ECS principles below still hold —
-plain-data components, separation of data from behavior, command-driven
-mutation, and no god-object growth — realized across those stores. Where the
-text below says "the World," read "the set of dedicated stores"; where it shows
-`world.getComponent(id, Component)`, read the matching store getter (for
-example `widgetValueStore.getWidget(widgetId)`).
-
 ## Context
 
 The litegraph layer is built on deeply coupled OOP classes (`LGraphNode`, `LLink`, `Subgraph`, `BaseWidget`, `Reroute`, `LGraphGroup`, `SlotBase`). Each entity directly references its container and children — nodes hold widget arrays, widgets back-reference their node, links reference origin/target node IDs, subgraphs extend the graph class, and so on.
@@ -55,7 +40,7 @@ Six entity kinds, each with a branded ID type:
 | ----------- | ------------------------------------------------- | --------------------------- | ----------------- |
 | Node        | `LGraphNode`                                      | `NodeId = number \| string` | `NodeEntityId`    |
 | Link        | `LLink`                                           | `LinkId = number`           | `LinkEntityId`    |
-| Widget      | `BaseWidget` subclasses (25+)                     | name + parent node          | `WidgetId`        |
+| Widget      | `BaseWidget` subclasses (25+)                     | name + parent node          | `WidgetEntityId`  |
 | Slot        | `SlotBase` / `INodeInputSlot` / `INodeOutputSlot` | index on parent node        | `SlotEntityId`    |
 | Reroute     | `Reroute`                                         | `RerouteId = number`        | `RerouteEntityId` |
 | Group       | `LGraphGroup`                                     | `number`                    | `GroupEntityId`   |
@@ -69,6 +54,7 @@ Each entity kind gets a nominal/branded type wrapping its underlying primitive.
 ```ts
 type NodeEntityId = number & { readonly __brand: 'NodeEntityId' }
 type LinkEntityId = number & { readonly __brand: 'LinkEntityId' }
+type WidgetEntityId = number & { readonly __brand: 'WidgetEntityId' }
 type SlotEntityId = number & { readonly __brand: 'SlotEntityId' }
 type RerouteEntityId = number & { readonly __brand: 'RerouteEntityId' }
 type GroupEntityId = number & { readonly __brand: 'GroupEntityId' }
@@ -77,12 +63,7 @@ type GroupEntityId = number & { readonly __brand: 'GroupEntityId' }
 type GraphId = string & { readonly __brand: 'GraphId' }
 ```
 
-> **Amended (PR 12617):** Widgets are keyed by a branded composite **string**,
-> `WidgetId = graphId:nodeId:name` (`src/types/widgetId.ts`), rather than a
-> synthetic numeric `WidgetEntityId`. The composite stays self-documenting and
-> survives renames at the store layer. The numeric per-kind brands above for
-> Node/Link/Reroute/Group remain aspirational and unshipped; treat them as
-> design intent. Slots have no independent ID yet.
+Widgets and Slots currently lack independent IDs. The ECS will assign synthetic IDs at entity creation time via an auto-incrementing counter (matching the pattern used by `lastNodeId`, `lastLinkId`, etc. in `LGraphState`).
 
 ### Component Decomposition
 
@@ -158,24 +139,18 @@ A node carrying a subgraph gains these additional components. Subgraphs are not
 | `GroupVisual`   | `color`                             |
 | `GroupChildren` | child entity refs (nodes, reroutes) |
 
-### Dedicated stores
+### World
 
-Component data lives in a set of dedicated Pinia stores, each owning one
-concern and keyed by a string ID that embeds its graph scope (for example
-`widgetValueStore` keyed by `WidgetId = graphId:nodeId:name`, `layoutStore`
-keyed by `nodeId`/`linkId`/`rerouteId`, `nodeOutputStore` keyed by
-`subgraphId:nodeId`). Each store provides a clear-by-graph lifecycle hook
-(`clearGraph(graphId)`) and query helpers. A scope registry maps each `graphId`
-to its parent (or null for the root graph).
-
-> The original design centralized this in one "World" registry per workflow
-> instance; PR 12617 replaced that with the dedicated stores above. The
-> remainder of this section describes scoping, which applies per store.
+A central registry (the "World") maps entity IDs to their component sets. One
+World exists per workflow instance, containing all entities across all nesting
+levels. Each entity carries a `graphScope` identifier linking it to its
+containing graph. The World also maintains a scope registry mapping each
+`graphId` to its parent (or null for the root graph).
 
 The "single source of truth" claim in this ADR is scoped to one workflow
-instance, per concern. In a future linked-subgraph model, shared definitions
-can be loaded into multiple workflow instances, but mutable runtime state
-(widget values, execution state, selection, transient layout caches) remains
+instance. In a future linked-subgraph model, shared definitions can be loaded
+into multiple workflow instances, but mutable runtime components
+(`WidgetValue`, execution state, selection, transient layout caches) remain
 instance-scoped unless explicitly declared shareable.
 
 ### Subgraph recursion model
@@ -191,7 +166,7 @@ queries by `graphScope`.
 
 ### Systems (future work)
 
-Systems are pure functions that query the relevant store(s) for entities with specific component combinations. Initial candidates:
+Systems are pure functions that query the World for entities with specific component combinations. Initial candidates:
 
 - **RenderSystem** — queries `Position` + `Dimensions` (where present) + `*Visual` components
 - **SerializationSystem** — queries all components to produce/consume workflow JSON
@@ -203,23 +178,25 @@ System design is deferred to a future ADR. For detailed before/after walkthrough
 
 ### Migration Strategy
 
-1. **Define types** — string-key ID types (for example `WidgetId`) and plain-data component interfaces, owned by the store for each concern
-2. **Bridge layer** — adapter functions that read component data from existing class instances (zero-copy where possible)
-3. **New features first** — any new cross-cutting feature (e.g., CRDT sync) builds on store-backed components rather than class properties
-4. **Incremental extraction** — migrate one component at a time from classes into its dedicated store, using the bridge layer for backward compatibility
-5. **Deprecate class properties** — once all consumers read from the store, mark class properties as deprecated
+1. **Define types** — branded IDs, component interfaces, World type in a new `src/ecs/` directory
+2. **Bridge layer** — adapter functions that read ECS components from existing class instances (zero-copy where possible)
+3. **New features first** — any new cross-cutting feature (e.g., CRDT sync) builds on ECS components rather than class properties
+4. **Incremental extraction** — migrate one component at a time from classes to the World, using the bridge layer for backward compatibility
+5. **Deprecate class properties** — once all consumers read from the World, mark class properties as deprecated
 
 For the phased migration roadmap with shipping milestones, see [ECS Migration Plan](../architecture/ecs-migration-plan.md). For the full target architecture, see [ECS Target Architecture](../architecture/ecs-target-architecture.md). For an inventory of existing stores that already partially implement ECS patterns, see [Proto-ECS Stores](../architecture/proto-ecs-stores.md).
 
 ### Relationship to ADR 0003 (Command Pattern / CRDT)
 
-[ADR 0003](0003-crdt-based-layout-system.md) establishes that all mutations flow through serializable, idempotent commands. This ADR (0008) defines the entity data model and the dedicated stores that hold it. They are complementary architectural layers:
+[ADR 0003](0003-crdt-based-layout-system.md) establishes that all mutations flow through serializable, idempotent commands. This ADR (0008) defines the entity data model and the World store. They are complementary architectural layers:
 
 - **Commands** (ADR 0003) describe mutation intent — serializable objects that can be logged, replayed, sent over a wire, or undone.
-- **Systems** (ADR 0008) are command handlers — they validate and execute mutations against the relevant stores.
-- **The dedicated stores** (ADR 0008) hold component data and expose mutation APIs (for example `useLayoutMutations()`, `widgetValueStore.setValue`); each owns its own transaction boundary.
+- **Systems** (ADR 0008) are command handlers — they validate and execute mutations against the World.
+- **The World** (ADR 0008) is the store — it holds component data. It does not know about commands.
 
-A store's imperative mutators are internal implementation. External callers submit commands; each mutating store wraps its writes in a transaction (the Y.js-backed `layoutStore` already does this). This follows Redux: internal mutation is imperative, while the public API is action-based.
+The World's imperative API (`setComponent`, `deleteEntity`, etc.) is internal. External callers submit commands; the command executor wraps each in a World transaction. This is analogous to Redux: the store's internal mutation is imperative, but the public API is action-based.
+
+For the full design showing how each lifecycle scenario maps to a command, see [World API and Command Layer](../architecture/ecs-world-command-api.md).
 
 ### Alternatives Considered
 
@@ -233,26 +210,26 @@ A store's imperative mutators are internal implementation. External callers subm
 
 - Cross-cutting concerns (undo/redo, CRDT sync, serialization) can be implemented as systems without modifying entity classes
 - Components are independently testable — no need to construct an entire `LGraphNode` to test position logic
-- Branded IDs (including the composite `WidgetId` string) prevent a class of bugs where IDs are accidentally used across entity kinds
-- Each dedicated store provides a single source of truth for its concern inside a workflow instance, simplifying debugging and state inspection
+- Branded IDs prevent a class of bugs where IDs are accidentally used across entity kinds
+- The World provides a single source of truth for runtime entity state inside a workflow instance, simplifying debugging and state inspection
 - Aligns with the CRDT layout system direction from ADR 0003
 
 ### Negative
 
-- Additional indirection: reading a node's position requires a store lookup instead of `node.pos`
+- Additional indirection: reading a node's position requires a World lookup instead of `node.pos`
 - Learning curve for contributors unfamiliar with ECS patterns
 - Migration period where both OOP and ECS patterns coexist, increasing cognitive load
 - Widgets and Slots need synthetic IDs, adding ID management complexity
 
 ### Render-Loop Performance Implications and Mitigations
 
-Replacing direct property reads (`node.pos`) with store lookups (for example `layoutStore` position reads) does add per-read overhead in the hot render path. In modern JS engines, hot `Map.get()` paths are heavily optimized and are often within a low constant factor of object property reads, but this ADR treats render-loop cost as a first-class risk rather than assuming it is free.
+Replacing direct property reads (`node.pos`) with component lookups (`world.getComponent(nodeId, Position)`) does add per-read overhead in the hot render path. In modern JS engines, hot `Map.get()` paths are heavily optimized and are often within a low constant factor of object property reads, but this ADR treats render-loop cost as a first-class risk rather than assuming it is free.
 
 Planned mitigations for the ECS render path:
 
 1. Pre-collect render queries into frame-stable caches (`visibleNodeIds`, `visibleLinkIds`, and resolved component references) and rebuild only on topology/layout dirty signals, not on every draw call.
 2. Keep archetype-style buckets for common render signatures (for example: `Node = Position+Dimensions+NodeVisual`, `Reroute = Position+RerouteVisual`) so systems iterate arrays instead of probing unrelated entities.
-3. Allow a hot-path storage upgrade behind a store's API (for example, SoA-style typed arrays for `Position` and `Dimensions`) if profiling shows `Map.get()` dominates frame time.
+3. Allow a hot-path storage upgrade behind the World API (for example, SoA-style typed arrays for `Position` and `Dimensions`) if profiling shows `Map.get()` dominates frame time.
 4. Gate migration of each render concern with profiling parity checks against the legacy path (same workflow, same viewport, same frame budget).
 5. Treat parity as a release gate: ECS render path must stay within agreed frame-time budgets (for example, no statistically significant regression in p95 frame time on representative 200-node and 500-node workflows).
 
@@ -270,6 +247,7 @@ Companion architecture documents that expand on the design in this ADR:
 | [ECS Target Architecture](../architecture/ecs-target-architecture.md)                            | Full target architecture showing how entities and interactions transform under ECS                       |
 | [ECS Migration Plan](../architecture/ecs-migration-plan.md)                                      | Phased migration roadmap with shipping milestones and go/no-go criteria                                  |
 | [ECS Lifecycle Scenarios](../architecture/ecs-lifecycle-scenarios.md)                            | Before/after walkthroughs of lifecycle operations (node removal, link creation, etc.)                    |
+| [World API and Command Layer](../architecture/ecs-world-command-api.md)                          | How each lifecycle scenario maps to a command in the World API                                           |
 | [Subgraph Boundaries and Widget Promotion](../architecture/subgraph-boundaries-and-promotion.md) | Design rationale for modeling subgraphs as node components, not separate entities                        |
 | [ADR 0009: Subgraph promoted widgets](0009-subgraph-promoted-widgets-use-linked-inputs.md)       | Follow-up decision for promoted widget identity and value ownership at subgraph boundaries               |
 | [Appendix: Critical Analysis](../architecture/appendix-critical-analysis.md)                     | Independent verification of the accuracy of the architecture documents                                   |
@@ -280,5 +258,5 @@ Companion architecture documents that expand on the design in this ADR:
 
 - The 25+ widget types (`BooleanWidget`, `NumberWidget`, `ComboWidget`, etc.) will share the same ECS component schema. Widget-type-specific behavior lives in systems, not in component data.
 - Subgraphs are not a separate entity kind. A `GraphId` scope identifier (branded `string`) tracks which graph an entity belongs to. The scope DAG must be acyclic — see [Subgraph Boundaries](../architecture/subgraph-boundaries-and-promotion.md).
-- Widgets are addressed by the composite `WidgetId` string, so they need no synthetic counter. The existing `LGraphState.lastNodeId` / `lastLinkId` / `lastRerouteId` counters cover the kinds that have numeric IDs.
-- The internal ECS model and the serialization format are deliberately separate concerns. The `SerializationSystem` translates between the store-backed component data and the nested serialization format. Backward-compatible loading of all prior workflow formats is a hard, indefinite constraint.
+- The existing `LGraphState.lastNodeId` / `lastLinkId` / `lastRerouteId` counters extend naturally to `lastWidgetId` and `lastSlotId`.
+- The internal ECS model and the serialization format are deliberately separate concerns. The `SerializationSystem` translates between the flat World and the nested serialization format. Backward-compatible loading of all prior workflow formats is a hard, indefinite constraint.

docs/architecture/appendix-critical-analysis.md

@@ -2,13 +2,6 @@
 
 _In which we examine the shadow material of a codebase in individuation, verify its self-reported symptoms, and note where the ego's aspirations outpace the psyche's readiness for transformation._
 
-> **Post-pivot status (PR 12617).** This analysis was written against the
-> single-World ECS target. The project has since chosen dedicated Pinia stores
-> over one unified World, which acts on several of the concerns raised below.
-> Resolution notes are inlined where the pivot answers a critique; the still-open
-> gaps (extension-callback continuity, atomicity/undo, Y.js ↔ ECS coexistence)
-> remain live. Verification snapshots predate PR 12617.
-
 ---
 
 ## I. On the Accuracy of Self-Diagnosis
@@ -22,7 +15,7 @@ The god-objects are as large as claimed. `LGraphCanvas` contains 9,094 lines —
 
 Some thirty specific line references were verified against the living code. The `renderingColor` getter sits precisely at line 328. The `drawNode()` method begins exactly at line 5554, and within it, at lines 5562 and 5564, the render pass mutates state — `_setConcreteSlots()` and `arrange()` — just as the documents confess. The scattered `_version++` increments appear at every claimed location across all three files. The module-scope store invocations in `LLink.ts:24` and `Reroute.ts:23` are exactly where indicated.
 
-The stores — six of them — exist at their stated paths with their described APIs. The `WidgetValueStore` does indeed hold plain `WidgetState` objects, keyed by `WidgetId`. The `LayoutStore` does wrap Y.js CRDTs. (The `PromotionStore` named in the original snapshot was removed by PR 12617; promoted value state now lives in `WidgetValueStore`, and `PreviewExposureStore` holds host-scoped preview exposures.)
+The stores — all six of them — exist at their stated paths with their described APIs. The `WidgetValueStore` does indeed hold plain `WidgetState` objects. The `PromotionStore` does maintain its ref-counted maps. The `LayoutStore` does wrap Y.js CRDTs.
 
 This level of factual accuracy — 28 out of 30 sampled citation checks
 (93.3%) — is, one might say, the work of a consciousness that has genuinely
@@ -54,12 +47,6 @@ This is the individuation dream: the fragmented psyche imagines itself unified,
 
 It is a beautiful vision. It is also, in several respects, a fantasy that has not yet been tested against reality.
 
-> **Resolved (PR 12617).** The single World was set aside. The project keeps the
-> fragments deliberately apart — dedicated stores, each holding one concern and
-> keyed by its own string identity. The integration the dream sought lives in the
-> shared discipline (plain-data components, command-driven mutation), with the
-> stores standing on their own.
-
 ### The Line-Count Comparisons
 
 The lifecycle scenarios compare current implementations against projected ECS equivalents:
@@ -106,12 +93,6 @@ But one must be careful not to mistake diversity for disorder. Some of these com
 
 The documents present branded IDs as an unqualified improvement. They are an improvement in _type safety_. Whether they are an improvement in _comprehensibility_ depends on whether the system provides good lookup APIs. The analysis would benefit from acknowledging this tradeoff rather than presenting it as a pure gain.
 
-> **Resolved (PR 12617).** The pivot honored this concern. `WidgetValueStore`
-> keeps the self-documenting composite as its key, branded as a string
-> (`WidgetId = graphId:nodeId:name`, `src/types/widgetId.ts`), gaining cross-kind
-> safety while preserving the structural meaning the synthetic integer would have
-> shed.
-
 ## V. On the Subgraph: The Child Who Contains the Parent
 
 The documents describe the `Subgraph extends LGraph` relationship as a circular dependency. This is technically accurate and architecturally concerning. But it is also, symbolically, the most interesting structure in the entire system.
@@ -134,13 +115,13 @@ This is sound. The documents would benefit from being equally realistic about th
 
 ### Factual Corrections Required
 
-| Document              | Error                              | Correction                                            |
-| --------------------- | ---------------------------------- | ----------------------------------------------------- |
-| `entity-problems.md`  | `toJSON() (line 1033)`             | `toString() (line 1033)`                              |
-| `entity-problems.md`  | `execute() (line 1418)`            | `doExecute() (line 1411)`                             |
-| `entity-problems.md`  | `~539 method/property definitions` | ~848; methodology should be stated                    |
-| `entity-problems.md`  | `configure()` ~180 lines           | ~247 lines                                            |
-| `proto-ecs-stores.md` | `resolveDeepest()` in diagram      | moot — `PromotedWidgetViewManager` removed (PR 12617) |
+| Document              | Error                              | Correction                         |
+| --------------------- | ---------------------------------- | ---------------------------------- |
+| `entity-problems.md`  | `toJSON() (line 1033)`             | `toString() (line 1033)`           |
+| `entity-problems.md`  | `execute() (line 1418)`            | `doExecute() (line 1411)`          |
+| `entity-problems.md`  | `~539 method/property definitions` | ~848; methodology should be stated |
+| `entity-problems.md`  | `configure()` ~180 lines           | ~247 lines                         |
+| `proto-ecs-stores.md` | `resolveDeepest()` in diagram      | `reconcile()` / `getOrCreate()`    |
 
 ### Analytical Gaps
 
@@ -148,7 +129,7 @@ This is sound. The documents would benefit from being equally realistic about th
 2. **Atomicity guarantees** are claimed but not mechanically specified.
 3. **Y.js / ECS coexistence** is an open architectural question the documents do not engage.
 4. **ECS line-count projections** are aspirational and should be marked as estimates.
-5. **Composite key tradeoffs** deserve more nuance than "branded IDs fix everything." _(Resolved by PR 12617: `WidgetId` keeps the composite as a branded string.)_
+5. **Composite key tradeoffs** deserve more nuance than "branded IDs fix everything."
 
 ### What the Documents Do Well
 

docs/architecture/appendix-ecs-pattern-survey.md

@@ -1,24 +1,20 @@
 # Appendix: ECS Pattern Survey
 
-> **Superseded (PR 12617).** The single `src/world/` substrate this appendix
-> analyzes was removed; the project adopted dedicated Pinia stores
-> (`widgetValueStore`, `domWidgetStore`, `layoutStore`, `nodeOutputStore`,
-> `subgraphNavigationStore`, `previewExposureStore`) keyed by string IDs. §1
-> (the external library survey) remains valid reference material and supports
-> the dedicated-store direction — its first unanimous finding, that components
-> live with the code that owns them, is exactly what per-domain stores do. §2–§4
-> describe the deleted `src/world/` substrate (`world.ts`, `entityIds.ts`,
-> `widgetComponents.ts`, `WidgetEntityId`) and are retained for historical
-> rationale only; read their references to "the World" as "the relevant
-> dedicated store."
-
 _A survey of mainstream Entity Component System libraries — bitECS, miniplex,
-koota, ECSY, Thyseus, and Bevy. This appendix records which structural patterns
-the surveyed libraries share, which the project departs from, and where the
-trade-offs carry weight. Thyseus is called out specifically because it is the
-most Bevy-shaped of the TypeScript ECSs surveyed — its `Commands` parameter is
-the closest external analog to the command layer ADR 0003 / ADR 0008 converge
-on, so it gets dedicated treatment in §2.5 and §3.5._
+koota, ECSY, Thyseus, and Bevy — captured during the world-consolidation
+analysis that shipped slice 1 of
+[ADR 0008](../adr/0008-entity-component-system.md). This appendix records
+which structural patterns our `src/world/` substrate adopts, which it
+deliberately departs from, and where the trade-offs are load-bearing rather
+than incidental. Thyseus is called out specifically because it is the most
+Bevy-shaped of the TypeScript ECSs surveyed — its `Commands` parameter is the
+closest external analog to the command layer ADR 0003 / ADR 0008 are
+converging on, so it gets dedicated treatment in §2.5 and §3.5._
+
+The in-code anchors for the load-bearing constraints discussed below are the
+doc-comments in [src/world/world.ts](../../src/world/world.ts) (storage
+strategy) and [src/world/entityIds.ts](../../src/world/entityIds.ts) (identity
+contract) — see §3 below.
 
 ---
 
@@ -53,9 +49,9 @@ Two structural patterns are unanimous across the surveyed libraries:
    because it commits to a full system-execution runtime, not just
    storage.
 
-The dedicated-store end state — each store a small, focused module keyed by a
-string ID — sits squarely in this band: a small surface per store, with
-component shapes defined next to the store that owns them.
+Our slice-1 end state — five source files under
+[src/world/](../../src/world/), ~14 exported names total — sits squarely in
+this band.
 
 ---
 
@@ -145,11 +141,12 @@ export function spawnEntities(commands: Commands) {
 ```
 
 `commands.spawn()`, `.add(component)`, and `.remove(component)` enqueue
-deferred mutations against a command buffer; the substrate applies them at
+deferred mutations against a command buffer; the World applies them at
 defined sync points in the schedule. This is the same shape Bevy uses
-and is the closest direct external analog to the per-store mutation layer
-[ADR 0003](../adr/0003-crdt-based-layout-system.md) describes for this
-codebase (realized as store mutation APIs such as `useLayoutMutations()`).
+and is the closest direct external analog to the mutation layer
+[ADR 0003](../adr/0003-crdt-based-layout-system.md) and the
+[World API and Command Layer](./ecs-world-command-api.md) describe for
+this codebase.
 
 We deliberately match the **shape** of this pattern: external callers
 submit commands; only the executor calls the World's imperative
@@ -175,8 +172,8 @@ yet:
 
 The point of calling Thyseus out separately is that when ADR 0008 lands
 its command executor slice, "what does this look like in Thyseus?" is a
-comparison point worth taking seriously. Diverging from the
-Bevy/Thyseus shape there should require an explicit justification rather than
+load-bearing comparison point — not a curiosity. Diverging from the
+Bevy/Thyseus shape there should require an explicit justification, not
 silent drift.
 
 ---
@@ -184,7 +181,7 @@ silent drift.
 ## 3. Patterns We Explicitly Do NOT Adopt
 
 Each of the following is a real industry idiom we considered and rejected
-on structural grounds. None of these are pure performance trade-offs.
+on load-bearing grounds. None of these are pure performance trade-offs.
 
 ### 3.1 Replace-on-write usage idioms
 
@@ -218,8 +215,8 @@ SoA storage spreads each component's fields across parallel typed arrays,
 so the per-entity "row object" is reconstructed on read. **A future
 migration to SoA would lose the proxy on the row object** — and with it
 the shared-reactive-identity contract that `BaseWidget._state` and the
-`widgetValueStore` facade rely on. This constraint carries real weight
-beyond a perf optimization decision.
+`widgetValueStore` facade rely on. This is a load-bearing constraint, not
+just a perf optimization decision.
 
 The contract is pinned in the doc-comment at the top of
 [src/world/world.ts](../../src/world/world.ts) — copied here for
@@ -264,7 +261,7 @@ The contract is pinned in the doc-comment at the top of
  * Entity IDs are deterministic, content-addressed, and string-prefix
  * encoded — NOT opaque numeric IDs (cf. bitECS, koota, miniplex).
  *
- * `widgetEntityId(rootGraphId, nodeId, name)` carries real weight:
+ * `widgetEntityId(rootGraphId, nodeId, name)` is load-bearing:
  * consumers consistently pass `rootGraph.id` so widgets viewed at
  * different subgraph depths share identity. Migrating to numeric IDs
  * would break cross-subgraph value sharing. See ADR 0008 and

docs/architecture/ecs-lifecycle-scenarios.md

@@ -2,9 +2,7 @@
 
 This document walks through the major entity lifecycle operations — showing the current imperative implementation and how each transforms under the ECS architecture from [ADR 0008](../adr/0008-entity-component-system.md).
 
-ECS principles are realized across a set of dedicated Pinia stores keyed by string IDs (shipped in PR 12617): `widgetValueStore` (keyed by `WidgetId` = `graphId:nodeId:name`, see `src/types/widgetId.ts`), `layoutStore` (mutated via `useLayoutMutations()`), `nodeOutputStore`, `domWidgetStore`, `subgraphNavigationStore`, and `previewExposureStore`. Components live as plain-data entries in these stores; systems read and mutate them through store getters and command-style mutations.
-
-Each scenario follows the same structure: **Current Flow** (what happens today), **ECS Flow** (the store-backed target), and a **Key Differences** table.
+Each scenario follows the same structure: **Current Flow** (what happens today), **ECS Flow** (what it looks like with the World), and a **Key Differences** table.
 
 ## 1. Node Removal
 
@@ -65,43 +63,47 @@ Problems: the graph method manually disconnects every slot, cleans up reroutes,
 sequenceDiagram
     participant Caller
     participant CS as ConnectivitySystem
-    participant LM as useLayoutMutations()
-    participant LS as layoutStore
-    participant WVS as widgetValueStore
-    participant NOS as nodeOutputStore
-    participant DWS as domWidgetStore
+    participant W as World
+    participant VS as VersionSystem
 
-    Caller->>CS: removeNode(nodeId)
+    Caller->>CS: removeNode(world, nodeId)
 
-    CS->>LS: read node links (incoming + outgoing)
-    LS-->>CS: linkIds
+    CS->>W: getComponent(nodeId, Connectivity)
+    W-->>CS: { inputSlotIds, outputSlotIds }
 
-    loop each linkId
-        CS->>LM: deleteLink(linkId)
-        Note over LM,LS: removes link entry +<br/>updates both slot endpoints
+    loop each slotId
+        CS->>W: getComponent(slotId, SlotConnection)
+        W-->>CS: { linkIds }
+        loop each linkId
+            CS->>CS: removeLink(world, linkId)
+            Note over CS,W: removes Link entity + updates remote slots
+        end
+        CS->>W: deleteEntity(slotId)
     end
 
-    loop each widget on node
-        CS->>WVS: deleteWidget(widgetId)
-        CS->>DWS: unregisterWidget(widgetId)
+    CS->>W: getComponent(nodeId, WidgetContainer)
+    W-->>CS: { widgetIds }
+    loop each widgetId
+        CS->>W: deleteEntity(widgetId)
     end
 
-    CS->>NOS: removeNodeOutputs(nodeId)
-    CS->>LM: deleteNode(nodeId)
-    Note over CS,LS: coordinated cleanup across stores —<br/>each store drops its entry for the node
+    CS->>W: deleteEntity(nodeId)
+    Note over W: removes Position, NodeVisual, NodeType,<br/>Connectivity, Execution, Properties,<br/>WidgetContainer — all at once
+
+    CS->>VS: markChanged()
 ```
 
 ### Key Differences
 
-| Aspect              | Current                                          | ECS                                                                                             |
-| ------------------- | ------------------------------------------------ | ----------------------------------------------------------------------------------------------- |
-| Lines of code       | ~107 in one method                               | ~30 in system function                                                                          |
-| Entity types known  | Graph knows about all 6+ types                   | ConnectivitySystem coordinates layoutStore + widget/output stores                               |
-| Cleanup             | Manual per-slot, per-link, per-reroute           | `deleteLink()`/`deleteNode()` mutations per layout entry                                        |
-| Canvas notification | `setDirtyCanvas()` called explicitly             | Vue reactivity: components re-render when store entries change                                  |
-| Store cleanup       | WidgetValueStore/LayoutStore NOT cleaned up      | Coordinated: `deleteWidget`, `deleteLink`/`deleteNode`, `removeNodeOutputs`, `unregisterWidget` |
-| Undo/redo           | `beforeChange()`/`afterChange()` manually placed | Layout mutations are command records, replayable and undoable                                   |
-| Testability         | Needs full LGraph + LGraphCanvas                 | Needs only the relevant stores + ConnectivitySystem                                             |
+| Aspect              | Current                                          | ECS                                                    |
+| ------------------- | ------------------------------------------------ | ------------------------------------------------------ |
+| Lines of code       | ~107 in one method                               | ~30 in system function                                 |
+| Entity types known  | Graph knows about all 6+ types                   | ConnectivitySystem knows Connectivity + SlotConnection |
+| Cleanup             | Manual per-slot, per-link, per-reroute           | `deleteEntity()` removes all components atomically     |
+| Canvas notification | `setDirtyCanvas()` called explicitly             | RenderSystem sees missing entity on next frame         |
+| Store cleanup       | WidgetValueStore/LayoutStore NOT cleaned up      | World deletion IS the cleanup                          |
+| Undo/redo           | `beforeChange()`/`afterChange()` manually placed | System snapshots affected components before deletion   |
+| Testability         | Needs full LGraph + LGraphCanvas                 | Needs only World + ConnectivitySystem                  |
 
 ## 2. Serialization
 
@@ -163,37 +165,41 @@ Problems: serialization logic lives in 6 different `serialize()` methods across
 sequenceDiagram
     participant Caller
     participant SS as SerializationSystem
-    participant LS as layoutStore
-    participant WVS as widgetValueStore
-    participant CLS as node class state
+    participant W as World
 
-    Caller->>SS: serialize(graphId)
+    Caller->>SS: serialize(world)
 
-    SS->>LS: read node layouts (position, size, z-index)
-    LS-->>SS: layout entries for graphId
+    SS->>W: queryAll(NodeType, Position, Properties, WidgetContainer, Connectivity)
+    W-->>SS: all node entities with their components
 
-    SS->>LS: read links + reroutes for graphId
-    LS-->>SS: link / reroute entries
+    SS->>W: queryAll(LinkEndpoints)
+    W-->>SS: all link entities
 
-    SS->>WVS: getWidget(widgetId) per node widget
-    WVS-->>SS: WidgetState values
+    SS->>W: queryAll(SlotIdentity, SlotConnection)
+    W-->>SS: all slot entities
 
-    SS->>CLS: read type / properties / flags
-    CLS-->>SS: per-node class data
+    SS->>W: queryAll(RerouteLinks, Position)
+    W-->>SS: all reroute entities
 
-    SS->>SS: assemble JSON from store entries + class state
+    SS->>W: queryAll(GroupMeta, GroupChildren, Position)
+    W-->>SS: all group entities
+
+    SS->>W: queryAll(SubgraphStructure, SubgraphMeta)
+    W-->>SS: all subgraph entities
+
+    SS->>SS: assemble JSON from component data
     SS-->>Caller: SerializedGraph
 ```
 
 ### Key Differences
 
-| Aspect                 | Current                                         | ECS                                                       |
-| ---------------------- | ----------------------------------------------- | --------------------------------------------------------- |
-| Serialization logic    | Spread across 6 classes (`serialize()` on each) | Single SerializationSystem reading the stores             |
-| Widget values          | Collected inline during `node.serialize()`      | `widgetValueStore.getWidget(widgetId)` read directly      |
-| Subgraph recursion     | `asSerialisable()` recursively calls itself     | Flat read — layout entries carry scope tags, no recursion |
-| Adding a new component | Modify the entity's `serialize()` method        | Read one more store in SerializationSystem                |
-| Testing                | Need full object graph to test serialization    | Seed the stores with test entries                         |
+| Aspect                 | Current                                         | ECS                                            |
+| ---------------------- | ----------------------------------------------- | ---------------------------------------------- |
+| Serialization logic    | Spread across 6 classes (`serialize()` on each) | Single SerializationSystem                     |
+| Widget values          | Collected inline during `node.serialize()`      | WidgetValue component queried directly         |
+| Subgraph recursion     | `asSerialisable()` recursively calls itself     | Flat query — SubgraphStructure has entity refs |
+| Adding a new component | Modify the entity's `serialize()` method        | Add component to query in SerializationSystem  |
+| Testing                | Need full object graph to test serialization    | Mock World with test components                |
 
 ## 3. Deserialization
 
@@ -268,48 +274,64 @@ Problems: two-phase creation is necessary because nodes need to reference each o
 sequenceDiagram
     participant Caller
     participant SS as SerializationSystem
-    participant LM as useLayoutMutations()
-    participant WVS as widgetValueStore
+    participant W as World
+    participant LS as LayoutSystem
     participant ES as ExecutionSystem
 
-    Caller->>SS: deserialize(graphId, data)
+    Caller->>SS: deserialize(world, data)
 
-    SS->>WVS: clearGraph(graphId)
-    Note over SS,WVS: drop stale widget entries for this graph
+    SS->>W: clear() [remove all entities]
 
-    Note over SS,LM: All entries created in one pass — no two-phase needed
+    Note over SS,W: All entities created in one pass — no two-phase needed
 
     loop each node in data
-        SS->>LM: createNode(nodeId, { position, size, ... })
+        SS->>W: createEntity(NodeEntityId)
+        SS->>W: setComponent(id, Position, {...})
+        SS->>W: setComponent(id, NodeType, {...})
+        SS->>W: setComponent(id, NodeVisual, {...})
+        SS->>W: setComponent(id, Properties, {...})
+        SS->>W: setComponent(id, Execution, {...})
     end
 
+    loop each slot in data
+        SS->>W: createEntity(SlotEntityId)
+        SS->>W: setComponent(id, SlotIdentity, {...})
+        SS->>W: setComponent(id, SlotConnection, {...})
+    end
+
+    Note over SS,W: Slots reference links by ID — no resolution needed yet
+
     loop each link in data
-        SS->>LM: createLink(linkId, source, target)
+        SS->>W: createEntity(LinkEntityId)
+        SS->>W: setComponent(id, LinkEndpoints, {...})
     end
 
-    Note over SS,LM: links reference node + slot IDs directly,<br/>no instance resolution needed
+    Note over SS,W: Connectivity assembled from slot/link components
 
     loop each widget in data
-        SS->>WVS: registerWidget(widgetId, { value, ... })
+        SS->>W: createEntity(WidgetEntityId)
+        SS->>W: setComponent(id, WidgetIdentity, {...})
+        SS->>W: setComponent(id, WidgetValue, {...})
     end
 
-    SS->>SS: create reroutes, groups via layout mutations;<br/>subgraph scopes tagged on entries
+    SS->>SS: create reroutes, groups, subgraphs similarly
 
-    Note over SS,ES: Systems read the populated stores
+    Note over SS,W: Systems react to populated World
 
-    SS->>ES: computeExecutionOrder(graphId)
+    SS->>LS: runLayout(world)
+    SS->>ES: computeExecutionOrder(world)
 ```
 
 ### Key Differences
 
 | Aspect             | Current                                                                    | ECS                                                          |
 | ------------------ | -------------------------------------------------------------------------- | ------------------------------------------------------------ |
-| Two-phase creation | Required (nodes must exist before link resolution)                         | Not needed — links reference string IDs, not instances       |
-| Widget restoration | Hidden inside `node.configure()` line ~900                                 | Explicit: `widgetValueStore.registerWidget(widgetId, state)` |
-| Store population   | Side effect of `widget.setNodeId()`                                        | Direct: writing the store entry is the population            |
-| Callback cascade   | `onConnectionsChange`, `onInputAdded`, `onConfigure` fire during configure | No callbacks — systems read the stores after deserialization |
-| Subgraph ordering  | Topological sort required                                                  | Flat write — scope tags on entries, no instance ordering     |
-| Error handling     | Failed node → placeholder with `has_errors=true`                           | Failed entry → skip; entries that loaded are still valid     |
+| Two-phase creation | Required (nodes must exist before link resolution)                         | Not needed — components reference IDs, not instances         |
+| Widget restoration | Hidden inside `node.configure()` line ~900                                 | Explicit: WidgetValue component written directly             |
+| Store population   | Side effect of `widget.setNodeId()`                                        | World IS the store — writing component IS population         |
+| Callback cascade   | `onConnectionsChange`, `onInputAdded`, `onConfigure` fire during configure | No callbacks — systems query World after deserialization     |
+| Subgraph ordering  | Topological sort required                                                  | Flat write — SubgraphStructure just holds entity IDs         |
+| Error handling     | Failed node → placeholder with `has_errors=true`                           | Failed entity → skip; components that loaded are still valid |
 
 ## 4. Pack Subgraph
 
@@ -372,50 +394,50 @@ Problems: 200+ lines in one method. Manual boundary link analysis. Clone-seriali
 sequenceDiagram
     participant Caller
     participant CS as ConnectivitySystem
-    participant LS as layoutStore
-    participant LM as useLayoutMutations()
-    participant SNS as subgraphNavigationStore
+    participant W as World
 
-    Caller->>CS: packSubgraph(selectedNodeIds)
+    Caller->>CS: packSubgraph(world, selectedEntityIds)
 
-    CS->>LS: read links for selected nodes
+    CS->>W: query Connectivity + SlotConnection for selected nodes
     CS->>CS: classify links as internal vs boundary
 
-    CS->>SNS: register new subgraph graphId
+    CS->>W: create new GraphId scope in scopes registry
 
-    Note over CS,LM: Create SubgraphNode layout entry in parent graph
+    Note over CS,W: Create SubgraphNode entity in parent scope
 
-    CS->>LM: createNode(subgraphNodeId, { position: center of selection })
-    CS->>CS: record SubgraphNode interface (boundary slots)
+    CS->>W: createEntity(NodeEntityId) [the SubgraphNode]
+    CS->>W: setComponent(nodeId, Position, { center of selection })
+    CS->>W: setComponent(nodeId, SubgraphStructure, { graphId, interface })
+    CS->>W: setComponent(nodeId, SubgraphMeta, { name: 'New Subgraph' })
 
-    Note over CS,LS: Re-tag selected entries into new graph scope
+    Note over CS,W: Re-parent selected entities into new graph scope
 
-    loop each selected node + link
-        CS->>LS: set graphId scope tag to new subgraph graphId
+    loop each selected entity
+        CS->>W: update graphScope to new graphId
     end
 
-    Note over CS,LM: Reconnect boundary links to SubgraphNode slots
+    Note over CS,W: Create boundary slots on SubgraphNode
 
     loop each boundary input link
-        CS->>LM: deleteLink(oldLinkId)
-        CS->>LM: createLink(newLinkId, source, subgraphNode input slot)
+        CS->>W: create SlotEntity on SubgraphNode
+        CS->>W: update LinkEndpoints to target new slot
     end
 
     loop each boundary output link
-        CS->>LM: deleteLink(oldLinkId)
-        CS->>LM: createLink(newLinkId, subgraphNode output slot, target)
+        CS->>W: create SlotEntity on SubgraphNode
+        CS->>W: update LinkEndpoints to source from new slot
     end
 ```
 
 ### Key Differences
 
-| Aspect                     | Current                                           | ECS                                                          |
-| -------------------------- | ------------------------------------------------- | ------------------------------------------------------------ |
-| Entity movement            | Clone → serialize → configure → remove originals  | Re-tag entries: change graphId scope tag on store entries    |
-| Boundary links             | Disconnect → remove → recreate → reconnect        | `deleteLink`/`createLink` against the new SubgraphNode slots |
-| Intermediate inconsistency | Graph is partially disconnected during operation  | Mutations batch together as one command sequence             |
-| Code size                  | 200+ lines                                        | ~50 lines in system                                          |
-| Undo                       | `beforeChange()`/`afterChange()` wraps everything | Layout mutation commands replay and undo as a batch          |
+| Aspect                     | Current                                           | ECS                                                     |
+| -------------------------- | ------------------------------------------------- | ------------------------------------------------------- |
+| Entity movement            | Clone → serialize → configure → remove originals  | Re-parent entities: update graphScope to new GraphId    |
+| Boundary links             | Disconnect → remove → recreate → reconnect        | Update LinkEndpoints to point at new SubgraphNode slots |
+| Intermediate inconsistency | Graph is partially disconnected during operation  | Atomic: all component writes happen together            |
+| Code size                  | 200+ lines                                        | ~50 lines in system                                     |
+| Undo                       | `beforeChange()`/`afterChange()` wraps everything | Snapshot affected components before mutation            |
 
 ## 5. Unpack Subgraph
 
@@ -474,49 +496,48 @@ Problems: ID remapping is complex and error-prone. Magic IDs (SUBGRAPH_INPUT_ID
 sequenceDiagram
     participant Caller
     participant CS as ConnectivitySystem
-    participant LS as layoutStore
-    participant LM as useLayoutMutations()
-    participant SNS as subgraphNavigationStore
+    participant W as World
 
-    Caller->>CS: unpackSubgraph(subgraphNodeId)
+    Caller->>CS: unpackSubgraph(world, subgraphNodeId)
 
-    CS->>CS: read SubgraphNode interface (boundary slots)
+    CS->>W: getComponent(subgraphNodeId, SubgraphStructure)
+    W-->>CS: { graphId, interface }
 
-    CS->>LS: query entries where graphId scope = subgraph graphId
-    LS-->>CS: child entries (nodes, links, reroutes)
+    CS->>W: query entities where graphScope = graphId
+    W-->>CS: all child entities (nodes, links, reroutes, etc.)
 
-    Note over CS,LS: Re-tag entries to containing graph scope
+    Note over CS,W: Re-parent entities to containing graph scope
 
-    loop each child entry
-        CS->>LS: set graphId scope tag to parent scope
+    loop each child entity
+        CS->>W: update graphScope to parent scope
     end
 
-    Note over CS,LM: Reconnect boundary links
+    Note over CS,W: Reconnect boundary links
 
     loop each boundary slot in interface
-        CS->>LM: deleteLink(boundaryLinkId)
-        CS->>LM: createLink(newLinkId, external slot → internal node slot)
+        CS->>W: getComponent(slotId, SlotConnection)
+        CS->>W: update LinkEndpoints: SubgraphNode slot → internal node slot
     end
 
-    CS->>LM: deleteNode(subgraphNodeId)
-    CS->>SNS: drop subgraph graphId
+    CS->>W: deleteEntity(subgraphNodeId)
+    CS->>W: remove graphId from scopes registry
 
-    Note over CS,LM: Offset positions
+    Note over CS,W: Offset positions
 
-    loop each moved node
-        CS->>LM: moveNode(nodeId, position + offset)
+    loop each moved entity
+        CS->>W: update Position component
     end
 ```
 
 ### Key Differences
 
-| Aspect            | Current                                             | ECS                                                               |
-| ----------------- | --------------------------------------------------- | ----------------------------------------------------------------- |
-| ID remapping      | `nodeIdMap[oldId] = newId` for every node and link  | No remapping — entries keep their IDs, only the scope tag changes |
-| Magic IDs         | SUBGRAPH_INPUT_ID = -10, SUBGRAPH_OUTPUT_ID = -20   | No magic IDs — boundary modeled as SubgraphNode interface slots   |
-| Clone vs move     | Clone nodes, assign new IDs, configure from scratch | Re-tag store entries between scopes                               |
-| Link reconnection | Remap origin_id/target_id, create new LLink objects | `deleteLink`/`createLink` against the resolved endpoints          |
-| Complexity        | ~200 lines with deduplication and reroute remapping | ~40 lines, no remapping needed                                    |
+| Aspect            | Current                                             | ECS                                                             |
+| ----------------- | --------------------------------------------------- | --------------------------------------------------------------- |
+| ID remapping      | `nodeIdMap[oldId] = newId` for every node and link  | No remapping — entities keep their IDs, only graphScope changes |
+| Magic IDs         | SUBGRAPH_INPUT_ID = -10, SUBGRAPH_OUTPUT_ID = -20   | No magic IDs — boundary modeled as slot entities                |
+| Clone vs move     | Clone nodes, assign new IDs, configure from scratch | Move entity references between scopes                           |
+| Link reconnection | Remap origin_id/target_id, create new LLink objects | Update LinkEndpoints component in place                         |
+| Complexity        | ~200 lines with deduplication and reroute remapping | ~40 lines, no remapping needed                                  |
 
 ## 6. Connect Slots
 
@@ -570,28 +591,33 @@ Problems: the source node orchestrates everything — it reaches into the graph'
 sequenceDiagram
     participant Caller
     participant CS as ConnectivitySystem
-    participant LS as layoutStore
-    participant LM as useLayoutMutations()
+    participant W as World
+    participant VS as VersionSystem
 
-    Caller->>CS: connect(outputSlot, inputSlot)
+    Caller->>CS: connect(world, outputSlotId, inputSlotId)
 
-    CS->>LS: read input slot link
+    CS->>W: getComponent(inputSlotId, SlotConnection)
     opt already connected
-        CS->>LM: deleteLink(existingLinkId)
+        CS->>CS: removeLink(world, existingLinkId)
     end
 
-    CS->>LM: createLink(linkId, {<br/>  originNodeId, originSlotIndex,<br/>  targetNodeId, targetSlotIndex, type<br/>})
-    Note over LM,LS: createLink updates both slot endpoints<br/>and emits a command record
+    CS->>W: createEntity(LinkEntityId)
+    CS->>W: setComponent(linkId, LinkEndpoints, {<br/>  originNodeId, originSlotIndex,<br/>  targetNodeId, targetSlotIndex, type<br/>})
+
+    CS->>W: update SlotConnection on outputSlotId (add linkId)
+    CS->>W: update SlotConnection on inputSlotId (set linkId)
+
+    CS->>VS: markChanged()
 ```
 
 ### Key Differences
 
 | Aspect           | Current                                                      | ECS                                                           |
 | ---------------- | ------------------------------------------------------------ | ------------------------------------------------------------- |
-| Orchestrator     | Source node (reaches into graph, target, reroutes)           | ConnectivitySystem (reads layoutStore)                        |
-| Side effects     | `_version++`, `setDirtyCanvas()`, `afterChange()`, callbacks | `createLink()` command — endpoints + change tracking included |
-| Reroute handling | Manual: iterate chain, add linkId to each                    | Reroute entries updated via layout mutations                  |
-| Slot mutation    | Direct: `output.links.push()`, `input.link = id`             | `createLink(linkId, ...)` updates both endpoints              |
+| Orchestrator     | Source node (reaches into graph, target, reroutes)           | ConnectivitySystem (queries World)                            |
+| Side effects     | `_version++`, `setDirtyCanvas()`, `afterChange()`, callbacks | `markChanged()` — one call                                    |
+| Reroute handling | Manual: iterate chain, add linkId to each                    | RerouteLinks component updated by system                      |
+| Slot mutation    | Direct: `output.links.push()`, `input.link = id`             | Component update: `setComponent(slotId, SlotConnection, ...)` |
 | Validation       | `onConnectInput`/`onConnectOutput` callbacks on nodes        | Validation system or guard function                           |
 
 ## 7. Copy / Paste
@@ -662,61 +688,57 @@ parent IDs all remapped independently. ~300 lines across multiple methods.
 sequenceDiagram
     participant User
     participant CS as ClipboardSystem
-    participant LS as layoutStore
-    participant WVS as widgetValueStore
-    participant LM as useLayoutMutations()
+    participant W as World
     participant CB as Clipboard
 
     rect rgb(40, 40, 60)
         Note over User,CB: Copy
-        User->>CS: copy(selectedNodeIds)
-        CS->>LS: snapshot layout entries (nodes, links, reroutes)
-        CS->>WVS: snapshot WidgetState for each widgetId
-        CS->>CB: store cross-store snapshot
+        User->>CS: copy(world, selectedEntityIds)
+        CS->>W: snapshot all components for selected entities
+        CS->>W: snapshot components for child entities (slots, widgets)
+        CS->>W: snapshot connected links (LinkEndpoints)
+        CS->>CB: store component snapshot
     end
 
     rect rgb(40, 60, 40)
         Note over User,CB: Paste
-        User->>CS: paste(position)
+        User->>CS: paste(world, position)
         CS->>CB: retrieve snapshot
 
-        CS->>CS: build ID remap table (old → new nodeId / WidgetId)
+        CS->>CS: generate ID remap table (old → new branded IDs)
 
-        loop each node in snapshot
-            CS->>LM: createNode(newNodeId, remapped layout)
-        end
-        loop each link in snapshot
-            CS->>LM: createLink(newLinkId, remapped endpoints)
-            Note over CS,LM: node + slot refs remapped via table
-        end
-        loop each widget in snapshot
-            CS->>WVS: registerWidget(newWidgetId, WidgetState)
+        loop each entity in snapshot
+            CS->>W: createEntity(newId)
+            loop each component
+                CS->>W: setComponent(newId, type, remappedData)
+                Note over CS,W: entity ID refs in component data<br/>are remapped via table
+            end
         end
 
-        CS->>LM: batchMoveNodes(offset all to cursor)
+        CS->>CS: offset all Position components to cursor
     end
 ```
 
 ### Key Differences
 
-| Aspect               | Current                                                            | ECS                                                           |
-| -------------------- | ------------------------------------------------------------------ | ------------------------------------------------------------- |
-| Copy format          | Clone → serialize → JSON (format depends on class)                 | Store-entry snapshot (uniform shape across stores)            |
-| ID remapping         | Separate logic per entity type (nodes, reroutes, subgraphs, links) | One remap table applied to string keys (`nodeId`, `WidgetId`) |
-| Paste reconstruction | `createNode()` → `add()` → `configure()` → `connect()` per node    | `createNode`/`createLink`/`registerWidget` per entry (flat)   |
-| Subgraph handling    | Recursive clone + UUID remap + deduplication                       | Snapshot carries scope tags; remap rewrites graphId keys      |
-| Code complexity      | ~300 lines across 4 methods                                        | ~60 lines in one system                                       |
+| Aspect               | Current                                                            | ECS                                                                |
+| -------------------- | ------------------------------------------------------------------ | ------------------------------------------------------------------ |
+| Copy format          | Clone → serialize → JSON (format depends on class)                 | Component snapshot (uniform format for all entities)               |
+| ID remapping         | Separate logic per entity type (nodes, reroutes, subgraphs, links) | Single remap table applied to all entity ID refs in all components |
+| Paste reconstruction | `createNode()` → `add()` → `configure()` → `connect()` per node    | `createEntity()` → `setComponent()` per entity (flat)              |
+| Subgraph handling    | Recursive clone + UUID remap + deduplication                       | Snapshot includes SubgraphStructure component with entity refs     |
+| Code complexity      | ~300 lines across 4 methods                                        | ~60 lines in one system                                            |
 
 ## Summary: Cross-Cutting Benefits
 
-| Benefit                       | Scenarios Where It Applies                                                                           |
-| ----------------------------- | ---------------------------------------------------------------------------------------------------- |
-| **Batched operations**        | Node Removal, Pack/Unpack — mutations apply together as one command sequence                         |
-| **No scattered `_version++`** | All scenarios — layout mutation commands carry change tracking                                       |
-| **No callback cascades**      | Deserialization, Connect — systems read the stores instead of firing callbacks                       |
-| **Uniform ID handling**       | Copy/Paste, Unpack — one remap table over string keys instead of per-type logic                      |
-| **Coordinated cleanup**       | Node Removal — `deleteWidget` + `deleteLink`/`deleteNode` + `removeNodeOutputs` + `unregisterWidget` |
-| **No two-phase creation**     | Deserialization — store entries reference string IDs, not instances                                  |
-| **Move instead of clone**     | Pack/Unpack — entries keep their IDs, only the scope tag changes                                     |
-| **Testable in isolation**     | All scenarios — seed the relevant stores, test one system                                            |
-| **Undo/redo for free**        | All scenarios — layout mutation commands replay and undo                                             |
+| Benefit                       | Scenarios Where It Applies                                                 |
+| ----------------------------- | -------------------------------------------------------------------------- |
+| **Atomic operations**         | Node Removal, Pack/Unpack — no intermediate inconsistent state             |
+| **No scattered `_version++`** | All scenarios — VersionSystem handles change tracking                      |
+| **No callback cascades**      | Deserialization, Connect — systems query World instead of firing callbacks |
+| **Uniform ID handling**       | Copy/Paste, Unpack — one remap table instead of per-type logic             |
+| **Entity deletion = cleanup** | Node Removal — `deleteEntity()` removes all components                     |
+| **No two-phase creation**     | Deserialization — components reference IDs, not instances                  |
+| **Move instead of clone**     | Pack/Unpack — entities keep their IDs, just change scope                   |
+| **Testable in isolation**     | All scenarios — mock World, test one system                                |
+| **Undo/redo for free**        | All scenarios — snapshot components before mutation, restore on undo       |

docs/architecture/ecs-migration-plan.md

@@ -10,14 +10,6 @@ target architecture, see [ECS Target Architecture](ecs-target-architecture.md).
 For verified accuracy of these documents, see
 [Appendix: Critical Analysis](appendix-critical-analysis.md).
 
-> **Target end-state (revised):** N dedicated Pinia stores keyed by composite
-> string IDs, one store per concern (widget values, DOM widgets, layout, node
-> outputs, subgraph navigation, preview exposure). The earlier "single unified
-> World with branded numeric entity IDs and `getComponent`/`setComponent`" model
-> was rejected. PR 12617 shipped the first stores against composite
-> `graphId:nodeId:name` string keys (`WidgetId`). Phases below are reframed
-> around dedicated stores; shipped work is marked ✅.
-
 ## Planning assumptions
 
 - The bridge period is expected to span 2-3 release cycles.
@@ -31,16 +23,36 @@ For verified accuracy of these documents, see
 Zero behavioral risk. Prepares the codebase for extraction without changing
 runtime semantics. All items are independently shippable.
 
-### 0a. Centralize version counter ✅ Shipped
+### 0a. Centralize version counter
 
-`LGraph.incrementVersion()` exists and is used everywhere. The counter is only
-read for debug display in `LGraphCanvas.renderInfo()`; it is not used for
-dirty-checking, caching, or reactivity.
+`graph._version++` appears in 19 locations across 7 files. The counter is only
+read once — for debug display in `LGraphCanvas.renderInfo()` (line 5389). It
+is not used for dirty-checking, caching, or reactivity.
 
-**Remaining cleanup:** One stray direct `_version++` at `LGraph.ts:831` should
-be replaced with `incrementVersion()`.
+**Change:** Add `LGraph.incrementVersion()` and replace all 19 direct
+increments.
 
-**Risk:** None. Mechanical one-line change; existing null guards preserved.
+```
+incrementVersion(): void {
+  this._version++
+}
+```
+
+| File                   | Sites                                                   |
+| ---------------------- | ------------------------------------------------------- |
+| `LGraph.ts`            | 5 (lines 956, 989, 1042, 1109, 2643)                    |
+| `LGraphNode.ts`        | 8 (lines 833, 2989, 3138, 3176, 3304, 3539, 3550, 3567) |
+| `LGraphCanvas.ts`      | 2 (lines 3084, 7880)                                    |
+| `BaseWidget.ts`        | 1 (line 439)                                            |
+| `SubgraphInput.ts`     | 1 (line 137)                                            |
+| `SubgraphInputNode.ts` | 1 (line 190)                                            |
+| `SubgraphOutput.ts`    | 1 (line 102)                                            |
+
+**Why first:** Creates the seam where a VersionSystem can later intercept,
+batch, or replace the mechanism. Mechanical find-and-replace with zero
+behavioral change.
+
+**Risk:** None. Existing null guards at call sites are preserved.
 
 ### 0b. Add missing ID type aliases
 
@@ -67,198 +79,246 @@ Five factual errors verified during code review (see
 - `entity-problems.md`: `toJSON()` should be `toString()`, `execute()` should
   be `doExecute()`, method count ~539 should be ~848, `configure()` is ~240
   lines not ~180
+- `proto-ecs-stores.md`: `resolveDeepest()` does not exist on
+  PromotedWidgetViewManager; actual methods are `reconcile()` / `getOrCreate()`
 
 ---
 
-## Phase 1: Types and Dedicated Stores
+## Phase 1: Types and World Shell
 
-Introduces the ID type vocabulary and the dedicated stores. Phase 1 end-state is
-N dedicated Pinia stores, each keyed by a composite string ID, coexisting with
-legacy class instances.
+Introduces the ECS type vocabulary and an empty World. No migration of existing
+code — new types coexist with old ones.
 
-### 1a. Branded string ID types ✅ Shipped (PR 12617)
+### 1a. Branded entity ID types
 
-`src/types/widgetId.ts` ships the branded string `WidgetId`:
+Define branded types in a new `src/ecs/entityId.ts`:
 
-```ts
-type WidgetId = string & { readonly __brand: 'WidgetId' }
+```
+type NodeEntityId = number & { readonly __brand: 'NodeEntityId' }
+type LinkEntityId = number & { readonly __brand: 'LinkEntityId' }
+type WidgetEntityId = number & { readonly __brand: 'WidgetEntityId' }
+type SlotEntityId = number & { readonly __brand: 'SlotEntityId' }
+type RerouteEntityId = number & { readonly __brand: 'RerouteEntityId' }
+type GroupEntityId = number & { readonly __brand: 'GroupEntityId' }
+type GraphId = string & { readonly __brand: 'GraphId' }  // scope, not entity
 ```
 
-Format: `graphId:nodeId:name`. A `parseWidgetId()` helper splits a `WidgetId`
-back into its `{ graphId, nodeId, name }` parts at store boundaries.
+Add cast helpers (`asNodeEntityId(id: number): NodeEntityId`) for use at
+system boundaries (deserialization, legacy bridge).
 
-The composite string key carries the structural relationship (graph -> node ->
-widget) directly in the key. There is no synthetic opaque number and no reverse
-lookup index.
+**Does NOT change existing code.** The branded types are new exports consumed
+only by new ECS code.
 
-**Consideration:** `NodeId = number | string`. The `string` branch exists for
-subgraph-related nodes (GroupNode hack). The `WidgetId` format stringifies the
-`nodeId` segment, so both numeric and string node IDs flow through unchanged.
+**Risk:** Low. New files, no modifications to existing code.
 
-### 1b. Plain-data store state shapes
+**Consideration:** `NodeId = number | string` is the current type. The branded
+`NodeEntityId` narrows to `number`. The `string` branch exists solely for
+subgraph-related nodes (GroupNode hack). The migration must decide whether to:
 
-Each dedicated store holds plain-data records for its concern — no methods on the
-records, behavior lives in store actions and composables. State shapes mirror the
-decomposition in ADR 0008 Section "Component Decomposition" (position, node type,
-node visual, connectivity, execution, properties, widget container, link
-endpoints).
+- Keep `NodeEntityId = number` and handle the string case at the bridge layer
+- Or define `NodeEntityId = number | string` with branding (less safe)
 
-**Risk:** None. Type-only definitions.
+Recommend the former: the bridge layer coerces string IDs to a numeric
+mapping, and only branded numeric IDs enter the World.
 
-### 1c. Dedicated stores
+### 1b. Component interfaces
 
-Phase 1 end-state is a set of dedicated Pinia stores, one per concern, each
-keyed by its own composite string ID. Each store owns its data and exposes a
-narrow accessor surface. There is no single container that fronts all entities.
+Define component interfaces in `src/ecs/components/`:
 
-Shipped stores:
+```
+src/ecs/
+  entityId.ts          # Branded ID types
+  components/
+    position.ts        # Position (shared by Node, Reroute, Group)
+    nodeType.ts        # NodeType
+    nodeVisual.ts      # NodeVisual
+    connectivity.ts    # Connectivity
+    execution.ts       # Execution
+    properties.ts      # Properties
+    widgetContainer.ts # WidgetContainer
+    linkEndpoints.ts   # LinkEndpoints
+    ...
+  world.ts             # World type and factory
+```
 
-| Store                     | File                                            |
-| ------------------------- | ----------------------------------------------- |
-| `widgetValueStore`        | `src/stores/widgetValueStore.ts`                |
-| `domWidgetStore`          | `src/stores/domWidgetStore.ts`                  |
-| `layoutStore`             | `src/renderer/core/layout/store/layoutStore.ts` |
-| `nodeOutputStore`         | `src/stores/nodeOutputStore.ts`                 |
-| `subgraphNavigationStore` | `src/stores/subgraphNavigationStore.ts`         |
-| `previewExposureStore`    | `src/stores/previewExposureStore.ts`            |
+Components are TypeScript interfaces only — no runtime code. They mirror
+the decomposition in ADR 0008 Section "Component Decomposition."
 
-`widgetValueStore` exposes `registerWidget`, `getWidget`, `setValue`,
-`deleteWidget`, `getNodeWidgets`, and `clearGraph`, all `WidgetId`-native. There
-is no shared `lastWidgetId` counter; identity comes from the composite key.
+**Risk:** None. Interface-only files.
 
-Store scope is per workflow instance. Linked subgraph definitions can be reused
+### 1c. World type
+
+Define the World as a typed container:
+
+```ts
+interface World {
+  nodes: Map<NodeEntityId, NodeComponents>
+  links: Map<LinkEntityId, LinkComponents>
+  widgets: Map<WidgetEntityId, WidgetComponents>
+  slots: Map<SlotEntityId, SlotComponents>
+  reroutes: Map<RerouteEntityId, RerouteComponents>
+  groups: Map<GroupEntityId, GroupComponents>
+  scopes: Map<GraphId, GraphId | null> // graph scope DAG (parent or null for root)
+
+  createEntity<K extends EntityKind>(kind: K): EntityIdFor<K>
+  deleteEntity<K extends EntityKind>(kind: K, id: EntityIdFor<K>): void
+  getComponent<C>(id: EntityId, component: ComponentKey<C>): C | undefined
+  setComponent<C>(id: EntityId, component: ComponentKey<C>, data: C): void
+}
+```
+
+Subgraphs are not a separate entity kind. A node with a `SubgraphStructure`
+component represents a subgraph. The `scopes` map tracks the graph nesting DAG.
+See [Subgraph Boundaries](subgraph-boundaries-and-promotion.md) for the full
+model.
+
+World scope is per workflow instance. Linked subgraph definitions can be reused
 across instances, but mutable runtime state (widget values, execution state,
-selection/transient view state) stays instance-scoped through `graphId` embedded
-in each composite key.
+selection/transient view state) remains instance-scoped through `graphId`.
 
-Subgraphs are not a separate store. Subgraph nesting is tracked in
-`subgraphNavigationStore`. See
-[Subgraph Boundaries](subgraph-boundaries-and-promotion.md) for the full model.
+Initial implementation: plain `Map`-backed. No reactivity, no CRDT, no
+persistence. The World exists but nothing populates it yet.
 
-**Risk:** Low. Stores are additive; integration happens in Phase 2.
+**Risk:** Low. New code, no integration points.
 
 ---
 
-## Phase 2: Store Integration
+## Phase 2: Bridge Layer
 
-Connects the legacy class instances to the dedicated stores. Both old and new
-code can read entity state; writes for not-yet-migrated concerns still go through
-legacy classes.
+Connects the legacy class instances to the World. Both old and new code can
+read entity state; writes still go through legacy classes.
 
-### 2a. Position reads through layoutStore
+### 2a. Read-only bridge for Position
 
-`layoutStore` (`src/renderer/core/layout/store/layoutStore.ts`) already extracts
-position data for nodes, links, and reroutes into Y.js CRDTs and is the source of
-truth for layout.
+The LayoutStore (`src/renderer/core/layout/store/layoutStore.ts`) already
+extracts position data for nodes, links, and reroutes into Y.js CRDTs. The
+bridge reads from LayoutStore and populates the World's `Position` component.
 
-**Approach:** New code reads position via `layoutStore` queries (and
-`useLayoutMutations()` for writes); legacy code continues to read `node.pos`
-directly during the transition. No second copy of position data is introduced —
-`layoutStore` stays authoritative.
+**Approach:** A `PositionBridge` that observes LayoutStore changes and mirrors
+them into the World. New code reads `world.getComponent(nodeId, Position)`;
+legacy code continues to read `node.pos` / LayoutStore directly.
 
-**Risk:** Medium. The legacy `node.pos` read path must stay consistent with
-`layoutStore` during the transition. Watch for stale reads during render.
+**Open question:** Should the World wrap the Y.js maps or maintain its own
+plain-data copy? Options:
 
-### 2b. Consolidate widget callers onto widgetValueStore ✅ Largely shipped (PR 12617)
+| Approach               | Pros                                  | Cons                                            |
+| ---------------------- | ------------------------------------- | ----------------------------------------------- |
+| World wraps Y.js       | Single source of truth; no sync lag   | World API becomes CRDT-aware; harder to test    |
+| World copies from Y.js | Clean World API; easy to test         | Two copies of position data; sync overhead      |
+| World replaces Y.js    | Pure ECS; no CRDT dependency in World | Breaks collaboration (ADR 0003); massive change |
 
-`widgetValueStore` (`src/stores/widgetValueStore.ts`) holds widget state in
-plain records keyed by `WidgetId` (`graphId:nodeId:name`) and is the source of
-truth for widget values. PR 12617 reverted the earlier synthetic-numeric-ID
-bridge approach.
+**Recommendation:** Start with "World copies from Y.js" for simplicity. The
+copy is cheap (position is small data). Revisit if sync overhead becomes
+measurable.
 
-**Remaining work:** Consolidate the remaining widget callers onto
-`widgetValueStore`. Reads use `getWidget(widgetId)` / `getNodeWidgets(graphId,
-nodeId)`; writes use `setValue(widgetId, value)`; `parseWidgetId()` recovers the
-`{ graphId, nodeId, name }` parts at boundaries.
+**Risk:** Medium. Introduces a sync point between two state systems. Must
+ensure the bridge doesn't create subtle ordering bugs (e.g., World reads stale
+position during render).
 
-**Risk:** Low. The store is well-structured and `WidgetId`-native; identity comes
-from the composite key with no separate lookup index.
+### 2b. Read-only bridge for WidgetValue
+
+WidgetValueStore (`src/stores/widgetValueStore.ts`) already extracts widget
+state into plain `WidgetState` objects keyed by `graphId:nodeId:name`. This is
+the closest proto-ECS store.
+
+**Approach:** A `WidgetBridge` that maps `WidgetValueStore` entries into
+`WidgetValue` components in the World, keyed by `WidgetEntityId`. Requires
+assigning synthetic widget IDs (via `lastWidgetId` counter on LGraphState).
+
+**Dependency:** Requires 1a (branded IDs) for `WidgetEntityId`.
+
+**Risk:** Low-Medium. WidgetValueStore is well-structured. Main complexity is
+the ID mapping — widgets currently lack independent IDs, so the bridge must
+maintain a `(nodeId, widgetName) -> WidgetEntityId` lookup.
 
 **Promoted-widget caveat:** ADR 0009 assigns promoted value widgets a
 host-boundary identity (`host node locator + SubgraphInput.name`). Interior
 source node/widget identity is preserved only as migration and diagnostic
 metadata.
 
-### 2c. Node metadata stores
+### 2c. Read-only bridge for Node metadata
 
-Populate node-metadata records (node type, visual, properties, execution) by
-reading from `LGraphNode` instances. These are simple property copies into the
-relevant store.
+Populate `NodeType`, `NodeVisual`, `Properties`, `Execution` components by
+reading from `LGraphNode` instances. These are simple property copies.
 
-**Approach:** When a node is added to the graph (`LGraph.add()`), the store
-records its metadata. When a node is removed, the store drops it. The
-`incrementVersion()` seam from Phase 0a is a candidate hook point for re-sync
-when changed.
+**Approach:** When a node is added to the graph (`LGraph.add()`), the bridge
+creates the corresponding entity in the World and populates its components.
+When a node is removed, the bridge deletes the entity.
+
+The `incrementVersion()` method from Phase 0a becomes the hook point — when
+version increments, the bridge can re-sync changed components. (This is why
+centralizing version first matters.)
 
 **Risk:** Medium. Must handle the full node lifecycle (add, configure, remove)
-without breaking existing behavior. Stores mirror the classes during the
-transition, which limits blast radius.
+without breaking existing behavior. The bridge is read-only (World mirrors
+classes, not the reverse), which limits blast radius.
 
-### Store sunset criteria (applies to every Phase 2 concern)
+### Bridge sunset criteria (applies to every Phase 2 bridge)
 
-A legacy path can move from "transitional" to "removal candidate" only when:
+A bridge can move from "transitional" to "removal candidate" only when:
 
-- All production reads for that concern flow through store accessors.
-- All production writes for that concern flow through store actions.
-- Serialization parity tests show no diff between legacy and store-driven paths.
-- Extension compatibility tests pass without legacy-only fallback paths.
+- All production reads for that concern flow through World component queries.
+- All production writes for that concern flow through system APIs.
+- Serialization parity tests show no diff between legacy and World paths.
+- Extension compatibility tests pass without bridge-only fallback paths.
 
-These criteria prevent the dual path from becoming permanent by default.
+These criteria prevent the bridge from becoming permanent by default.
 
-### Dual-path duration and maintenance controls
+### Bridge duration and maintenance controls
 
 To contain dual-path maintenance cost during Phases 2-4:
 
-- Every concern has a named owner and target sunset release.
-- Every PR touching store-covered data paths must include parity tests for both
-  legacy and store-driven execution.
-- Legacy fallback usage is instrumented in integration/e2e and reviewed every
-  milestone; upward trends block new dual-path expansion.
-- Any concern that misses its target sunset release requires an explicit risk
+- Every bridge concern has a named owner and target sunset release.
+- Every PR touching bridge-covered data paths must include parity tests for both
+  legacy and World-driven execution.
+- Bridge fallback usage is instrumented in integration/e2e and reviewed every
+  milestone; upward trends block new bridge expansion.
+- Any bridge that misses its target sunset release requires an explicit risk
   review and revised removal plan.
 
 ---
 
 ## Phase 3: Systems
 
-Introduce system functions that operate on store data. Systems coexist with
+Introduce system functions that operate on World data. Systems coexist with
 legacy methods — they don't replace them yet.
 
 ### 3a. SerializationSystem (read-only)
 
-A function `serializeFromStores(): SerializedGraph` that produces workflow JSON
-by querying the dedicated stores. Run alongside the existing `LGraph.serialize()`
-in tests to verify equivalence.
+A function `serializeFromWorld(world: World): SerializedGraph` that produces
+workflow JSON by querying World components. Run alongside the existing
+`LGraph.serialize()` in tests to verify equivalence.
 
 **Why first:** Serialization is read-only and has a clear correctness check
-(output must match existing serialization). It exercises every store and proves
-the stores contain sufficient data.
+(output must match existing serialization). It exercises every component type
+and proves the World contains sufficient data.
 
 **Risk:** Low. Runs in parallel with existing code; does not replace it.
 
 ### 3b. VersionSystem
 
-Move change tracking behind a system that observes store mutations and
-auto-increments the version counter, replacing scattered explicit increment
-calls.
+Replace the `incrementVersion()` method with a system that owns all change
+tracking. The system observes component mutations on the World and
+auto-increments the version counter.
 
-**Dependency:** Requires Phase 2 store integration (otherwise the system doesn't
-see changes).
+**Dependency:** Requires Phase 2 bridges to be in place (otherwise the World
+doesn't see changes).
 
 **Risk:** Medium. Must not miss any change that the scattered `_version++`
-historically caught.
+currently catches. The 19-site inventory from Phase 0a serves as the test
+matrix.
 
 ### 3c. ConnectivitySystem (queries only)
 
-A system that answers connectivity queries by reading connectivity, slot, and
-link-endpoint records from the relevant stores:
+A system that can answer connectivity queries by reading `Connectivity`,
+`SlotConnection`, and `LinkEndpoints` components from the World:
 
 - "What nodes are connected to this node's inputs?"
 - "What links pass through this reroute?"
 - "What is the execution order?"
 
-Does not perform mutations yet — just queries. Validates that store connectivity
-data is complete and consistent with the class-based graph.
+Does not perform mutations yet — just queries. Validates that the World's
+connectivity data is complete and consistent with the class-based graph.
 
 **Risk:** Low. Read-only system with equivalence tests.
 
@@ -266,27 +326,27 @@ data is complete and consistent with the class-based graph.
 
 ## Phase 4: Write Path Migration
 
-Systems begin owning mutations. Legacy class methods delegate to stores and
-systems. This is the highest-risk phase.
+Systems begin owning mutations. Legacy class methods delegate to systems.
+This is the highest-risk phase.
 
-### 4a. Position writes through layoutStore
+### 4a. Position writes through World
 
-New code writes position via `useLayoutMutations()` against `layoutStore`. A
-compatibility shim propagates changes back to `LGraphNode.pos` for legacy
-readers.
+New code writes position via `world.setComponent(nodeId, Position, ...)`.
+The bridge propagates changes back to LayoutStore and `LGraphNode.pos`.
 
-**This inverts the data flow:** Phase 2 had legacy -> store (read path). Phase 4
-has store -> legacy (write path). Both must work during the transition.
+**This inverts the data flow:** Phase 2 had legacy -> World (read bridge).
+Phase 4 has World -> legacy (write bridge). Both paths must work during the
+transition.
 
-**Risk:** High. Two-way sync between `layoutStore` and legacy state. Must handle
-re-entrant updates (store write triggers the shim, which writes to legacy, which
-must NOT trigger another store write).
+**Risk:** High. Two-way sync between World and legacy state. Must handle
+re-entrant updates (World write triggers bridge, which writes to legacy,
+which must NOT trigger another World write).
 
 ### 4b. ConnectivitySystem mutations
 
 `connect()`, `disconnect()`, `removeNode()` operations implemented as system
-functions over the connectivity stores. Legacy `LGraphNode.connect()` etc.
-delegate to the system.
+functions on the World. Legacy `LGraphNode.connect()` etc. delegate to the
+system.
 
 **Extension API concern:** The current system fires callbacks at each step:
 
@@ -303,8 +363,8 @@ the system knowing about the callback API.
 
 **Phase 4 callback contract (locked):**
 
-- `onConnectOutput()` and `onConnectInput()` run before any store mutation.
-- If either callback rejects, abort with no store writes, no version bump,
+- `onConnectOutput()` and `onConnectInput()` run before any World mutation.
+- If either callback rejects, abort with no component writes, no version bump,
   and no lifecycle events.
 - `onConnectionsChange()` fires synchronously after commit, preserving current
   source-then-target ordering.
@@ -314,14 +374,14 @@ the system knowing about the callback API.
 **Risk:** High. Extensions depend on callback ordering and timing. Must be
 validated against real-world extensions.
 
-### 4c. Widget write path ✅ Largely shipped (PR 12617)
+### 4c. Widget write path
 
-`widgetValueStore.setValue()` is already the widget write path and the source of
-truth for widget values. Remaining work routes the last legacy widget writers
-through `setValue()` rather than mutating widget instances directly.
+Widget value changes go through the World instead of directly through
+WidgetValueStore. The World's `WidgetValue` component becomes the single
+source of truth; WidgetValueStore becomes a read-through cache or is removed.
 
-**Risk:** Medium. The store is well-abstracted and `WidgetId`-native. The main
-change is migrating the remaining direct-mutation call sites onto `setValue()`.
+**Risk:** Medium. WidgetValueStore is already well-abstracted. The main
+change is routing writes through the World instead of the store.
 
 ### 4d. Layout write path and render decoupling
 
@@ -347,25 +407,25 @@ Before enabling ECS render reads as default for any migrated family:
 - Compare legacy vs ECS p95 frame time and mean draw cost.
 - Block rollout on statistically significant regression beyond agreed budget
   (default budget: 5% p95 frame-time regression ceiling).
-- Capture profiler traces proving the dominant cost is not repeated store
-  accessor lookups.
+- Capture profiler traces proving the dominant cost is not repeated
+  `world.getComponent()` lookups.
 
 ### Phase 3 -> 4 gate (required)
 
 Phase 4 starts only when all of the following are true:
 
-- A store/command-executor transaction wrapper exists and is used by connectivity
-  and widget write paths in integration tests.
+- A transaction wrapper API exists on the World and is used by connectivity and
+  widget write paths in integration tests.
 - Undo batching parity is proven: one logical user action yields one undo
-  checkpoint in both legacy and store-driven paths.
+  checkpoint in both legacy and ECS paths.
 - Callback timing and rejection semantics from Phase 4b are covered by
   integration tests.
 - A representative extension suite passes, including `rgthree-comfy`.
-- Write-path re-entrancy tests prove there is no store <-> legacy feedback
+- Write bridge re-entrancy tests prove there is no World <-> legacy feedback
   loop.
 - Layout migration for any enabled node family passes read-only render checks
   (no `arrange()` writes during draw).
-- Render hot-path benchmark gate passes for every family moving to store-first
+- Render hot-path benchmark gate passes for every family moving to ECS-first
   reads.
 
 ---
@@ -375,11 +435,10 @@ Phase 4 starts only when all of the following are true:
 Remove bridge layers and deprecated class properties. This phase happens
 per-component, not all at once.
 
-### 5a. Remove Position compatibility shim
+### 5a. Remove Position bridge
 
-Once all position reads and writes go through `layoutStore`, remove the
-compatibility shim and the `pos`/`size` properties from `LGraphNode`, `Reroute`,
-`LGraphGroup`.
+Once all position reads and writes go through the World, remove the bridge
+and the `pos`/`size` properties from `LGraphNode`, `Reroute`, `LGraphGroup`.
 
 ### 5b. Remove widget class hierarchy
 
@@ -389,9 +448,9 @@ replaced with component data + system functions. `BaseWidget`, `NumberWidget`,
 
 ### 5c. Dissolve god objects
 
-`LGraphNode`, `LLink`, `LGraph` become thin shells — their only role is holding
-the composite ID and delegating to the stores. Eventually, they can be removed
-entirely, replaced by composite IDs + store queries.
+`LGraphNode`, `LLink`, `LGraph` become thin shells — their only role is
+holding the entity ID and delegating to the World. Eventually, they can be
+removed entirely, replaced by entity ID + component queries.
 
 **Risk:** Very High. This is the irreversible step. Must be done only after
 thorough validation that all consumers (including extensions) work with the
@@ -401,8 +460,8 @@ ECS path.
 
 Legacy removal starts only when all of the following are true:
 
-- The concern being removed has no remaining direct reads or writes outside
-  store/system APIs.
+- The component being removed has no remaining direct reads or writes outside
+  World/system APIs.
 - Serialization equivalence tests pass continuously for one release cycle.
 - A representative extension compatibility matrix is green, including
   `rgthree-comfy`.
@@ -430,20 +489,20 @@ The team prepares a single go/no-go packet containing:
 
 ### CRDT / ECS coexistence
 
-`layoutStore` uses Y.js CRDTs for collaboration-ready position data
-(per [ADR 0003](../adr/0003-crdt-based-layout-system.md)). The other dedicated
-stores hold plain reactive data. These must coexist.
+The LayoutStore uses Y.js CRDTs for collaboration-ready position data
+(per [ADR 0003](../adr/0003-crdt-based-layout-system.md)). The ECS World
+uses plain `Map`s. These must coexist.
 
-`layoutStore` stays authoritative for layout (Phase 2a), so position data has a
-single CRDT-backed home. Whether other stores need CRDT backing is open and
-requires a separate ADR.
+**Options explored in Phase 2a.** The recommended path (World copies from Y.js)
+defers the hard question. Eventually, the World may need to be CRDT-native —
+but this requires a separate ADR.
 
 **Questions to resolve:**
 
-- Should non-position stores also be CRDT-backed for collaboration?
-- Do the stores need an operation log for undo/redo, or can that remain external
-  (Y.js undo manager)?
-- How does conflict resolution work when two users modify the same record?
+- Should non-position components also be CRDT-backed for collaboration?
+- Does the World need an operation log for undo/redo, or can that remain
+  external (Y.js undo manager)?
+- How does conflict resolution work when two users modify the same component?
 
 ### Extension API preservation
 
@@ -470,7 +529,7 @@ event listeners instead of callbacks.
 
 **Phase 4 decisions:**
 
-- Rejection callbacks act as pre-commit guards (reject before store mutation).
+- Rejection callbacks act as pre-commit guards (reject before World mutation).
 - Callback dispatch remains synchronous during the bridge period.
 - Callback order remains: output validation -> input validation -> commit ->
   output change notification -> input change notification.
@@ -487,12 +546,16 @@ incrementally to ECS-native patterns.
 const seedWidget = node.widgets?.find((w) => w.name === 'seed')
 seedWidget?.setValue(42)
 
-// Store pattern (composite WidgetId, no reverse-lookup index needed)
-const seedWidgetId = widgetValueStore
-  .getNodeWidgets(graphId, nodeId)
-  .find((id) => parseWidgetId(id).name === 'seed')
+// ECS pattern (using the bridge/world widget lookup index)
+const seedWidgetId = world.widgetIndex.getByNodeAndName(nodeId, 'seed')
 if (seedWidgetId) {
-  widgetValueStore.setValue(seedWidgetId, 42)
+  const widgetValue = world.getComponent(seedWidgetId, WidgetValue)
+  if (widgetValue) {
+    world.setComponent(seedWidgetId, WidgetValue, {
+      ...widgetValue,
+      value: 42
+    })
+  }
 }
 ```
 
@@ -543,15 +606,17 @@ lifecycleEvents.on('entity.removed', (event) => {
 // Legacy pattern (do not add new usages)
 graph._version++
 
-// Transitional pattern (Phase 0a)
+// Bridge-safe transitional pattern (Phase 0a)
 graph.incrementVersion()
 
-// Store-native pattern: mutate through the command/system API.
+// ECS-native pattern: mutate through command/system API.
 // VersionSystem bumps once at transaction commit.
 executor.run({
   type: 'SetWidgetValue',
-  execute() {
-    widgetValueStore.setValue(widgetId, 42)
+  execute(world) {
+    const value = world.getComponent(widgetId, WidgetValue)
+    if (!value) return
+    world.setComponent(widgetId, WidgetValue, { ...value, value: 42 })
   }
 })
 ```
@@ -563,11 +628,9 @@ executor.run({
 
 ### Atomicity and transactions
 
-The lifecycle scenarios claim operations are "atomic." This requires a
-store/command-executor transaction — the ability to batch multiple store writes
-and commit or rollback as a unit. `layoutStore` already wraps its mutations in
-Y.js transactions; the command executor extends the same discipline across
-stores.
+The ECS lifecycle scenarios claim operations are "atomic." This requires
+the World to support transactions — the ability to batch multiple component
+writes and commit or rollback as a unit.
 
 **Current state:** `beforeChange()` / `afterChange()` provide undo/redo
 checkpoints but not true transactions. The graph can be in an inconsistent
@@ -575,10 +638,10 @@ state between these calls.
 
 **Phase 4 baseline semantics:**
 
-- Mutating systems run inside a single command-executor transaction.
-- The bridge maps one executor transaction to one `beforeChange()` /
+- Mutating systems run inside `world.transaction(label, fn)`.
+- The bridge maps one World transaction to one `beforeChange()` /
   `afterChange()` bracket.
-- Operations with multiple store writes (for example `connect()` touching
+- Operations with multiple component writes (for example `connect()` touching
   slots, links, and node metadata) still commit as one transaction and therefore
   one undo entry.
 - Failed transactions do not publish partial writes, lifecycle events, or
@@ -586,64 +649,65 @@ state between these calls.
 
 **Questions to resolve:**
 
-- How should the command-executor transaction interact with the Y.js
-  transactions that `layoutStore` already runs?
+- How should `world.transaction()` interact with Y.js transactions when a
+  component is CRDT-backed?
 - Is eventual consistency acceptable for derived data updates between
   transactions, or must post-transaction state always be immediately
   consistent?
 
 ### Keying strategy unification
 
-The dedicated stores use per-concern keying strategies:
+The 6 proto-ECS stores use 6 different keying strategies:
 
-| Store                     | Key Format                         |
-| ------------------------- | ---------------------------------- |
-| `widgetValueStore`        | `WidgetId` (`graphId:nodeId:name`) |
-| `domWidgetStore`          | Widget UUID                        |
-| `layoutStore`             | Raw nodeId/linkId/rerouteId        |
-| `nodeOutputStore`         | `"${subgraphId}:${nodeId}"`        |
-| `subgraphNavigationStore` | subgraphId or `'root'`             |
+| Store                   | Key Format                        |
+| ----------------------- | --------------------------------- |
+| WidgetValueStore        | `"${nodeId}:${widgetName}"`       |
+| PromotionStore          | `"${sourceNodeId}:${widgetName}"` |
+| DomWidgetStore          | Widget UUID                       |
+| LayoutStore             | Raw nodeId/linkId/rerouteId       |
+| NodeOutputStore         | `"${subgraphId}:${nodeId}"`       |
+| SubgraphNavigationStore | subgraphId or `'root'`            |
 
 ADR 0009 refines the promoted-widget target: promoted value widgets should use
 host boundary identity (`host node locator + SubgraphInput.name`), not interior
 source node/widget identity.
 
-Composite string keys won over synthetic numeric IDs. A widget is identified by
-its relationship to a graph and node, and the `graphId:nodeId:name` key carries
-that relationship directly. PR 12617 kept the composite string instead of an
-opaque number, so no reverse lookup index is required — `parseWidgetId()`
-recovers the parts on demand.
+The World unifies these under branded entity IDs. But stores that use
+composite keys (e.g., `nodeId:widgetName`) reflect a genuine structural
+reality — a widget is identified by its relationship to a node. Synthetic
+`WidgetEntityId`s replace this with an opaque number, requiring a reverse
+lookup index.
 
-**Resolution:** Self-documenting composite keys, parsed at boundaries. Each store
-keeps the key format that matches its concern; there is no forced unification
-under a single ID space.
+**Trade-off:** Type safety and uniformity vs. self-documenting keys. The
+World should maintain a lookup index (`(nodeId, widgetName) -> WidgetEntityId`)
+for the transition period.
 
 ---
 
 ## Dependency Graph
 
 ```
-Phase 0a (incrementVersion)  ──── ✅ shipped (one stray cleanup remaining)
-Phase 0b (ID type aliases)  ───┐
+Phase 0a (incrementVersion)  ──┐
+Phase 0b (ID type aliases)  ───┤
 Phase 0c (doc fixes)  ─────────┤── no dependencies between these
+                                │
+Phase 1a (branded IDs)  ────────┤
+Phase 1b (component interfaces) ┤── 1b depends on 1a
+Phase 1c (World type)  ─────────┘── 1c depends on 1a, 1b
 
-Phase 1a (branded WidgetId)  ── ✅ shipped (PR 12617)
-Phase 1b (store state shapes) ─┐── depends on 1a
-Phase 1c (dedicated stores)  ──┘── widgetValueStore + 5 others shipped (PR 12617)
-
-Phase 2a (Position via layoutStore) ─┐── depends on 1c
-Phase 2b (Widget consolidation)  ────┤── ✅ largely shipped; depends on 1a, 1c
-Phase 2c (Node metadata stores)  ────┘── depends on 1c
+Phase 2a (Position bridge)  ────┐── depends on 1c
+Phase 2b (Widget bridge)  ──────┤── depends on 1a, 1c
+Phase 2c (Node metadata bridge) ┘── depends on 0a, 1c
 
 Phase 3a (SerializationSystem)  ─── depends on 2a, 2b, 2c
-Phase 3b (VersionSystem)  ──────── depends on 2c (store-level change tracking)
+Phase 3b (VersionSystem)  ──────── depends on 0a, 2c
 Phase 3c (ConnectivitySystem)  ──── depends on 2c
 
 Phase 3->4 gate checklist  ──────── depends on 3a, 3b, 3c
 
 Phase 4a (Position writes)  ────── depends on 2a, 3b
 Phase 4b (Connectivity mutations) ─ depends on 3c, 3->4 gate
-Phase 4c (Widget writes)  ─────── ✅ largely shipped; depends on 2b
+Phase 4c (Widget writes)  ─────── depends on 2b
 Phase 4d (Layout decoupling)  ─── depends on 2a, 3->4 gate
 
 Phase 4->5 exit criteria  ──────── depends on all of Phase 4
@@ -651,19 +715,16 @@ Phase 4->5 exit criteria  ──────── depends on all of Phase 4
 Phase 5 (legacy removal)  ─────── depends on 4->5 exit criteria
 ```
 
-The dedicated stores (1c) are the hub: Phase 2 routes legacy data into them,
-Phase 3 systems read from them, Phase 4 routes writes through them.
-
 ## Risk Summary
 
-| Phase                 | Risk       | Reversibility           | Extension Impact            |
-| --------------------- | ---------- | ----------------------- | --------------------------- |
-| 0 (Foundation)        | None       | Fully reversible        | None                        |
-| 1 (Types/Stores)      | Low        | New files, deletable    | None                        |
-| 2 (Store integration) | Low-Medium | Additive store reads    | None                        |
-| 3 (Systems)           | Low-Medium | Systems run in parallel | None                        |
-| 4 (Write path)        | High       | Two-way sync is fragile | Callbacks must be preserved |
-| 5 (Legacy removal)    | Very High  | Irreversible            | Extensions must migrate     |
+| Phase              | Risk       | Reversibility           | Extension Impact            |
+| ------------------ | ---------- | ----------------------- | --------------------------- |
+| 0 (Foundation)     | None       | Fully reversible        | None                        |
+| 1 (Types/World)    | Low        | New files, deletable    | None                        |
+| 2 (Bridge)         | Low-Medium | Bridge is additive      | None                        |
+| 3 (Systems)        | Low-Medium | Systems run in parallel | None                        |
+| 4 (Write path)     | High       | Two-way sync is fragile | Callbacks must be preserved |
+| 5 (Legacy removal) | Very High  | Irreversible            | Extensions must migrate     |
 
 The plan is designed so that Phases 0-3 can ship without any risk to
 extensions or existing behavior. Phase 4 is where the real migration begins,

docs/architecture/ecs-target-architecture.md

@@ -2,29 +2,30 @@
 
 This document describes the target ECS architecture for the litegraph entity system. It shows how the entities and interactions from the [current system](entity-interactions.md) transform under ECS, and how the [structural problems](entity-problems.md) are resolved. For the full design rationale, see [ADR 0008](../adr/0008-entity-component-system.md).
 
-## 1. Store Overview
+## 1. World Overview
 
-The source of truth for runtime entity state in one workflow instance is the set
-of dedicated Pinia stores. Each store is keyed by per-store string IDs.
-Components are plain data objects. Systems are functions that query the relevant
-store(s).
+The World is the single source of truth for runtime entity state in one
+workflow instance. Entities are just branded IDs. Components are plain data
+objects. Systems are functions that query the World.
 
 ```mermaid
 graph TD
-    subgraph Stores["Dedicated Stores (source of truth)"]
+    subgraph World["World (Central Registry)"]
         direction TB
-        WidgetValueStore["widgetValueStore
-Map<WidgetId, WidgetValue>"]
-        DomWidgetStore["domWidgetStore
-Map<WidgetId, DomWidgetState>"]
-        LayoutStore["layoutStore (Y.js CRDT)
-nodeId / linkId / rerouteId → layout"]
-        NodeOutputStore["nodeOutputStore
-Map<nodeLocatorId, outputs>"]
-        SubgraphNavStore["subgraphNavigationStore
-active subgraph path"]
-        PreviewExposureStore["previewExposureStore
-preview exposure state"]
+        NodeStore["Nodes
+Map<NodeEntityId, NodeComponents>"]
+        LinkStore["Links
+Map<LinkEntityId, LinkComponents>"]
+        ScopeRegistry["Graph Scopes
+Map<GraphId, ParentGraphId | null>"]
+        WidgetStore["Widgets
+Map<WidgetEntityId, WidgetComponents>"]
+        SlotStore["Slots
+Map<SlotEntityId, SlotComponents>"]
+        RerouteStore["Reroutes
+Map<RerouteEntityId, RerouteComponents>"]
+        GroupStore["Groups
+Map<GroupEntityId, GroupComponents>"]
     end
 
     subgraph Systems["Systems (Behavior)"]
@@ -37,50 +38,53 @@ preview exposure state"]
         VS["VersionSystem"]
     end
 
-    RS -->|reads| Stores
-    SS -->|reads/writes| Stores
-    CS -->|reads/writes| LayoutStore
-    LS -->|reads/writes| LayoutStore
-    ES -->|reads| NodeOutputStore
-    VS -->|reads/writes| LayoutStore
+    RS -->|reads| World
+    SS -->|reads/writes| World
+    CS -->|reads/writes| World
+    LS -->|reads/writes| World
+    ES -->|reads| World
+    VS -->|reads/writes| World
 
-    style Stores fill:#1a1a2e,stroke:#16213e,color:#e0e0e0
+    style World fill:#1a1a2e,stroke:#16213e,color:#e0e0e0
     style Systems fill:#0f3460,stroke:#16213e,color:#e0e0e0
 ```
 
-### Entity Keys
-
-Each store addresses entities by its own string-key convention.
+### Entity IDs
 
 ```mermaid
 graph LR
-    subgraph "Per-store string keys"
-        WID["WidgetId
-graphId:nodeId:name
-(branded string, src/types/widgetId.ts)"]
-        NLID["nodeLocatorId
-subgraphId:nodeId"]
-        NID["nodeId (raw)"]
-        LID["linkId (raw)"]
-        RID["rerouteId (raw)"]
+    subgraph "Branded IDs (compile-time distinct)"
+        NID["NodeEntityId
+number & { __brand: 'NodeEntityId' }"]
+        LID["LinkEntityId
+number & { __brand: 'LinkEntityId' }"]
+        WID["WidgetEntityId
+number & { __brand: 'WidgetEntityId' }"]
+        SLID["SlotEntityId
+number & { __brand: 'SlotEntityId' }"]
+        RID["RerouteEntityId
+number & { __brand: 'RerouteEntityId' }"]
+        GID["GroupEntityId
+number & { __brand: 'GroupEntityId' }"]
     end
 
-    WID -->|widgetValueStore, domWidgetStore| W["keyed lookups"]
-    NLID -->|nodeOutputStore| W
-    NID -->|layoutStore| W
-    LID -->|layoutStore| W
-    RID -->|layoutStore| W
+    GRID["GraphId
+string & { __brand: 'GraphId' }"]:::scopeId
+
+    NID -.-x LID
+    LID -.-x WID
+    WID -.-x SLID
+
+    classDef scopeId fill:#2a2a4a,stroke:#4a4a6a,color:#e0e0e0,stroke-dasharray:5
+
+    linkStyle 0 stroke:red,stroke-dasharray:5
+    linkStyle 1 stroke:red,stroke-dasharray:5
+    linkStyle 2 stroke:red,stroke-dasharray:5
 ```
 
-`WidgetId = graphId:nodeId:name` is itself a branded string (see
-`src/types/widgetId.ts`). `nodeLocatorId = subgraphId:nodeId` addresses node
-outputs. `layoutStore` keys layout records by raw `nodeId` / `linkId` /
-`rerouteId`. Each store enforces its own key shape; there is no single shared
-entity-ID type across stores.
+Red dashed lines = compile-time errors if mixed. No more accidentally passing a `LinkId` where a `NodeId` is expected.
 
-Note: `graphId` is a scope identifier. It identifies which graph an entity
-belongs to and forms the prefix of `WidgetId`. Subgraphs are nodes with a
-`SubgraphStructure` component — see [Subgraph Boundaries](subgraph-boundaries-and-promotion.md).
+Note: `GraphId` is a scope identifier, not an entity ID. It identifies which graph an entity belongs to. Subgraphs are nodes with a `SubgraphStructure` component — see [Subgraph Boundaries](subgraph-boundaries-and-promotion.md).
 
 ### Linked subgraphs and instance-varying state
 
@@ -90,10 +94,9 @@ instance-scoped.
 - Shared definition-level data (interface shape, default metadata) can be reused
   across instances.
 - Runtime state (`WidgetValue`, execution/transient state, selection) is scoped
-  to the containing `graphId` chain inside one workflow instance.
-- "Single source of truth" therefore means one source per workflow instance
-  across the dedicated stores, with no global source shared across all linked
-  instances.
+  to the containing `graphId` chain inside one World instance.
+- "Single source of truth" therefore means one source per workflow instance,
+  not one global source across all linked instances.
 
 ### Recursive subgraphs without inheritance
 
@@ -127,7 +130,7 @@ graph LR
         B12["connect(), disconnect()"]
     end
 
-    subgraph After["nodeId-keyed components (across stores)"]
+    subgraph After["NodeEntityId + Components"]
         direction TB
         A1["Position
 { pos, size, bounding }"]
@@ -177,7 +180,7 @@ target_id, target_slot, type"]
         B5["resolve()"]
     end
 
-    subgraph After["linkId-keyed components (layoutStore)"]
+    subgraph After["LinkEntityId + Components"]
         direction TB
         A1["LinkEndpoints
 { originId, originSlot,
@@ -211,7 +214,7 @@ graph LR
         B5["useWidgetValueStore()"]
     end
 
-    subgraph After["WidgetId + components"]
+    subgraph After["WidgetEntityId + Components"]
         direction TB
         A1["WidgetIdentity
 { name, widgetType, parentNodeId }"]
@@ -225,7 +228,8 @@ graph LR
     B2 -.-> A2
     B3 -.-> A3
     B4 -.->|"moves to"| SYS1["RenderSystem"]
-    B5 -.->|"absorbed by"| SYS2["widgetValueStore"]
+    B5 -.->|"absorbed by"| SYS2["World (is the store)"]
+    B6 -.->|"moves to"| SYS3["PromotionSystem"]
 
     style Before fill:#4a1a1a,stroke:#6a2a2a,color:#e0e0e0
     style After fill:#1a4a1a,stroke:#2a6a2a,color:#e0e0e0
@@ -233,7 +237,7 @@ graph LR
 
 ## 3. System Architecture
 
-Systems are pure functions that query the relevant store(s) for entities with specific component combinations. Each system owns exactly one concern.
+Systems are pure functions that query the World for entities with specific component combinations. Each system owns exactly one concern.
 
 ```mermaid
 graph TD
@@ -385,25 +389,30 @@ graph TD
         VS["VersionSystem"]
     end
 
-    subgraph Stores["Dedicated Stores (instance-scoped source of truth)"]
-        LayoutStore["layoutStore"]
-        WidgetValueStore["widgetValueStore"]
-        DomWidgetStore["domWidgetStore"]
-        NodeOutputStore["nodeOutputStore"]
+    World["World
+(instance-scoped source of truth)"]
+
+    subgraph Components["Component Stores"]
+        Pos["Position"]
+        Vis["*Visual"]
+        Con["Connectivity"]
+        Val["*Value"]
     end
 
-    Systems -->|"query/mutate"| Stores
+    Systems -->|"query/mutate"| World
+    World -->|"contains"| Components
 
     style Systems fill:#1a4a1a,stroke:#2a6a2a,color:#e0e0e0
-    style Stores fill:#1a3a3a,stroke:#2a4a4a,color:#e0e0e0
+    style World fill:#1a1a4a,stroke:#2a2a6a,color:#e0e0e0
+    style Components fill:#1a3a3a,stroke:#2a4a4a,color:#e0e0e0
 ```
 
 Key differences:
 
 - **No circular dependencies**: entities are IDs, not class instances
-- **No Demeter violations**: systems query stores directly, never reach through entities
-- **Data lives in dedicated stores**: systems are the only writers
-- **Unidirectional**: Input → Systems → Stores → Render (no back-edges)
+- **No Demeter violations**: systems query the World directly, never reach through entities
+- **No scattered store access**: the World _is_ the store; systems are the only writers
+- **Unidirectional**: Input → Systems → World → Render (no back-edges)
 - **Instance safety**: linked definitions can be reused without forcing shared
   mutable widget/execution state across instances
 
@@ -438,10 +447,9 @@ No inheritance hierarchy.
 Subgraph = node + component."]
         S3["One system per concern.
 Systems don't overlap."]
-        S4["Consistent per-store
-string-key conventions
-(WidgetId, nodeLocatorId, raw ids)."]
-        S5["Systems query stores.
+        S4["Branded per-kind IDs.
+Compile-time type errors."]
+        S5["Systems query World.
 No entity→entity refs."]
         S6["VersionSystem owns
 all change tracking."]
@@ -471,30 +479,30 @@ sequenceDiagram
     participant Legacy as Legacy Code
     participant Class as LGraphNode (class)
     participant Bridge as Bridge Adapter
-    participant Store as layoutStore (ECS)
+    participant World as World (ECS)
     participant New as New Code / Systems
 
-    Note over Legacy,New: Phase 1: Bridge reads from class, writes to store
+    Note over Legacy,New: Phase 1: Bridge reads from class, writes to World
 
     Legacy->>Class: node.pos = [100, 200]
     Class->>Bridge: pos setter intercepted
-    Bridge->>Store: useLayoutMutations().moveNode(nodeId, { pos: [100, 200] })
+    Bridge->>World: world.setComponent(nodeId, Position, { pos: [100, 200] })
 
-    New->>Store: layoutStore read for nodeId
-    Store-->>New: { pos: [100, 200], size: [...] }
+    New->>World: world.getComponent(nodeId, Position)
+    World-->>New: { pos: [100, 200], size: [...] }
 
     Note over Legacy,New: Phase 2: New features build on ECS directly
 
-    New->>Store: useLayoutMutations().moveNode(nodeId, { pos: [150, 250] })
-    Store->>Bridge: change detected
+    New->>World: world.setComponent(nodeId, Position, { pos: [150, 250] })
+    World->>Bridge: change detected
     Bridge->>Class: node._pos = [150, 250]
     Legacy->>Class: node.pos
     Class-->>Legacy: [150, 250]
 
     Note over Legacy,New: Phase 3: Legacy code migrated, bridge removed
 
-    New->>Store: layoutStore read for nodeId
-    Store-->>New: { pos: [150, 250] }
+    New->>World: world.getComponent(nodeId, Position)
+    World-->>New: { pos: [150, 250] }
 ```
 
 ### Incremental layout/render separation
@@ -516,17 +524,16 @@ incremental rollout safety.
 ```mermaid
 graph LR
     subgraph Phase1["Phase 1: Types Only"]
-        T1["Define string-key types
-(WidgetId, nodeLocatorId)"]
+        T1["Define branded IDs"]
         T2["Define component interfaces"]
-        T3["Define store shapes"]
+        T3["Define World type"]
     end
 
     subgraph Phase2["Phase 2: Bridge"]
         B1["Bridge adapters
-class ↔ store sync"]
+class ↔ World sync"]
         B2["New features use
-stores as source"]
+World as source"]
         B3["Old code unchanged"]
     end
 

docs/architecture/ecs-world-command-api.md

@@ -0,0 +1,349 @@
+# World API and Command Layer
+
+How the ECS World's imperative API relates to ADR 0003's command pattern
+requirement, and why the two are complementary rather than conflicting.
+
+This document responds to the concern that `world.setComponent()` and
+`ConnectivitySystem.connect()` are "imperative mutators" incompatible with
+serializable, idempotent commands. The short answer: they are the
+**implementation** of commands, not a replacement for them.
+
+## Architectural Layering
+
+```
+Caller  →  Command  →  System (handler)  →  World (store)  →  Y.js (sync)
+               ↓
+         Command Log (undo, replay, sync)
+```
+
+- **Commands** describe intent. They are serializable, deterministic, and
+  idempotent.
+- **Systems** are command handlers. They validate, execute, and emit lifecycle
+  events.
+- **The World** is the store. It holds component data. It does not know about
+  commands.
+
+This is the same relationship Redux has between actions, reducers, and the
+store. The store's `dispatch()` is imperative. That does not make Redux
+incompatible with serializable actions.
+
+## Proposed World Mutation API
+
+The World exposes a thin imperative surface. Every mutation goes through a
+system, and every system call is invoked by a command.
+
+### World Core API
+
+```ts
+interface World {
+  // Reads (no command needed)
+  getComponent<C>(id: EntityId, key: ComponentKey<C>): C | undefined
+  hasComponent(id: EntityId, key: ComponentKey<C>): boolean
+  queryAll<C extends ComponentKey[]>(...keys: C): QueryResult<C>[]
+
+  // Mutations (called only by systems, inside transactions)
+  createEntity<K extends EntityKind>(kind: K): EntityIdFor<K>
+  deleteEntity<K extends EntityKind>(kind: K, id: EntityIdFor<K>): void
+  setComponent<C>(id: EntityId, key: ComponentKey<C>, data: C): void
+  removeComponent(id: EntityId, key: ComponentKey<C>): void
+
+  // Transaction boundary
+  transaction<T>(label: string, fn: () => T): T
+}
+```
+
+These methods are **internal**. External callers never call
+`world.setComponent()` directly — they submit commands.
+
+### Command Interface
+
+```ts
+interface Command<T = void> {
+  readonly type: string
+  execute(world: World): T
+}
+```
+
+A command is a plain object with a `type` discriminator and an `execute`
+method that receives the World. The command executor wraps every
+`execute()` call in a World transaction.
+
+### Command Executor
+
+```ts
+interface CommandExecutor {
+  run<T>(command: Command<T>): T
+  batch(label: string, commands: Command[]): void
+}
+
+function createCommandExecutor(world: World): CommandExecutor {
+  return {
+    run(command) {
+      return world.transaction(command.type, () => command.execute(world))
+    },
+    batch(label, commands) {
+      world.transaction(label, () => {
+        for (const cmd of commands) cmd.execute(world)
+      })
+    }
+  }
+}
+```
+
+Every command execution:
+
+1. Opens a World transaction (maps to one `beforeChange`/`afterChange`
+   bracket for undo).
+2. Calls the command's `execute()`, which invokes system functions.
+3. Commits the transaction. On failure, rolls back — no partial writes, no
+   lifecycle events, no version bump.
+
+## From Imperative Calls to Commands
+
+The lifecycle scenarios in
+[ecs-lifecycle-scenarios.md](ecs-lifecycle-scenarios.md) show system calls
+like `ConnectivitySystem.connect(world, outputSlotId, inputSlotId)`. These
+are the **internals** of a command. Here is how each scenario maps:
+
+### Connect Slots
+
+The lifecycle scenario shows:
+
+```ts
+// Inside ConnectivitySystem — this is the handler, not the public API
+ConnectivitySystem.connect(world, outputSlotId, inputSlotId)
+```
+
+The public API is a command:
+
+```ts
+const connectSlots: Command = {
+  type: 'ConnectSlots',
+  outputSlotId,
+  inputSlotId,
+
+  execute(world) {
+    ConnectivitySystem.connect(world, this.outputSlotId, this.inputSlotId)
+  }
+}
+
+executor.run(connectSlots)
+```
+
+The command object is serializable (`{ type, outputSlotId, inputSlotId }`).
+It can be sent over a wire, stored in a log, or replayed.
+
+### Move Node
+
+```ts
+const moveNode: Command = {
+  type: 'MoveNode',
+  nodeId,
+  pos: [150, 250],
+
+  execute(world) {
+    LayoutSystem.moveNode(world, this.nodeId, this.pos)
+  }
+}
+```
+
+### Remove Node
+
+```ts
+const removeNode: Command = {
+  type: 'RemoveNode',
+  nodeId,
+
+  execute(world) {
+    ConnectivitySystem.removeNode(world, this.nodeId)
+  }
+}
+```
+
+### Set Widget Value
+
+```ts
+const setWidgetValue: Command = {
+  type: 'SetWidgetValue',
+  widgetId,
+  value,
+
+  execute(world) {
+    world.setComponent(this.widgetId, WidgetValue, {
+      ...world.getComponent(this.widgetId, WidgetValue)!,
+      value: this.value
+    })
+  }
+}
+```
+
+### Batch: Paste
+
+Paste is a compound operation — many entities created in one undo step:
+
+```ts
+const paste: Command = {
+  type: 'Paste',
+  snapshot,
+  offset,
+
+  execute(world) {
+    const remap = new Map<EntityId, EntityId>()
+
+    for (const entity of this.snapshot.entities) {
+      const newId = world.createEntity(entity.kind)
+      remap.set(entity.id, newId)
+
+      for (const [key, data] of entity.components) {
+        world.setComponent(newId, key, remapEntityRefs(data, remap))
+      }
+    }
+
+    // Offset positions
+    for (const [, newId] of remap) {
+      const pos = world.getComponent(newId, Position)
+      if (pos) {
+        world.setComponent(newId, Position, {
+          ...pos,
+          pos: [pos.pos[0] + this.offset[0], pos.pos[1] + this.offset[1]]
+        })
+      }
+    }
+  }
+}
+
+executor.run(paste) // one transaction, one undo step
+```
+
+## Addressing the Six Concerns
+
+The PR review raised six "critical conflicts." Here is how the command layer
+resolves each:
+
+### 1. "The World API is imperative, not command-based"
+
+Correct — by design. The World is the store. Commands are the public
+mutation API above it. `world.setComponent()` is to commands what
+`state[key] = value` is to Redux reducers.
+
+### 2. "Systems are orchestrators, not command producers"
+
+Systems are command **handlers**. A command's `execute()` calls system
+functions. Systems do not spontaneously mutate the World — they are invoked
+by commands.
+
+### 3. "Auto-incrementing IDs are non-stable in concurrent environments"
+
+For local-only operations, auto-increment is fine. For CRDT sync, entity
+creation goes through a CRDT-aware ID generator (Y.js provides this via
+`doc.clientID` + logical clock). The command layer can select the ID
+strategy:
+
+```ts
+// Local-only command
+world.createEntity(kind) // auto-increment
+
+// CRDT-aware command (future)
+world.createEntityWithId(kind, crdtGeneratedId)
+```
+
+This is an ID generation concern, not an ECS architecture concern.
+
+### 4. "No transaction primitive exists"
+
+`world.transaction(label, fn)` is the primitive. It maps to one
+`beforeChange`/`afterChange` bracket. The command executor wraps every
+`execute()` call in a transaction. See the [migration plan's Phase 3→4
+gate](ecs-migration-plan.md#phase-3---4-gate-required) for the acceptance
+criteria.
+
+### 5. "No idempotency guarantees"
+
+Idempotency is a property of the command, not the store. Two strategies:
+
+- **Content-addressed IDs**: The command specifies the entity ID rather than
+  auto-generating. Replaying the command with the same ID is a no-op if the
+  entity already exists.
+- **Command deduplication**: The command log tracks applied command IDs.
+  Replaying an already-applied command is skipped.
+
+Both are standard CRDT patterns and belong in the command executor, not the
+World.
+
+### 6. "No error semantics"
+
+Commands return results. The executor can wrap execution:
+
+```ts
+type CommandResult<T> =
+  | { status: 'applied'; value: T }
+  | { status: 'rejected'; reason: string }
+  | { status: 'no-op' }
+
+function run<T>(command: Command<T>): CommandResult<T> {
+  try {
+    const value = world.transaction(command.type, () => command.execute(world))
+    return { status: 'applied', value }
+  } catch (e) {
+    if (e instanceof RejectionError) {
+      return { status: 'rejected', reason: e.message }
+    }
+    throw e
+  }
+}
+```
+
+Rejection semantics (e.g., `onConnectInput` returning false) throw a
+`RejectionError` inside the system, which the transaction rolls back.
+
+## Why Two ADRs
+
+ADR 0003 defines the command pattern and CRDT sync layer.
+ADR 0008 defines the entity data model.
+
+They are **complementary architectural layers**, not competing proposals:
+
+| Concern                   | Owns It  |
+| ------------------------- | -------- |
+| Entity taxonomy and IDs   | ADR 0008 |
+| Component decomposition   | ADR 0008 |
+| World (store)             | ADR 0008 |
+| Command interface         | ADR 0003 |
+| Undo/redo via command log | ADR 0003 |
+| CRDT sync                 | ADR 0003 |
+| Serialization format      | ADR 0008 |
+| Replay and idempotency    | ADR 0003 |
+
+Merging them into a single mega-ADR would conflate the data model with the
+mutation strategy. Keeping them separate allows each to evolve independently
+— the World can change its internal representation without affecting the
+command API, and the command layer can adopt new sync strategies without
+restructuring the entity model.
+
+## Relationship to Lifecycle Scenarios
+
+The [lifecycle scenarios](ecs-lifecycle-scenarios.md) show system-level
+calls (`ConnectivitySystem.connect()`, `ClipboardSystem.paste()`, etc.).
+These are the **inside** of a command — what the command handler does when
+the command is executed.
+
+The scenarios deliberately omit the command layer to focus on how systems
+interact with the World. Adding command wrappers is mechanical: every
+system call shown in the scenarios becomes the body of a command's
+`execute()` method.
+
+## When This Gets Built
+
+The command layer is not part of the initial ECS migration phases (0–3).
+During Phases 0–3, the bridge layer provides mutation entry points that
+will later become command handlers. The command layer is introduced in
+Phase 4 when write paths migrate from legacy to ECS:
+
+- **Phase 4a**: Position write commands replace direct `node.pos =` assignment
+- **Phase 4b**: Connectivity commands replace `node.connect()` /
+  `node.disconnect()`
+- **Phase 4c**: Widget value commands replace direct store writes
+
+Each Phase 4 step introduces commands for one concern, with the system
+function as the handler and the World transaction as the atomicity
+boundary.

docs/architecture/entity-interactions.md

@@ -1,6 +1,6 @@
 # Entity Interactions (Current System)
 
-This document maps the relationships and interaction patterns between all entity types in the litegraph layer as it exists today. It serves as a baseline for the ECS migration planned in [ADR 0008](../adr/0008-entity-component-system.md), whose target is realized as a set of dedicated Pinia stores (see [Proto-ECS Stores](proto-ecs-stores.md)).
+This document maps the relationships and interaction patterns between all entity types in the litegraph layer as it exists today. It serves as a baseline for the ECS migration planned in [ADR 0008](../adr/0008-entity-component-system.md).
 
 ## Entities
 
@@ -361,7 +361,7 @@ graph TD
     subgraph Stores
         WVS["WidgetValueStore
 (Pinia)"]
-        PES["PreviewExposureStore
+        PS["PromotionStore
 (Pinia)"]
         LM["LayoutMutations
 (composable)"]
@@ -379,9 +379,9 @@ lastRerouteId, lastGroupId)"]
     Widget <-->|"value, label, disabled"| WVS
     WVS -.->|"keyed by graphId:nodeId:name"| Widget
 
-    %% PreviewExposureStore
-    SGNode -->|"host-scoped preview exposures"| PES
-    PES -.->|"keyed by host node locator"| SGNode
+    %% PromotionStore
+    SGNode -->|"tracks promoted widgets"| PS
+    Widget -.->|"isPromotedByAny() query"| PS
 
     %% LayoutMutations
     Node -->|"pos/size setter"| LM

docs/architecture/entity-problems.md

@@ -115,7 +115,7 @@ If slots are reordered (e.g., by an extension adding a slot), all links referenc
 
 ### No Cross-Kind ID Safety
 
-Nothing prevents passing a `LinkId` where a `NodeId` is expected — they're both `number`. The dedicated-store direction addresses this with branded string keys where cross-kind safety pays off (for example `WidgetId` in `widgetValueStore`, `src/types/widgetId.ts`).
+Nothing prevents passing a `LinkId` where a `NodeId` is expected — they're both `number`. This is the core motivation for the branded ID types proposed in ADR 0008.
 
 ## 5. Law of Demeter Violations
 
@@ -201,12 +201,12 @@ This means:
 
 ## How ECS Addresses These Problems
 
-| Problem                | ECS Solution                                                                                |
-| ---------------------- | ------------------------------------------------------------------------------------------- |
-| God objects            | Data split into small, focused components in dedicated stores; behavior lives in systems    |
-| Circular dependencies  | Entities are addressed by string keys; components have no inheritance hierarchy             |
-| Mixed concerns         | Each system handles exactly one concern (render, serialize, execute)                        |
-| Inconsistent IDs       | Branded string keys per store (for example `WidgetId`) for cross-kind safety                |
-| Demeter violations     | Systems query the relevant store directly; no entity-to-entity references                   |
-| Scattered side effects | Version tracking becomes a system responsibility; mutations flow through store command APIs |
-| Render-time mutations  | Render system reads components without writing; layout system runs separately               |
+| Problem                | ECS Solution                                                                  |
+| ---------------------- | ----------------------------------------------------------------------------- |
+| God objects            | Data split into small, focused components; behavior lives in systems          |
+| Circular dependencies  | Entities are just IDs; components have no inheritance hierarchy               |
+| Mixed concerns         | Each system handles exactly one concern (render, serialize, execute)          |
+| Inconsistent IDs       | Branded per-kind IDs with compile-time safety                                 |
+| Demeter violations     | Systems query the World directly; no entity-to-entity references              |
+| Scattered side effects | Version tracking becomes a system responsibility; stores become systems       |
+| Render-time mutations  | Render system reads components without writing; layout system runs separately |

docs/architecture/proto-ecs-stores.md

@@ -6,20 +6,17 @@ For the full problem analysis, see [Entity Problems](entity-problems.md). For th
 
 ## 1. What's Already Extracted
 
-Six dedicated stores extract entity state out of class instances into focused,
-queryable registries, each owning one concern. Promoted value-widget topology is
-no longer a store; ADR 0009 represents it as ordinary linked `SubgraphInput`
-state, and promoted value data lives in `WidgetValueStore` keyed by the input's
-`WidgetId`.
+Five stores extract entity state out of class instances into centralized,
+queryable registries. Promoted value-widget topology is no longer a store; ADR
+0009 represents it as ordinary linked `SubgraphInput` state.
 
-| Store                   | Extracts From       | Scoping           | Key Format                         | Data Shape                    |
-| ----------------------- | ------------------- | ----------------- | ---------------------------------- | ----------------------------- |
-| WidgetValueStore        | `BaseWidget`        | `graphId`         | `WidgetId` (`graphId:nodeId:name`) | Plain `WidgetState` object    |
-| DomWidgetStore          | `BaseDOMWidget`     | Global            | `widgetId` (UUID)                  | Position, visibility, z-index |
-| LayoutStore             | Node, Link, Reroute | Workflow-level    | `nodeId`, `linkId`, `rerouteId`    | Y.js CRDT maps (pos, size)    |
-| NodeOutputStore         | Execution results   | `nodeLocatorId`   | `"${subgraphId}:${nodeId}"`        | Output data, preview URLs     |
-| SubgraphNavigationStore | Canvas viewport     | `subgraphId`      | `subgraphId` or `'root'`           | LRU viewport cache            |
-| PreviewExposureStore    | Subgraph host node  | host node locator | host locator + exposure name       | Display-only preview state    |
+| Store                   | Extracts From       | Scoping                 | Key Format                      | Data Shape                    |
+| ----------------------- | ------------------- | ----------------------- | ------------------------------- | ----------------------------- |
+| WidgetValueStore        | `BaseWidget`        | `graphId → nodeId:name` | `"${nodeId}:${widgetName}"`     | Plain `WidgetState` object    |
+| DomWidgetStore          | `BaseDOMWidget`     | Global                  | `widgetId` (UUID)               | Position, visibility, z-index |
+| LayoutStore             | Node, Link, Reroute | Workflow-level          | `nodeId`, `linkId`, `rerouteId` | Y.js CRDT maps (pos, size)    |
+| NodeOutputStore         | Execution results   | `nodeLocatorId`         | `"${subgraphId}:${nodeId}"`     | Output data, preview URLs     |
+| SubgraphNavigationStore | Canvas viewport     | `subgraphId`            | `subgraphId` or `'root'`        | LRU viewport cache            |
 
 ADR 0009 refines promoted-widget identity: promoted value widgets are keyed by
 the host boundary (`host node locator + SubgraphInput.name`), while interior
@@ -34,9 +31,9 @@ The closest thing to a true ECS component store in the codebase today.
 ### State Shape
 
 ```
-Map<UUID, Map<WidgetId, WidgetState>>
+Map<UUID, Map<WidgetKey, WidgetState>>
      │              │           │
-     graphId   "graphId:nodeId:name"  pure data object
+     graphId     "nodeId:name"  pure data object
 ```
 
 `WidgetState` is a plain data object with no methods:
@@ -59,7 +56,7 @@ Map<UUID, Map<WidgetId, WidgetState>>
 **Phase 2 — `setNodeId()`:** Widget replaces its `_state` with a reference to the store's object:
 
 ```
-widget._state = useWidgetValueStore().registerWidget(widgetId, { ...this._state, nodeId })
+widget._state = useWidgetValueStore().registerWidget(graphId, { ...this._state, nodeId })
 ```
 
 After registration, the widget's getters/setters (`value`, `label`, `disabled`) are pass-throughs to the store. Mutations to the widget automatically sync to the store via shared object reference.
@@ -122,22 +119,20 @@ Legacy `properties.proxyWidgets` is load-time migration input only.
 ╰────────────────╯     ╰──────────────────────╯
 ```
 
-A promoted host widget is ordinary `WidgetState` in `WidgetValueStore`, keyed by
-the `WidgetId` carried on the `SubgraphInput` (`input.widgetId`). `SubgraphNode.widgets`
-is a read-only projection over the node's inputs that resolves each value via
-`useWidgetValueStore().getWidget(input.widgetId)`. There is no synthetic widget
-view object and no view cache to reconcile (PR 12617 deleted `PromotedWidgetView`
-and `PromotedWidgetViewManager`).
+`PromotedWidgetViewManager`
+(`src/lib/litegraph/src/subgraph/PromotedWidgetViewManager.ts`) now reconciles
+synthetic widget views derived from linked subgraph inputs. It does not sit on
+top of a promotion registry.
 
 ### ECS Alignment
 
-| Aspect                       | ECS-like | Why                                                            |
-| ---------------------------- | -------- | -------------------------------------------------------------- |
-| Canonical topology           | Yes      | Value exposure is ordinary subgraph input/link state           |
-| Host-scoped preview state    | Yes      | Preview exposure data is keyed by host locator                 |
-| Legacy migration boundary    | Yes      | `proxyWidgets` is consumed into canonical state or quarantine  |
-| Promoted value is plain data | Yes      | Host widget is `WidgetState` in the store, keyed by `WidgetId` |
-| Projection over data         | Yes      | `SubgraphNode.widgets` derives from inputs; no view cache      |
+| Aspect                        | ECS-like  | Why                                                           |
+| ----------------------------- | --------- | ------------------------------------------------------------- |
+| Canonical topology            | Yes       | Value exposure is ordinary subgraph input/link state          |
+| Host-scoped preview state     | Yes       | Preview exposure data is keyed by host locator                |
+| Legacy migration boundary     | Yes       | `proxyWidgets` is consumed into canonical state or quarantine |
+| View reconciliation           | Partially | ViewManager preserves synthetic widget object identity        |
+| Entity class drives view sync | **No**    | SubgraphNode still owns synthetic view cache invalidation     |
 
 ## 4. LayoutStore (CRDT)
 
@@ -176,14 +171,14 @@ These module-scope calls create implicit dependencies on the Vue runtime and mak
 
 ### ECS Alignment
 
-| Aspect                       | ECS-like  | Why                                                     |
-| ---------------------------- | --------- | ------------------------------------------------------- |
-| Position data extracted      | Yes       | Closest to the ECS `Position` component                 |
-| CRDT-ready                   | Yes       | Enables collaboration (ADR 0003)                        |
-| Covers multiple entity kinds | Yes       | Nodes, links, reroutes in one store                     |
-| Mutation API (composable)    | Partially | System-like, but called from entities, not a system     |
-| Module-scope access          | **No**    | Domain objects import store at module level             |
-| Per-store keying             | Yes       | Owns `nodeId`/`linkId`/`rerouteId` keys for its concern |
+| Aspect                       | ECS-like  | Why                                                 |
+| ---------------------------- | --------- | --------------------------------------------------- |
+| Position data extracted      | Yes       | Closest to the ECS `Position` component             |
+| CRDT-ready                   | Yes       | Enables collaboration (ADR 0003)                    |
+| Covers multiple entity kinds | Yes       | Nodes, links, reroutes in one store                 |
+| Mutation API (composable)    | Partially | System-like, but called from entities, not a system |
+| Module-scope access          | **No**    | Domain objects import store at module level         |
+| No entity ID branding        | **No**    | Plain numbers, no type safety across kinds          |
 
 ## 5. Pattern Analysis
 
@@ -195,32 +190,30 @@ These module-scope calls create implicit dependencies on the Vue runtime and mak
 4. **Query APIs**: `getWidget()`, preview exposure queries, `getNodeWidgets()` — system-like queries
 5. **Separation of data from behavior**: The stores hold data; classes retain behavior
 
-### Target Design and Remaining Gaps
-
-Dedicated per-domain stores with their own string keys are the target, not a way
-station toward one unified registry. The remaining gaps are about behavior and
-data flow, not about collapsing the stores together.
+### What's Missing vs Full ECS
 
 ```mermaid
 graph TD
-    subgraph Have["What We Have (and Want)"]
+    subgraph Have["What We Have"]
         style Have fill:#1a4a1a,stroke:#2a6a2a,color:#e0e0e0
-        H1["Dedicated per-domain stores"]
+        H1["Centralized data stores"]
         H2["Plain data components
 (WidgetState, LayoutMap)"]
         H3["Query APIs
 (getWidget, preview exposures)"]
         H4["Graph-scoped lifecycle"]
-        H5["Per-store string keys
-(WidgetId, nodeLocatorId)"]
-        H6["Position extraction
+        H5["Partial position extraction
 (LayoutStore)"]
     end
 
     subgraph Missing["What's Missing"]
         style Missing fill:#4a1a1a,stroke:#6a2a2a,color:#e0e0e0
-        M3["System / command layer
-(sanctioned mutation path)"]
+        M1["Unified World
+(6 stores, 6 keying strategies)"]
+        M2["Branded entity IDs
+(keys are string concatenations)"]
+        M3["System layer
+(mutations from anywhere)"]
         M4["Complete extraction
 (behavior still on classes)"]
         M5["No entity-to-entity refs
@@ -232,21 +225,19 @@ graph TD
 
 ### Keying Strategy Comparison
 
-Each store owns the identity scheme that fits its concern:
+Each store invents its own identity scheme:
 
-| Store            | Key Format                         | Key Type           | Type-Safe?       |
-| ---------------- | ---------------------------------- | ------------------ | ---------------- |
-| WidgetValueStore | `WidgetId` (`graphId:nodeId:name`) | branded string     | Yes (`WidgetId`) |
-| DomWidgetStore   | Widget UUID                        | UUID (string)      | No               |
-| LayoutStore      | Raw nodeId/linkId/rerouteId        | Mixed number types | No               |
-| NodeOutputStore  | `"${subgraphId}:${nodeId}"`        | Composite string   | No               |
+| Store            | Key Format                  | Entity ID Used          | Type-Safe? |
+| ---------------- | --------------------------- | ----------------------- | ---------- |
+| WidgetValueStore | `"${nodeId}:${widgetName}"` | NodeId (number\|string) | No         |
+| DomWidgetStore   | Widget UUID                 | UUID (string)           | No         |
+| LayoutStore      | Raw nodeId/linkId/rerouteId | Mixed number types      | No         |
+| NodeOutputStore  | `"${subgraphId}:${nodeId}"` | Composite string        | No         |
 
-`WidgetValueStore` already keys on a branded `WidgetId` string (`src/types/widgetId.ts`),
-which carries its scope and survives renames at the store layer. The remaining
-stores can adopt their own branded string keys where cross-kind safety pays off,
-without a shared entity-ID space. For promoted value widgets, ADR 0009 keys on
-the host boundary: the input's `WidgetId` (host node locator + `SubgraphInput.name`),
-not interior source identity.
+In the ECS target, all of these would use branded entity IDs (`WidgetEntityId`, `NodeEntityId`, etc.) with compile-time cross-kind protection.
+For promoted value widgets, ADR 0009 narrows the target key to host boundary
+identity (`host node locator + SubgraphInput.name`) instead of interior source
+identity.
 
 ## 6. Extraction Map
 

docs/architecture/subgraph-boundaries-and-promotion.md

@@ -74,7 +74,7 @@ graph TD
 
     subgraph Unified["Unified: Composition"]
         direction TB
-        W["Dedicated stores (flat)"]
+        W["World (flat)"]
         N1["Node A
         graphScope: root"]
         N2["Node B (subgraph carrier)
@@ -95,29 +95,30 @@ graph TD
     style Unified fill:#1a2a1a,stroke:#2a4a2a,color:#e0e0e0
 ```
 
-Across the dedicated stores:
+In the ECS World:
 
 - **Every graph is a graph.** The "root" graph is simply the one whose
   `graphScope` has no parent.
-- **Nesting is a component.** A node can carry a `SubgraphStructure` component,
-  which references another graph scope. That scope contains its own entities —
-  nodes, links, widgets, reroutes, groups — and each store entry tags the scope
-  it belongs to.
-- **Scope tagging over container nesting.** Entries across all nesting levels
-  live in the same stores, each tagged with a `graphScope` identifier. The
-  stores stay flat; the fractal structure is encoded in the keys and scope tags,
-  with no recursive containers.
-- **Entity taxonomy: six kinds.** A subgraph is a node carrying a
-  `SubgraphStructure` component. The taxonomy is: Node, Link, Widget, Slot,
-  Reroute, Group. `SubgraphEntityId` is replaced by a `GraphId` scope identifier.
-- **Numeric ID counters stay shared.** Node/link/reroute IDs are allocated from
-  a single counter space across nesting levels, preserving the current
-  `rootGraph.state` behavior and guaranteeing uniqueness. Widget keys embed
-  their scope directly (`WidgetId = graphId:nodeId:name`).
-- **Graph scope parentage is tracked.** A scope registry maps each `graphId` to
-  its parent `graphId` (or null for the root). This enables the ancestor walk
-  required by the acyclicity invariant and supports queries like "all entities
-  transitively contained by this graph."
+- **Nesting is a component, not a type.** A node can carry a
+  `SubgraphStructure` component, which references another graph scope. That
+  scope contains its own entities — nodes, links, widgets, reroutes, groups —
+  all living in the same flat World.
+- **One World per workflow.** All entities across all nesting levels coexist in
+  a single World, each tagged with a `graphScope` identifier. There are no
+  sub-worlds, no recursive containers. The fractal structure is encoded in the
+  data, not in the container hierarchy.
+- **Entity taxonomy: six kinds, not seven.** ADR 0008 defines seven entity kinds
+  including `SubgraphEntityId`. Under unification, "subgraph" is not an entity
+  kind — it is a node with a component. The taxonomy becomes: Node, Link,
+  Widget, Slot, Reroute, Group.
+- **ID counters remain global.** All entity IDs are allocated from a single
+  counter space, shared across all nesting levels. This preserves the current
+  `rootGraph.state` behavior and guarantees ID uniqueness across the entire
+  World.
+- **Graph scope parentage is tracked.** The World maintains a scope registry:
+  each `graphId` maps to its parent `graphId` (or null for the root). This
+  enables the ancestor walk required by the acyclicity invariant and supports
+  queries like "all entities transitively contained by this graph."
 
 ### The acyclicity invariant
 
@@ -366,17 +367,15 @@ sequenceDiagram
     Exec->>IW: reads input value (42)
 ```
 
-### Candidate B: Simplified component promotion (rejected)
-
-ADR 0009 chose Candidate A. Candidate B is retained here as the rejected
-alternative; it relied on a source-widget lookup model that no longer exists.
+### Candidate B: Simplified component promotion
 
 Promotion remains a first-class concept, simplified from three layers to one:
 
-- A `WidgetPromotion` component on a widget entity referencing the host node and
-  source widget
-- The SubgraphNode's widget list includes promoted widget references directly
-- Value reads/writes delegate to the source widget's value via a store lookup
+- A `WidgetPromotion` component on a widget entity:
+  `{ promotedTo: NodeEntityId, sourceWidget: WidgetEntityId }`
+- The SubgraphNode's widget list includes promoted widget entity IDs directly
+- Value reads/writes delegate to the source widget's `WidgetValue` component via
+  World lookup
 - Serialized as `properties.proxyWidgets` (unchanged)
 
 This removes the ViewManager and proxy widget reconciliation but preserves the
@@ -400,9 +399,8 @@ concept of promotion as distinct from connection.
 
 Whichever candidate is chosen:
 
-- **Internal identity is the `WidgetId` string.** Serialization uses widget name
-  - parent node reference, while runtime state keys on `WidgetId`
-    (`graphId:nodeId:name`). This is settled (see Section 4).
+- **`WidgetEntityId` is internal.** Serialization uses widget name + parent node
+  reference. This is settled (see Section 4).
 - **The type → widget mapping is authoritative.** The widget registry
   (`widgetStore.widgets`) is the single source of truth for which types produce
   widgets. No parallel mechanism should duplicate this.
@@ -475,10 +473,10 @@ and produces the recursive `ExportedSubgraph` structure, matching the current
 format exactly. Existing workflows, the ComfyUI backend, and third-party tools
 see no change.
 
-| Direction       | Format                          | Notes                                              |
-| --------------- | ------------------------------- | -------------------------------------------------- |
-| **Save/export** | Nested (current shape)          | SerializationSystem walks scope tree               |
-| **Load/import** | Nested (current) or future flat | Migration: normalize to store-backed state on load |
+| Direction       | Format                          | Notes                                      |
+| --------------- | ------------------------------- | ------------------------------------------ |
+| **Save/export** | Nested (current shape)          | SerializationSystem walks scope tree       |
+| **Load/import** | Nested (current) or future flat | Migration: normalize to flat World on load |
 
 The migration pattern: load any supported format and normalize to the internal
 model. The system accepts old formats indefinitely but produces the current
@@ -488,7 +486,7 @@ format on save.
 
 | Context              | Identity                                                   | Example                            |
 | -------------------- | ---------------------------------------------------------- | ---------------------------------- |
-| **Internal (store)** | `WidgetId` composite string                                | `'graphId:42:seed' as WidgetId`    |
+| **Internal (World)** | `WidgetEntityId` (opaque branded number)                   | `42 as WidgetEntityId`             |
 | **Serialized**       | Position in `widgets_values[]` + name from node definition | `widgets_values[2]` → third widget |
 
 On save: the `SerializationSystem` queries `WidgetIdentity.name` and
@@ -496,7 +494,7 @@ On save: the `SerializationSystem` queries `WidgetIdentity.name` and
 order.
 
 On load: widget values are matched by name against the node definition's input
-specs, then registered in `WidgetValueStore` under their `WidgetId`.
+specs, then assigned `WidgetEntityId`s from the global counter.
 
 This is the existing contract, preserved exactly.
 
@@ -555,7 +553,7 @@ This document proposes or surfaces the following changes to
 | Entity taxonomy     | 7 kinds including `SubgraphEntityId`                                     | 6 kinds — subgraph is a node with `SubgraphStructure` component                 |
 | `SubgraphEntityId`  | `string & { __brand: 'SubgraphEntityId' }`                               | Eliminated; replaced by `GraphId` scope identifier                              |
 | Subgraph components | `SubgraphStructure`, `SubgraphMeta` listed as separate-entity components | Become node components on SubgraphNode entities                                 |
-| Storage structure   | Implied per-graph containment                                            | Dedicated stores with `graphScope`-tagged entries; no single registry           |
+| World structure     | Implied per-graph containment                                            | Flat World with `graphScope` tags; one World per workflow                       |
 | Acyclicity          | Not addressed                                                            | DAG invariant on `SubgraphStructure.graphId` references, enforced on mutation   |
 | Boundary model      | Deferred                                                                 | Typed interface contracts on `SubgraphStructure`; no virtual nodes or magic IDs |
 | Widget promotion    | Treated as a given feature to migrate                                    | ADR 0009 chooses Candidate A: promoted value widgets are linked inputs          |

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@comfyorg/comfyui-frontend",
-  "version": "1.47.5",
+  "version": "1.47.3",
   "private": true,
   "description": "Official front-end implementation of ComfyUI",
   "homepage": "https://comfy.org",

packages/design-system/src/css/style.css

@@ -13,7 +13,10 @@
 @plugin "./lucideStrokePlugin.js";
 
 /* Safelist dynamic comfy icons for node library folders */
-@source inline("icon-[comfy--{ai-model,anthropic,bfl,bria,bytedance,bytedance-mono,claude,comfy-logo,credits,elevenlabs,extensions-blocks,file-output,gemini,gemini-mono,grok,hitpaw,ideogram,image-ai-edit,kling,ltxv,luma,magnific,mask,meshy,minimax,moonvalley-marey,node,openai,pin,pixverse,play,recraft,reve,rodin,runway,sora,stability-ai,template,tencent,topaz,tripo,veo,vidu,wan,wavespeed,workflow,quiver}]");
+@source inline("icon-[comfy--{ai-model,anthropic,bfl,bria,bytedance,bytedance-mono,comfy-logo,credits,elevenlabs,extensions-blocks,file-output,gemini,gemini-mono,grok,hitpaw,ideogram,image-ai-edit,kling,ltxv,luma,magnific,mask,meshy,minimax,moonvalley-marey,node,openai,pin,pixverse,play,recraft,reve,rodin,runway,sora,stability-ai,template,tencent,topaz,tripo,veo,vidu,wan,wavespeed,workflow,quiver}]");
+
+/* Safelist dynamic comfy icons for essential nodes (kebab-case of node names) */
+@source inline("icon-[comfy--{save-image,load-video,save-video,load-3-d,save-glb,image-batch,batch-images-node,image-crop,image-scale,image-rotate,image-blur,image-invert,canny,recraft-remove-background-node,kling-lip-sync-audio-to-video-node,load-audio,save-audio,stability-text-to-audio,lora-loader,lora-loader-model-only,primitive-string-multiline,get-video-components,video-slice,tencent-text-to-model-node,tencent-image-to-model-node,open-ai-chat-node,preview-image,image-and-mask-preview,layer-mask-mask-preview,mask-preview,image-preview-from-latent,i-tools-preview-image,i-tools-compare-image,canny-to-image,image-edit,text-to-image,pose-to-image,depth-to-video,image-to-image,canny-to-video,depth-to-image,image-to-video,pose-to-video,text-to-video,image-inpainting,image-outpainting}]");
 
 @custom-variant touch (@media (hover: none));
 
@@ -49,8 +52,6 @@
   --color-gold-500: #fdab34;
   --color-gold-600: #fd9903;
 
-  --color-credit: #fabc25;
-
   --color-coral-500: #f75951;
   --color-coral-600: #e04e48;
   --color-coral-700: #b33a3a;
@@ -235,8 +236,6 @@
   --secondary-background: var(--color-smoke-200);
   --secondary-background-hover: var(--color-smoke-400);
   --secondary-background-selected: var(--color-smoke-600);
-  --tertiary-background: var(--color-smoke-400);
-  --tertiary-background-hover: var(--color-smoke-500);
   --base-background: var(--color-white);
   --primary-background: var(--color-azure-400);
   --primary-background-hover: var(--color-cobalt-800);
@@ -385,8 +384,6 @@
   --secondary-background: var(--color-charcoal-600);
   --secondary-background-hover: var(--color-charcoal-400);
   --secondary-background-selected: var(--color-charcoal-200);
-  --tertiary-background: var(--color-charcoal-400);
-  --tertiary-background-hover: var(--color-charcoal-300);
   --base-background: var(--color-charcoal-800);
   --primary-background: var(--color-azure-600);
   --primary-background-hover: var(--color-azure-400);
@@ -557,8 +554,6 @@
   --color-secondary-background: var(--secondary-background);
   --color-secondary-background-hover: var(--secondary-background-hover);
   --color-secondary-background-selected: var(--secondary-background-selected);
-  --color-tertiary-background: var(--tertiary-background);
-  --color-tertiary-background-hover: var(--tertiary-background-hover);
   --color-primary-background: var(--primary-background);
   --color-primary-background-hover: var(--primary-background-hover);
   --color-destructive-background: var(--destructive-background);

packages/design-system/src/icons/3d-decomp.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M3.30005 7L7.65005 9.5M12 12L12 22M12 12L16.35 9.5M12 12L7.65005 9.5M20.7001 7L16.35 9.5M16.35 9.5V19.8156M16.35 9.5L7.5 4.2699M7.5 4.2699L11 2.2699C11.304 2.09437 11.6489 2.00195 12 2.00195C12.3511 2.00195 12.696 2.09437 13 2.2699L16.5 4.2699L20 6.2699C20.3037 6.44526 20.556 6.69742 20.7315 7.00106C20.9071 7.30471 20.9996 7.64918 21 7.9999V15.9999C20.9996 16.3506 20.9071 16.6951 20.7315 16.9987C20.556 17.3024 20.3037 17.5545 20 17.7299L16.35 19.8156L13 21.7299C12.696 21.9054 12.3511 21.9979 12 21.9979C11.6489 21.9979 11.304 21.9054 11 21.7299L7.65005 19.8156L4 17.7299C3.69626 17.5545 3.44398 17.3024 3.26846 16.9987C3.09294 16.6951 3.00036 16.3506 3 15.9999V7.9999C3.00036 7.64918 3.09294 7.30471 3.26846 7.00106C3.44398 6.69742 3.69626 6.44526 4 6.2699L7.5 4.2699ZM7.65005 9.5V19.8156M7.65005 9.5L16.5 4.2699" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

packages/design-system/src/icons/brightness-contrast.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M12.65 6.36397V5.71397H11.35V6.36397H12H12.65ZM11.35 17.6777C11.35 18.0367 11.641 18.3277 12 18.3277C12.359 18.3277 12.65 18.0367 12.65 17.6777H12H11.35ZM17.6569 14.0049L18.2695 14.222L17.6569 14.0049ZM17.6586 10L18.2714 9.78339L17.6586 10ZM16.6114 15.8388L17.1107 16.255L16.6114 15.8388ZM12.65 20.5C12.65 20.141 12.359 19.85 12 19.85C11.641 19.85 11.35 20.141 11.35 20.5H12H12.65ZM11.35 22C11.35 22.359 11.641 22.65 12 22.65C12.359 22.65 12.65 22.359 12.65 22H12H11.35ZM12.65 2C12.65 1.64101 12.359 1.35 12 1.35C11.641 1.35 11.35 1.64101 11.35 2H12H12.65ZM11.35 3.5C11.35 3.85899 11.641 4.15 12 4.15C12.359 4.15 12.65 3.85899 12.65 3.5H12H11.35ZM20.5 11.35C20.141 11.35 19.85 11.641 19.85 12C19.85 12.359 20.141 12.65 20.5 12.65V12V11.35ZM22 12.65C22.359 12.65 22.65 12.359 22.65 12C22.65 11.641 22.359 11.35 22 11.35V12V12.65ZM2 11.35C1.64101 11.35 1.35 11.641 1.35 12C1.35 12.359 1.64101 12.65 2 12.65V12V11.35ZM3.5 12.65C3.85899 12.65 4.15 12.359 4.15 12C4.15 11.641 3.85899 11.35 3.5 11.35V12V12.65ZM18.47 17.5508C18.2162 17.2969 17.8046 17.2969 17.5508 17.5508C17.2969 17.8046 17.2969 18.2162 17.5508 18.47L18.0104 18.0104L18.47 17.5508ZM18.6114 19.5307C18.8653 19.7845 19.2768 19.7845 19.5307 19.5307C19.7845 19.2768 19.7845 18.8653 19.5307 18.6114L19.0711 19.0711L18.6114 19.5307ZM5.38855 4.46931C5.13471 4.21547 4.72315 4.21547 4.46931 4.46931C4.21547 4.72315 4.21547 5.13471 4.46931 5.38855L4.92893 4.92893L5.38855 4.46931ZM5.52997 6.44921C5.78381 6.70305 6.19537 6.70305 6.44921 6.44921C6.70305 6.19537 6.70305 5.78381 6.44921 5.52997L5.98959 5.98959L5.52997 6.44921ZM6.44921 18.47C6.70305 18.2162 6.70305 17.8046 6.44921 17.5508C6.19537 17.2969 5.78382 17.2969 5.52997 17.5508L5.98959 18.0104L6.44921 18.47ZM4.46931 18.6114C4.21547 18.8653 4.21547 19.2768 4.46931 19.5307C4.72315 19.7845 5.13471 19.7845 5.38855 19.5307L4.92893 19.0711L4.46931 18.6114ZM19.5307 5.38855C19.7845 5.13471 19.7845 4.72315 19.5307 4.46931C19.2768 4.21547 18.8653 4.21547 18.6114 4.46931L19.0711 4.92893L19.5307 5.38855ZM17.5508 5.52997C17.2969 5.78381 17.2969 6.19537 17.5508 6.44921C17.8046 6.70305 18.2162 6.70305 18.47 6.44921L18.0104 5.98959L17.5508 5.52997ZM12 18V17.35C9.04528 17.35 6.65 14.9547 6.65 12H6H5.35C5.35 15.6727 8.32731 18.65 12 18.65V18ZM6 12H6.65C6.65 9.04528 9.04528 6.65 12 6.65V6V5.35C8.32731 5.35 5.35 8.32731 5.35 12H6ZM18 12H17.35C17.35 12.6281 17.242 13.2296 17.0442 13.7878L17.6569 14.0049L18.2695 14.222C18.5161 13.5264 18.65 12.7781 18.65 12H18ZM12 14L11.9994 14.65L17.6563 14.6549L17.6569 14.0049L17.6574 13.3549L12.0006 13.35L12 14ZM12 12H11.35V14H12H12.65V12H12ZM12 12V12.65H18V12V11.35H12V12ZM12 10H11.35V12H12H12.65V10H12ZM17.6586 10L17.0457 10.2166C17.2426 10.7736 17.35 11.3735 17.35 12H18H18.65C18.65 11.2239 18.5168 10.4776 18.2714 9.78339L17.6586 10ZM12 10V10.65H17.6586V10V9.35H12V10ZM12 14H11.35V15.8388H12H12.65V14H12ZM12 15.8388H11.35V17.6777H12H12.65V15.8388H12ZM17.6569 14.0049L17.0442 13.7878C16.8311 14.3891 16.5132 14.9414 16.1121 15.4227L16.6114 15.8388L17.1107 16.255C17.6087 15.6575 18.0041 14.9708 18.2695 14.222L17.6569 14.0049ZM16.6114 15.8388L16.1121 15.4227C15.1297 16.6015 13.6525 17.35 12 17.35V18V18.65C14.0546 18.65 15.8919 17.7175 17.1107 16.255L16.6114 15.8388ZM12 15.8388V16.4888H16.6114V15.8388V15.1888H12V15.8388ZM12 6.36397H11.35V8.18199H12H12.65V6.36397H12ZM12 8.18199H11.35V10H12H12.65V8.18199H12ZM12 6V6.65C13.6612 6.65 15.1452 7.40634 16.1275 8.59587L16.6287 8.18199L17.1299 7.7681C15.9112 6.29234 14.0654 5.35 12 5.35V6ZM16.6287 8.18199L16.1275 8.59587C16.5223 9.07398 16.8353 9.62135 17.0457 10.2166L17.6586 10L18.2714 9.78339C18.0094 9.0421 17.62 8.36161 17.1299 7.7681L16.6287 8.18199ZM12 8.18199V8.83199H16.6287V8.18199V7.53199H12V8.18199ZM12 20.5H11.35V22H12H12.65V20.5H12ZM12 2H11.35V3.5H12H12.65V2H12ZM20.5 12V12.65H22V12V11.35H20.5V12ZM2 12V12.65H3.5V12V11.35H2V12ZM18.0104 18.0104L17.5508 18.47L18.6114 19.5307L19.0711 19.0711L19.5307 18.6114L18.47 17.5508L18.0104 18.0104ZM4.92893 4.92893L4.46931 5.38855L5.52997 6.44921L5.98959 5.98959L6.44921 5.52997L5.38855 4.46931L4.92893 4.92893ZM5.98959 18.0104L5.52997 17.5508L4.46931 18.6114L4.92893 19.0711L5.38855 19.5307L6.44921 18.47L5.98959 18.0104ZM19.0711 4.92893L18.6114 4.46931L17.5508 5.52997L18.0104 5.98959L18.47 6.44921L19.5307 5.38855L19.0711 4.92893Z" fill="white"/>
-</svg>

packages/design-system/src/icons/canny-to-image.svg

@@ -1,3 +1,3 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M22 18L19.9427 15.9426C19.6926 15.6927 19.3536 15.5522 19 15.5522C18.6464 15.5522 18.3074 15.6927 18.0573 15.9426L12 22M10 17V20.6667C10 21.403 10.597 22 11.3333 22H20.6667C21.403 22 22 21.403 22 20.6667V11.3333C22 10.597 21.403 10 20.6667 10H17M12 13.9666C12 12.9057 11.5786 11.8883 10.8284 11.1381C10.0783 10.388 9.06087 9.96655 8 9.96655C6.93913 9.96655 5.92172 10.388 5.17157 11.1381C4.42143 11.8883 4 12.9057 4 13.9666M5 18L7 20L5 22M7 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V17M9.41415 8.04751C10.1952 7.26647 10.1952 6.00014 9.41415 5.21909C8.6331 4.43804 7.36677 4.43804 6.58572 5.21909C5.80467 6.00014 5.80467 7.26647 6.58572 8.04751C7.36677 8.82856 8.6331 8.82856 9.41415 8.04751ZM3.33333 1.96655H12.6667C13.403 1.96655 14 2.56351 14 3.29989V12.6332C14 13.3696 13.403 13.9666 12.6667 13.9666H3.33333C2.59695 13.9666 2 13.3696 2 12.6332V3.29989C2 2.56351 2.59695 1.96655 3.33333 1.96655Z" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M22 18L19.9427 15.9426C19.6926 15.6927 19.3536 15.5522 19 15.5522C18.6464 15.5522 18.3074 15.6927 18.0573 15.9426L12 22M10 17V20.6667C10 21.403 10.597 22 11.3333 22H20.6667C21.403 22 22 21.403 22 20.6667V11.3333C22 10.597 21.403 10 20.6667 10H17M12 13.9666C12 12.9057 11.5786 11.8883 10.8284 11.1381C10.0783 10.388 9.06087 9.96655 8 9.96655C6.93913 9.96655 5.92172 10.388 5.17157 11.1381C4.42143 11.8883 4 12.9057 4 13.9666M5 22L7 20M7 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V17M7 20L5 18M9.41415 8.04751C10.1952 7.26647 10.1952 6.00014 9.41415 5.21909C8.6331 4.43804 7.36677 4.43804 6.58572 5.21909C5.80467 6.00014 5.80467 7.26647 6.58572 8.04751C7.36677 8.82856 8.6331 8.82856 9.41415 8.04751ZM3.33333 1.96655H12.6667C13.403 1.96655 14 2.56351 14 3.29989V12.6332C14 13.3696 13.403 13.9666 12.6667 13.9666H3.33333C2.59695 13.9666 2 13.3696 2 12.6332V3.29989C2 2.56351 2.59695 1.96655 3.33333 1.96655Z" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>

packages/design-system/src/icons/canny-to-video.svg

@@ -1,3 +1,3 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M10 18V20.6667C10 21.403 10.597 22 11.3333 22H20.6667C21.403 22 22 21.403 22 20.6667V11.3333C22 10.597 21.403 10 20.6667 10H18M14 17V18.6667L18 16L16.6579 15.1053M12 13.9666C12 12.9057 11.5786 11.8883 10.8284 11.1381C10.0783 10.388 9.06087 9.96655 8 9.96655C6.93913 9.96655 5.92172 10.388 5.17157 11.1381C4.42143 11.8883 4 12.9057 4 13.9666M5 18L7 20L5 22M7 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V17M9.41415 8.04751C10.1952 7.26647 10.1952 6.00014 9.41415 5.21909C8.6331 4.43804 7.36677 4.43804 6.58572 5.21909C5.80467 6.00014 5.80467 7.26647 6.58572 8.04751C7.36677 8.82856 8.6331 8.82856 9.41415 8.04751ZM3.33333 1.96655H12.6667C13.403 1.96655 14 2.56351 14 3.29989V12.6332C14 13.3696 13.403 13.9666 12.6667 13.9666H3.33333C2.59695 13.9666 2 13.3696 2 12.6332V3.29989C2 2.56351 2.59695 1.96655 3.33333 1.96655Z" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M10 18V20.6667C10 21.403 10.597 22 11.3333 22H20.6667C21.403 22 22 21.403 22 20.6667V11.3333C22 10.597 21.403 10 20.6667 10H18M14 17V18.6667L18 16L16.6579 15.1053M12 13.9666C12 12.9057 11.5786 11.8883 10.8284 11.1381C10.0783 10.388 9.06087 9.96655 8 9.96655C6.93913 9.96655 5.92172 10.388 5.17157 11.1381C4.42143 11.8883 4 12.9057 4 13.9666M5 22L7 20M7 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V17M7 20L5 18M9.41415 8.04751C10.1952 7.26647 10.1952 6.00014 9.41415 5.21909C8.6331 4.43804 7.36677 4.43804 6.58572 5.21909C5.80467 6.00014 5.80467 7.26647 6.58572 8.04751C7.36677 8.82856 8.6331 8.82856 9.41415 8.04751ZM3.33333 1.96655H12.6667C13.403 1.96655 14 2.56351 14 3.29989V12.6332C14 13.3696 13.403 13.9666 12.6667 13.9666H3.33333C2.59695 13.9666 2 13.3696 2 12.6332V3.29989C2 2.56351 2.59695 1.96655 3.33333 1.96655Z" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>

packages/design-system/src/icons/channels.svg

@@ -1,5 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M18 9C18 12.3137 15.3137 15 12 15C8.68629 15 6 12.3137 6 9C6 5.68629 8.68629 3 12 3C15.3137 3 18 5.68629 18 9Z" stroke="white" stroke-width="1.3"/>
-<path d="M14.5 15C14.5 18.3137 11.8137 21 8.5 21C5.18629 21 2.5 18.3137 2.5 15C2.5 11.6863 5.18629 9 8.5 9C11.8137 9 14.5 11.6863 14.5 15Z" stroke="white" stroke-width="1.3"/>
-<path d="M21.5 15C21.5 18.3137 18.8137 21 15.5 21C12.1863 21 9.5 18.3137 9.5 15C9.5 11.6863 12.1863 9 15.5 9C18.8137 9 21.5 11.6863 21.5 15Z" stroke="white" stroke-width="1.3"/>
-</svg>

packages/design-system/src/icons/chromatic-aberration.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M10.6154 18.8127C10.0968 18.9352 9.55598 19 9 19C5.13401 19 2 15.866 2 12C2 8.13401 5.13401 5 9 5C9.55598 5 10.0968 5.06482 10.6154 5.18731M13.3846 18.8127C13.9032 18.9352 14.444 19 15 19C18.866 19 22 15.866 22 12C22 8.13401 18.866 5 15 5C14.444 5 13.9032 5.06482 13.3846 5.18731M19 12C19 15.866 15.866 19 12 19C8.13401 19 5 15.866 5 12C5 8.13401 8.13401 5 12 5C15.866 5 19 8.13401 19 12Z" stroke="white" stroke-width="1.3"/>
-</svg>

packages/design-system/src/icons/claude.svg

@@ -1 +0,0 @@
-<svg height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Claude</title><path d="M4.709 15.955l4.72-2.647.08-.23-.08-.128H9.2l-.79-.048-2.698-.073-2.339-.097-2.266-.122-.571-.121L0 11.784l.055-.352.48-.321.686.06 1.52.103 2.278.158 1.652.097 2.449.255h.389l.055-.157-.134-.098-.103-.097-2.358-1.596-2.552-1.688-1.336-.972-.724-.491-.364-.462-.158-1.008.656-.722.881.06.225.061.893.686 1.908 1.476 2.491 1.833.365.304.145-.103.019-.073-.164-.274-1.355-2.446-1.446-2.49-.644-1.032-.17-.619a2.97 2.97 0 01-.104-.729L6.283.134 6.696 0l.996.134.42.364.62 1.414 1.002 2.229 1.555 3.03.456.898.243.832.091.255h.158V9.01l.128-1.706.237-2.095.23-2.695.08-.76.376-.91.747-.492.584.28.48.685-.067.444-.286 1.851-.559 2.903-.364 1.942h.212l.243-.242.985-1.306 1.652-2.064.73-.82.85-.904.547-.431h1.033l.76 1.129-.34 1.166-1.064 1.347-.881 1.142-1.264 1.7-.79 1.36.073.11.188-.02 2.856-.606 1.543-.28 1.841-.315.833.388.091.395-.328.807-1.969.486-2.309.462-3.439.813-.042.03.049.061 1.549.146.662.036h1.622l3.02.225.79.522.474.638-.079.485-1.215.62-1.64-.389-3.829-.91-1.312-.329h-.182v.11l1.093 1.068 2.006 1.81 2.509 2.33.127.578-.322.455-.34-.049-2.205-1.657-.851-.747-1.926-1.62h-.128v.17l.444.649 2.345 3.521.122 1.08-.17.353-.608.213-.668-.122-1.374-1.925-1.415-2.167-1.143-1.943-.14.08-.674 7.254-.316.37-.729.28-.607-.461-.322-.747.322-1.476.389-1.924.315-1.53.286-1.9.17-.632-.012-.042-.14.018-1.434 1.967-2.18 2.945-1.726 1.845-.414.164-.717-.37.067-.662.401-.589 2.388-3.036 1.44-1.882.93-1.086-.006-.158h-.055L4.132 18.56l-1.13.146-.487-.456.061-.746.231-.243 1.908-1.312-.006.006z" fill="#D97757" fill-rule="nonzero"></path></svg>

packages/design-system/src/icons/depth-to-image.svg

@@ -1,3 +1,3 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M22 18L19.9427 15.9426C19.6926 15.6927 19.3536 15.5522 19 15.5522C18.6464 15.5522 18.3074 15.6927 18.0573 15.9426L12 22M10 17V20.6667C10 21.403 10.597 22 11.3333 22H20.6667C21.403 22 22 21.403 22 20.6667V11.3333C22 10.597 21.403 10 20.6667 10H17M11.3461 4.65384C11.1524 4.46662 10.9061 4.30769 10.6154 4.30769H3.07692C2.77116 4.30769 2.49515 4.43512 2.29912 4.63977C2.11384 4.8332 2 5.09561 2 5.38461V12.9231C2 13.5178 2.48215 14 3.07692 14H10.6154C10.8974 14 11.1541 13.8916 11.3461 13.7141C11.559 13.5174 11.6923 13.2358 11.6923 12.9231V5.38461C11.6923 5.08055 11.5488 4.84967 11.3461 4.65384ZM11.3461 13.7141L13.6538 11.4064C13.8667 11.2097 14 10.9281 14 10.6154V3.07692C14 2.77918 13.8792 2.50967 13.6839 2.31473C13.4891 2.12025 13.2201 2 12.9231 2H5.38463C5.07191 2 4.79033 2.13329 4.59359 2.34615L2.29912 4.63977M11.3461 4.65384L13.6839 2.31473M5 18L7 20L5 22M7 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V17" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M22 18L19.9427 15.9426C19.6926 15.6927 19.3536 15.5522 19 15.5522C18.6464 15.5522 18.3074 15.6927 18.0573 15.9426L12 22M10 17V20.6667C10 21.403 10.597 22 11.3333 22H20.6667C21.403 22 22 21.403 22 20.6667V11.3333C22 10.597 21.403 10 20.6667 10H17M2.29912 4.63977C2.11384 4.8332 2 5.09561 2 5.38461V12.9231C2 13.5178 2.48215 14 3.07692 14H10.6154C10.8974 14 11.1541 13.8916 11.3461 13.7141M2.29912 4.63977C2.49515 4.43512 2.77116 4.30769 3.07692 4.30769H10.6154C10.9061 4.30769 11.1524 4.46662 11.3461 4.65384M2.29912 4.63977L4.59359 2.34615C4.79033 2.13329 5.07191 2 5.38463 2H12.9231C13.2201 2 13.4891 2.12025 13.6839 2.31473M11.3461 13.7141C11.559 13.5174 11.6923 13.2358 11.6923 12.9231V5.38461C11.6923 5.08055 11.5488 4.84967 11.3461 4.65384M11.3461 13.7141L13.6538 11.4064C13.8667 11.2097 14 10.9281 14 10.6154V3.07692C14 2.77918 13.8792 2.50967 13.6839 2.31473M11.3461 4.65384L13.6839 2.31473M5 22L7 20M7 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V17M7 20L5 18" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>

packages/design-system/src/icons/depth-to-video.svg

@@ -1,3 +1,3 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M17.5 10H20.6667C21.403 10 22 10.597 22 11.3333V20.6667C22 21.403 21.403 22 20.6667 22H11.3333C10.597 22 10 21.403 10 20.6667V17M14 15.5V18.6667L18 16L15 14M11.3461 4.65384C11.1524 4.46662 10.9061 4.30769 10.6154 4.30769H3.07692C2.77116 4.30769 2.49515 4.43512 2.29912 4.63977C2.11384 4.8332 2 5.09561 2 5.38461V12.9231C2 13.5178 2.48215 14 3.07692 14H10.6154C10.8974 14 11.1541 13.8916 11.3461 13.7141C11.559 13.5174 11.6923 13.2358 11.6923 12.9231V5.38461C11.6923 5.08055 11.5488 4.84967 11.3461 4.65384ZM11.3461 13.7141L13.6538 11.4064C13.8667 11.2097 14 10.9281 14 10.6154V3.07692C14 2.77918 13.8792 2.50967 13.6839 2.31473C13.4891 2.12025 13.2201 2 12.9231 2H5.38463C5.07191 2 4.79033 2.13329 4.59359 2.34615L2.29912 4.63977M11.3461 4.65384L13.6839 2.31473M5 18L7 20L5 22M7 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V17" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M17.5 10H20.6667C21.403 10 22 10.597 22 11.3333V20.6667C22 21.403 21.403 22 20.6667 22H11.3333C10.597 22 10 21.403 10 20.6667V17M14 15.5V18.6667L18 16L15 14M2.29912 4.63977C2.11384 4.8332 2 5.09561 2 5.38461V12.9231C2 13.5178 2.48215 14 3.07692 14H10.6154C10.8974 14 11.1541 13.8916 11.3461 13.7141M2.29912 4.63977C2.49515 4.43512 2.77116 4.30769 3.07692 4.30769H10.6154C10.9061 4.30769 11.1524 4.46662 11.3461 4.65384M2.29912 4.63977L4.59359 2.34615C4.79033 2.13329 5.07191 2 5.38463 2H12.9231C13.2201 2 13.4891 2.12025 13.6839 2.31473M11.3461 13.7141C11.559 13.5174 11.6923 13.2358 11.6923 12.9231V5.38461C11.6923 5.08055 11.5488 4.84967 11.3461 4.65384M11.3461 13.7141L13.6538 11.4064C13.8667 11.2097 14 10.9281 14 10.6154V3.07692C14 2.77918 13.8792 2.50967 13.6839 2.31473M11.3461 4.65384L13.6839 2.31473M5 22L7 20M7 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V17M7 20L5 18" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>

packages/design-system/src/icons/dial.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M18.8 12H20M4 12H5.2M16.8083 16.8083L17.6569 17.6569M6.34315 6.34315L7.19167 7.19167M7.1907 16.8083L6.34217 17.6569M17.6559 6.34315L16.8074 7.19167M12 18.8V20M12 4V5.2M11.4448 10.6596L9.7218 6.49994M16.2426 7.75736C18.5858 10.1005 18.5858 13.8995 16.2426 16.2426C13.8995 18.5858 10.1005 18.5858 7.75736 16.2426C5.41421 13.8995 5.41421 10.1005 7.75736 7.75736C10.1005 5.41421 13.8995 5.41421 16.2426 7.75736ZM18.0104 5.98959C21.3299 9.30905 21.3299 14.691 18.0104 18.0104C14.691 21.3299 9.30905 21.3299 5.98959 18.0104C2.67014 14.691 2.67014 9.30905 5.98959 5.98959C9.30905 2.67014 14.691 2.67014 18.0104 5.98959Z" stroke="white" stroke-width="1.3" stroke-linecap="round"/>
-</svg>

packages/design-system/src/icons/frames-to-video.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M10 18V20.6667C10 21.403 10.597 22 11.3333 22H20.6667C21.403 22 22 21.403 22 20.6667V11.3333C22 10.597 21.403 10 20.6667 10H18M14 17V18.6667L18 16L16.6579 15.1053M5 18L7 20L5 22M7 20H4C3.46957 20 2.96086 19.7893 2.58579 19.4142C2.21071 19.0391 2 18.5304 2 18V17M2 11.3333H8M5 14V11.3333M8 14L8 11.3333M8 2H13C13.5523 2 14 2.44772 14 3L14 4.66667V11.3333L14 13C14 13.5523 13.5523 14 13 14H8L3 14C2.44771 14 2 13.5523 2 13V3C2 2.44771 2.44772 2 3 2L8 2ZM8 14V2M8 2L8 4.66667M2 4.66667H8M5 4.66667V2M8 4.66667V11.3333M8 4.66667H14M8 11.3333H14M11 14V11.3333M11 4.66667V2" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

packages/design-system/src/icons/glow.svg

@@ -1,4 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M18.0104 18.0104C21.3299 14.691 21.3299 9.30905 18.0104 5.98959C14.691 2.67014 9.30905 2.67014 5.98959 5.98959C2.67014 9.30905 2.67014 14.691 5.98959 18.0104C9.30905 21.3299 14.691 21.3299 18.0104 18.0104Z" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-dasharray="1 2"/>
-<path d="M20.5 12H22M2 12H3.5M18.0103 18.0103L19.778 19.778M4.22168 4.22168L5.98945 5.98945M5.98974 18.0103L4.22197 19.778M19.7783 4.22168L18.0106 5.98945M12 20.5V22M12 2V3.5M16.2426 7.75736C18.5858 10.1005 18.5858 13.8995 16.2426 16.2426C13.8995 18.5858 10.1005 18.5858 7.75736 16.2426C5.41421 13.8995 5.41421 10.1005 7.75736 7.75736C10.1005 5.41421 13.8995 5.41421 16.2426 7.75736Z" stroke="white" stroke-width="1.3" stroke-linecap="round"/>
-</svg>

packages/design-system/src/icons/grain.svg

@@ -1,4 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M19 3H5C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3Z" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M13.6504 18.3252C13.8297 18.3254 13.9746 18.471 13.9746 18.6504C13.9744 18.8296 13.8296 18.9744 13.6504 18.9746C13.471 18.9746 13.3254 18.8297 13.3252 18.6504C13.3252 18.4709 13.4709 18.3252 13.6504 18.3252ZM17.6504 17.8252C17.8297 17.8254 17.9746 17.971 17.9746 18.1504C17.9744 18.3296 17.8296 18.4744 17.6504 18.4746C17.471 18.4746 17.3254 18.3297 17.3252 18.1504C17.3252 17.9709 17.4709 17.8252 17.6504 17.8252ZM7.65039 17.3252C7.8297 17.3254 7.97461 17.471 7.97461 17.6504C7.9744 17.8296 7.82957 17.9744 7.65039 17.9746C7.47103 17.9746 7.32541 17.8297 7.3252 17.6504C7.3252 17.4709 7.4709 17.3252 7.65039 17.3252ZM11.6504 16.3252C11.8297 16.3254 11.9746 16.471 11.9746 16.6504C11.9744 16.8296 11.8296 16.9744 11.6504 16.9746C11.471 16.9746 11.3254 16.8297 11.3252 16.6504C11.3252 16.4709 11.4709 16.3252 11.6504 16.3252ZM15.6504 16.3252C15.8297 16.3254 15.9746 16.471 15.9746 16.6504C15.9744 16.8296 15.8296 16.9744 15.6504 16.9746C15.471 16.9746 15.3254 16.8297 15.3252 16.6504C15.3252 16.4709 15.4709 16.3252 15.6504 16.3252ZM18.6504 15.8252C18.8297 15.8254 18.9746 15.971 18.9746 16.1504C18.9744 16.3296 18.8296 16.4744 18.6504 16.4746C18.471 16.4746 18.3254 16.3297 18.3252 16.1504C18.3252 15.9709 18.4709 15.8252 18.6504 15.8252ZM9.65039 14.3252C9.8297 14.3254 9.97461 14.471 9.97461 14.6504C9.9744 14.8296 9.82957 14.9744 9.65039 14.9746C9.47103 14.9746 9.32541 14.8297 9.3252 14.6504C9.3252 14.4709 9.4709 14.3252 9.65039 14.3252ZM13.6504 14.3252C13.8297 14.3254 13.9746 14.471 13.9746 14.6504C13.9744 14.8296 13.8296 14.9744 13.6504 14.9746C13.471 14.9746 13.3254 14.8297 13.3252 14.6504C13.3252 14.4709 13.4709 14.3252 13.6504 14.3252ZM17.6504 13.8252C17.8297 13.8254 17.9746 13.971 17.9746 14.1504C17.9744 14.3296 17.8296 14.4744 17.6504 14.4746C17.471 14.4746 17.3254 14.3297 17.3252 14.1504C17.3252 13.9709 17.4709 13.8252 17.6504 13.8252ZM15.6504 12.3252C15.8297 12.3254 15.9746 12.471 15.9746 12.6504C15.9744 12.8296 15.8296 12.9744 15.6504 12.9746C15.471 12.9746 15.3254 12.8297 15.3252 12.6504C15.3252 12.4709 15.4709 12.3252 15.6504 12.3252ZM18.6504 11.8252C18.8297 11.8254 18.9746 11.971 18.9746 12.1504C18.9744 12.3296 18.8296 12.4744 18.6504 12.4746C18.471 12.4746 18.3254 12.3297 18.3252 12.1504C18.3252 11.9709 18.4709 11.8252 18.6504 11.8252ZM11.6504 11.3252C11.8297 11.3254 11.9746 11.471 11.9746 11.6504C11.9744 11.8296 11.8296 11.9744 11.6504 11.9746C11.471 11.9746 11.3254 11.8297 11.3252 11.6504C11.3252 11.4709 11.4709 11.3252 11.6504 11.3252ZM17.6504 9.8252C17.8297 9.82541 17.9746 9.97103 17.9746 10.1504C17.9744 10.3296 17.8296 10.4744 17.6504 10.4746C17.471 10.4746 17.3254 10.3297 17.3252 10.1504C17.3252 9.9709 17.4709 9.8252 17.6504 9.8252ZM7.65039 9.3252C7.8297 9.32541 7.97461 9.47103 7.97461 9.65039C7.9744 9.82957 7.82957 9.9744 7.65039 9.97461C7.47103 9.97461 7.32541 9.8297 7.3252 9.65039C7.3252 9.4709 7.4709 9.3252 7.65039 9.3252ZM13.6504 9.3252C13.8297 9.32541 13.9746 9.47103 13.9746 9.65039C13.9744 9.82957 13.8296 9.9744 13.6504 9.97461C13.471 9.97461 13.3254 9.8297 13.3252 9.65039C13.3252 9.4709 13.4709 9.3252 13.6504 9.3252ZM18.6504 7.8252C18.8297 7.82541 18.9746 7.97103 18.9746 8.15039C18.9744 8.32957 18.8296 8.4744 18.6504 8.47461C18.471 8.47461 18.3254 8.3297 18.3252 8.15039C18.3252 7.9709 18.4709 7.8252 18.6504 7.8252ZM11.6504 7.3252C11.8297 7.32541 11.9746 7.47103 11.9746 7.65039C11.9744 7.82957 11.8296 7.9744 11.6504 7.97461C11.471 7.97461 11.3254 7.8297 11.3252 7.65039C11.3252 7.4709 11.4709 7.3252 11.6504 7.3252ZM15.6504 7.3252C15.8297 7.32541 15.9746 7.47103 15.9746 7.65039C15.9744 7.82957 15.8296 7.9744 15.6504 7.97461C15.471 7.97461 15.3254 7.8297 15.3252 7.65039C15.3252 7.4709 15.4709 7.3252 15.6504 7.3252ZM17.6504 5.8252C17.8297 5.82541 17.9746 5.97103 17.9746 6.15039C17.9744 6.32957 17.8296 6.4744 17.6504 6.47461C17.471 6.47461 17.3254 6.3297 17.3252 6.15039C17.3252 5.9709 17.4709 5.8252 17.6504 5.8252ZM9.65039 5.3252C9.8297 5.32541 9.97461 5.47103 9.97461 5.65039C9.9744 5.82957 9.82957 5.9744 9.65039 5.97461C9.47103 5.97461 9.32541 5.8297 9.3252 5.65039C9.3252 5.4709 9.4709 5.3252 9.65039 5.3252ZM13.6504 5.3252C13.8297 5.32541 13.9746 5.47103 13.9746 5.65039C13.9744 5.82957 13.8296 5.9744 13.6504 5.97461C13.471 5.97461 13.3254 5.8297 13.3252 5.65039C13.3252 5.4709 13.4709 5.3252 13.6504 5.3252Z" stroke="white" stroke-width="0.65"/>
-</svg>

packages/design-system/src/icons/i-tools-compare-image.svg

@@ -1,3 +1,3 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M3 19C3 20.1046 3.79594 21 4.77778 21H11V3H4.77778C3.79594 3 3 3.89543 3 5M3 19V5M3 19C3 19.5304 3.21071 20.0391 3.58579 20.4142C3.96086 20.7893 4.46957 21 5 21M3 5C3 4.46957 3.21071 3.96086 3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3M11 1L11 23M21 15L17.9 11.9C17.5237 11.5312 17.017 11.3258 16.4901 11.3284C15.9632 11.331 15.4586 11.5415 15.086 11.914L14 13M11 16L6 21M14 3H19.1538C20.1734 3 21 3.89543 21 5V19C21 20.1046 20.1734 21 19.1538 21H14V3ZM11 9C11 10.1046 10.1046 11 9 11C7.89543 11 7 10.1046 7 9C7 7.89543 7.89543 7 9 7C10.1046 7 11 7.89543 11 9Z" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M3 19C3 20.1046 3.79594 21 4.77778 21H11V3H4.77778C3.79594 3 3 3.89543 3 5M3 19V5M3 19C3 19.5304 3.21071 20.0391 3.58579 20.4142C3.96086 20.7893 4.46957 21 5 21M3 5C3 4.46957 3.21071 3.96086 3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3M11 1L11 23M21 15L17.9 11.9C17.5237 11.5312 17.017 11.3258 16.4901 11.3284C15.9632 11.331 15.4586 11.5415 15.086 11.914L14 13M11 16L6 21M14 3H19.1538C20.1734 3 21 3.89543 21 5V19C21 20.1046 20.1734 21 19.1538 21H14V3ZM11 9C11 10.1046 10.1046 11 9 11C7.89543 11 7 10.1046 7 9C7 7.89543 7.89543 7 9 7C10.1046 7 11 7.89543 11 9Z" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>

packages/design-system/src/icons/i-tools-preview-image.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M21 14.9999L17.914 11.9139C17.5389 11.539 17.0303 11.3284 16.5 11.3284C15.9697 11.3284 15.4611 11.539 15.086 11.9139L12.6935 14.3064M14.5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3H5C3.89543 3 3 3.89543 3 5V13M11 9C11 10.1046 10.1046 11 9 11C7.89543 11 7 10.1046 7 9C7 7.89543 7.89543 7 9 7C10.1046 7 11 7.89543 11 9ZM2.03125 18.6735C1.98958 18.5613 1.98958 18.4378 2.03125 18.3255C2.43708 17.3415 3.12595 16.5001 4.01054 15.9081C4.89512 15.3161 5.93558 15 7 15C8.06442 15 9.10488 15.3161 9.98946 15.9081C10.874 16.5001 11.5629 17.3415 11.9687 18.3255C12.0104 18.4378 12.0104 18.5613 11.9687 18.6735C11.5629 19.6575 10.874 20.4989 9.98946 21.0909C9.10488 21.683 8.06442 21.999 7 21.999C5.93558 21.999 4.89512 21.683 4.01054 21.0909C3.12595 20.4989 2.43708 19.6575 2.03125 18.6735ZM8.49992 18.4995C8.49992 19.3278 7.82838 19.9994 6.99999 19.9994C6.17161 19.9994 5.50007 19.3278 5.50007 18.4995C5.50007 17.6711 6.17161 16.9995 6.99999 16.9995C7.82838 16.9995 8.49992 17.6711 8.49992 18.4995Z" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

packages/design-system/src/icons/image-and-mask-preview.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.03125 18.6735L1.42188 18.8997C1.42457 18.907 1.4274 18.9142 1.43035 18.9213L2.03125 18.6735ZM2.03125 18.3255L1.43035 18.0777C1.4274 18.0849 1.42457 18.0921 1.42188 18.0993L2.03125 18.3255ZM11.9687 18.3255L12.5781 18.0993C12.5754 18.0921 12.5726 18.0849 12.5697 18.0777L11.9687 18.3255ZM11.9687 18.6735L12.5697 18.9213C12.5726 18.9142 12.5754 18.907 12.5781 18.8997L11.9687 18.6735ZM9.54038 7.54038C9.28654 7.79422 9.28654 8.20578 9.54038 8.45962C9.79422 8.71346 10.2058 8.71346 10.4596 8.45962L10 8L9.54038 7.54038ZM15.4596 3.45962C15.7135 3.20578 15.7135 2.79422 15.4596 2.54038C15.2058 2.28654 14.7942 2.28654 14.5404 2.54038L15 3L15.4596 3.45962ZM12.5404 10.5404L12.0808 11L13 11.9192L13.4596 11.4596L13 11L12.5404 10.5404ZM20.4596 4.45962C20.7135 4.20578 20.7135 3.79422 20.4596 3.54038C20.2058 3.28654 19.7942 3.28654 19.5404 3.54038L20 4L20.4596 4.45962ZM15.5404 13.5404C15.2865 13.7942 15.2865 14.2058 15.5404 14.4596C15.7942 14.7135 16.2058 14.7135 16.4596 14.4596L16 14L15.5404 13.5404ZM21.4596 9.45962C21.7135 9.20578 21.7135 8.79422 21.4596 8.54038C21.2058 8.28654 20.7942 8.28654 20.5404 8.54038L21 9L21.4596 9.45962ZM14.5 20.35C14.141 20.35 13.85 20.641 13.85 21C13.85 21.359 14.141 21.65 14.5 21.65V21V20.35ZM2.35 13C2.35 13.359 2.64101 13.65 3 13.65C3.35899 13.65 3.65 13.359 3.65 13H3H2.35ZM2.03125 18.6735L2.64062 18.4473C2.65313 18.481 2.65313 18.518 2.64062 18.5517L2.03125 18.3255L1.42188 18.0993C1.32604 18.3575 1.32604 18.6415 1.42188 18.8997L2.03125 18.6735ZM2.03125 18.3255L2.63215 18.5733C2.9889 17.7083 3.59447 16.9687 4.37207 16.4483L4.01054 15.9081L3.649 15.3679C2.65744 16.0316 1.88526 16.9747 1.43035 18.0777L2.03125 18.3255ZM4.01054 15.9081L4.37207 16.4483C5.14968 15.9278 6.0643 15.65 7 15.65V15V14.35C5.80685 14.35 4.64056 14.7043 3.649 15.3679L4.01054 15.9081ZM7 15V15.65C7.9357 15.65 8.85032 15.9278 9.62793 16.4483L9.98946 15.9081L10.351 15.3679C9.35944 14.7043 8.19315 14.35 7 14.35V15ZM9.98946 15.9081L9.62793 16.4483C10.4055 16.9687 11.0111 17.7083 11.3678 18.5733L11.9687 18.3255L12.5697 18.0777C12.1147 16.9747 11.3426 16.0316 10.351 15.3679L9.98946 15.9081ZM11.9687 18.3255L11.3594 18.5517C11.3469 18.518 11.3469 18.481 11.3594 18.4473L11.9687 18.6735L12.5781 18.8997C12.674 18.6415 12.674 18.3575 12.5781 18.0993L11.9687 18.3255ZM11.9687 18.6735L11.3678 18.4257C11.0111 19.2907 10.4055 20.0303 9.62793 20.5508L9.98946 21.0909L10.351 21.6311C11.3426 20.9675 12.1147 20.0244 12.5697 18.9213L11.9687 18.6735ZM9.98946 21.0909L9.62793 20.5508C8.85032 21.0712 7.9357 21.349 7 21.349V21.999V22.649C8.19315 22.649 9.35944 22.2948 10.351 21.6311L9.98946 21.0909ZM7 21.999V21.349C6.0643 21.349 5.14968 21.0712 4.37207 20.5508L4.01054 21.0909L3.649 21.6311C4.64056 22.2948 5.80685 22.649 7 22.649V21.999ZM4.01054 21.0909L4.37207 20.5508C3.59447 20.0303 2.9889 19.2907 2.63215 18.4257L2.03125 18.6735L1.43035 18.9213C1.88526 20.0244 2.65744 20.9675 3.649 21.6311L4.01054 21.0909ZM8.49992 18.4995H7.84992C7.84992 18.9689 7.46939 19.3494 6.99999 19.3494V19.9994V20.6494C8.18736 20.6494 9.14992 19.6868 9.14992 18.4995H8.49992ZM6.99999 19.9994V19.3494C6.53059 19.3494 6.15007 18.9689 6.15007 18.4995H5.50007H4.85007C4.85007 19.6868 5.81262 20.6494 6.99999 20.6494V19.9994ZM5.50007 18.4995H6.15007C6.15007 18.0301 6.53059 17.6495 6.99999 17.6495V16.9995V16.3495C5.81262 16.3495 4.85007 17.3121 4.85007 18.4995H5.50007ZM6.99999 16.9995V17.6495C7.46939 17.6495 7.84992 18.0301 7.84992 18.4995H8.49992H9.14992C9.14992 17.3121 8.18736 16.3495 6.99999 16.3495V16.9995ZM10 8L10.4596 8.45962L15.4596 3.45962L15 3L14.5404 2.54038L9.54038 7.54038L10 8ZM13 11L13.4596 11.4596L20.4596 4.45962L20 4L19.5404 3.54038L12.5404 10.5404L13 11ZM16 14L16.4596 14.4596L21.4596 9.45962L21 9L20.5404 8.54038L15.5404 13.5404L16 14ZM5 3V3.65H19V3V2.35H5V3ZM19 3V3.65C19.7456 3.65 20.35 4.25442 20.35 5H21H21.65C21.65 3.53645 20.4636 2.35 19 2.35V3ZM21 5H20.35V19H21H21.65V5H21ZM21 19H20.35C20.35 19.7456 19.7456 20.35 19 20.35V21V21.65C20.4636 21.65 21.65 20.4636 21.65 19H21ZM3 5H3.65C3.65 4.25442 4.25442 3.65 5 3.65V3V2.35C3.53645 2.35 2.35 3.53645 2.35 5H3ZM19 21V20.35H14.5V21V21.65H19V21ZM3 13H3.65V5H3H2.35V13H3ZM5 3L4.54038 3.45962L20.5404 19.4596L21 19L21.4596 18.5404L5.45962 2.54038L5 3Z" fill="#8A8A8A"/>
+</svg>

packages/design-system/src/icons/image-batch.svg

@@ -1,3 +1,3 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M15 17L12.9427 14.9426C12.6926 14.6927 12.3536 14.5522 12 14.5522C11.6464 14.5522 11.3074 14.6927 11.0573 14.9426L5 21M20 15C20.5523 15 21 14.5523 21 14V5C21 4.46957 20.7893 3.96086 20.4142 3.58579C20.0391 3.21071 19.5304 3 19 3H10C9.44772 3 9 3.44772 9 4M17 18C17.5523 18 18 17.5523 18 17V8C18 7.46957 17.7893 6.96086 17.4142 6.58579C17.0391 6.21071 16.5304 6 16 6H7C6.44772 6 6 6.44772 6 7M4.33333 9H13.6667C14.403 9 15 9.59695 15 10.3333V19.6667C15 20.403 14.403 21 13.6667 21H4.33333C3.59695 21 3 20.403 3 19.6667V10.3333C3 9.59695 3.59695 9 4.33333 9ZM8.33333 13C8.33333 13.7364 7.73638 14.3333 7 14.3333C6.26362 14.3333 5.66667 13.7364 5.66667 13C5.66667 12.2636 6.26362 11.6667 7 11.6667C7.73638 11.6667 8.33333 12.2636 8.33333 13Z" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M15 17L12.9427 14.9426C12.6926 14.6927 12.3536 14.5522 12 14.5522C11.6464 14.5522 11.3074 14.6927 11.0573 14.9426L5 21M20 15C20.5523 15 21 14.5523 21 14V5C21 4.46957 20.7893 3.96086 20.4142 3.58579C20.0391 3.21071 19.5304 3 19 3H10C9.44772 3 9 3.44772 9 4M17 18C17.5523 18 18 17.5523 18 17V8C18 7.46957 17.7893 6.96086 17.4142 6.58579C17.0391 6.21071 16.5304 6 16 6H7C6.44772 6 6 6.44772 6 7M4.33333 9H13.6667C14.403 9 15 9.59695 15 10.3333V19.6667C15 20.403 14.403 21 13.6667 21H4.33333C3.59695 21 3 20.403 3 19.6667V10.3333C3 9.59695 3.59695 9 4.33333 9ZM8.33333 13C8.33333 13.7364 7.73638 14.3333 7 14.3333C6.26362 14.3333 5.66667 13.7364 5.66667 13C5.66667 12.2636 6.26362 11.6667 7 11.6667C7.73638 11.6667 8.33333 12.2636 8.33333 13Z" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>

packages/design-system/src/icons/image-blur.svg

@@ -1,3 +1,11 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M12.4292 17.4286C12.4292 17.4286 10.7681 17.4818 9.85773 16.5714C8.94733 15.661 9.00058 14.8571 9.00058 14M12 20.6429C13.5913 20.6429 15.1174 20.0107 16.2426 18.8855C17.3679 17.7603 18 16.2342 18 14.6429C18 9.5 12 4.35715 12 4.35715C12 4.35715 6 9.5 6 14.6429C6 16.2342 6.63214 17.7603 7.75736 18.8855C8.88258 20.0107 10.4087 20.6429 12 20.6429Z" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1683_13217)">
+<path d="M33.2579 14.2434C33.2579 8.04845 24.8306 0.0257698 24.4718 -0.312477C24.2037 -0.565892 23.7862 -0.561497 23.5226 -0.305153C23.1637 0.0434776 14.7439 8.30814 14.7439 14.2436C14.7439 19.3484 18.8966 23.5 24.0003 23.5C29.1067 23.5015 33.2579 19.3486 33.2579 14.2434ZM24.0015 22.1299C19.6538 22.1299 16.1165 18.5924 16.1165 14.2449C16.1165 9.63656 22.2409 2.98187 24.009 1.15676C25.7829 2.94092 31.8885 9.42993 31.8885 14.2449C31.887 18.5926 28.349 22.1299 24.0015 22.1299Z" fill="#8A8A8A"/>
+<path d="M28.4502 12.5882C28.0766 12.6482 27.8218 12.9998 27.8804 13.3733C28.1265 14.9143 27.5918 16.2605 26.0933 17.8748C25.8355 18.1516 25.8516 18.5852 26.1284 18.843C26.2603 18.9661 26.4273 19.0261 26.5943 19.0261C26.7788 19.0261 26.9619 18.9529 27.0967 18.8064C28.3037 17.5071 29.6381 15.6907 29.2339 13.1552C29.1753 12.7831 28.8222 12.5295 28.4502 12.5882Z" fill="#8A8A8A"/>
+</g>
+<defs>
+<clipPath id="clip0_1683_13217">
+<rect width="48" height="24" fill="white"/>
+</clipPath>
+</defs>
 </svg>

packages/design-system/src/icons/image-canny.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M13.2508 12.7276C12.4587 13.0908 11.5409 13.0908 10.7488 12.7276M10.7488 7.2724C11.5409 6.9092 12.4587 6.9092 13.2508 7.2724M9.27202 11.251C8.90883 10.4589 8.90883 9.54111 9.27202 8.74897M14.7272 8.74897C15.0904 9.54111 15.0904 10.4589 14.7272 11.251M6.18003 19.5412C6.06141 20.0143 6 20.504 6 21M18 21C18 20.504 17.9386 20.0143 17.82 19.5412M7 17.6833C7.21936 17.3526 7.47257 17.0421 7.75736 16.7574C8.04215 16.4726 8.35262 16.2194 8.68333 16M17 17.6833C16.7806 17.3526 16.5274 17.0421 16.2426 16.7574C15.9579 16.4726 15.6474 16.2194 15.3167 16M10.6747 15.1482C11.1062 15.0504 11.5505 15 12 15C12.4495 15 12.8938 15.0504 13.3253 15.1482M5 3H19C20.1046 3 21 3.89543 21 5V19C21 20.1046 20.1046 21 19 21H5C3.89543 21 3 20.1046 3 19V5C3 3.89543 3.89543 3 5 3Z" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

packages/design-system/src/icons/image-captioning.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M20 12L17.9427 9.94263C17.6926 9.69267 17.3536 9.55225 17 9.55225C16.6464 9.55225 16.3074 9.69267 16.0573 9.94263L10 16M5 16H3M15 18.5H3M11.0667 20.9333H3M9.33333 4H18.6667C19.403 4 20 4.59695 20 5.33333V14.6667C20 15.403 19.403 16 18.6667 16H9.33333C8.59695 16 8 15.403 8 14.6667V5.33333C8 4.59695 8.59695 4 9.33333 4ZM13.3333 8C13.3333 8.73638 12.7364 9.33333 12 9.33333C11.2636 9.33333 10.6667 8.73638 10.6667 8C10.6667 7.26362 11.2636 6.66667 12 6.66667C12.7364 6.66667 13.3333 7.26362 13.3333 8Z" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

packages/design-system/src/icons/image-collage.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M11 8.33331L9.62844 6.96175C9.46175 6.79511 9.2357 6.7015 9 6.7015C8.7643 6.7015 8.53825 6.79511 8.37156 6.96175L4.33333 11M11 18.3333L9.62844 16.9618C9.46175 16.7951 9.2357 16.7015 9 16.7015C8.7643 16.7015 8.53825 16.7951 8.37156 16.9618L4.33333 21M21 8.33331L19.6284 6.96175C19.4618 6.79511 19.2357 6.7015 19 6.7015C18.7643 6.7015 18.5382 6.79511 18.3716 6.96175L14.3333 11M21 18.3333L19.6284 16.9618C19.4618 16.7951 19.2357 16.7015 19 16.7015C18.7643 16.7015 18.5382 16.7951 18.3716 16.9618L14.3333 21M3.88889 3H10.1111C10.602 3 11 3.39797 11 3.88889V10.1111C11 10.602 10.602 11 10.1111 11H3.88889C3.39797 11 3 10.602 3 10.1111V3.88889C3 3.39797 3.39797 3 3.88889 3ZM3.88889 13H10.1111C10.602 13 11 13.398 11 13.8889V20.1111C11 20.602 10.602 21 10.1111 21H3.88889C3.39797 21 3 20.602 3 20.1111V13.8889C3 13.398 3.39797 13 3.88889 13ZM13.8889 3H20.1111C20.602 3 21 3.39797 21 3.88889V10.1111C21 10.602 20.602 11 20.1111 11H13.8889C13.398 11 13 10.602 13 10.1111V3.88889C13 3.39797 13.398 3 13.8889 3ZM13.8889 13H20.1111C20.602 13 21 13.398 21 13.8889V20.1111C21 20.602 20.602 21 20.1111 21H13.8889C13.398 21 13 20.602 13 20.1111V13.8889C13 13.398 13.398 13 13.8889 13Z" stroke="white" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

packages/design-system/src/icons/image-crop.svg

@@ -0,0 +1,3 @@
+<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18 1.2002C18.4418 1.2002 18.7998 1.55817 18.7998 2V5.2002H29C29.9941 5.2002 30.7998 6.00589 30.7998 7V17.7002H34C34.4418 17.7002 34.7998 18.0582 34.7998 18.5C34.7998 18.9418 34.4418 19.2998 34 19.2998H30.7998V22.5C30.7998 22.9418 30.4418 23.2998 30 23.2998C29.5582 23.2998 29.2002 22.9418 29.2002 22.5V19.2998H19C18.0059 19.2998 17.2002 18.4941 17.2002 17.5V6.7998H14C13.5582 6.7998 13.2002 6.44183 13.2002 6C13.2002 5.55817 13.5582 5.2002 14 5.2002H17.2002V2C17.2002 1.55817 17.5582 1.2002 18 1.2002ZM18.7998 17.5C18.7998 17.6105 18.8895 17.7002 19 17.7002H29.2002V7C29.2002 6.88954 29.1105 6.79981 29 6.7998H18.7998V17.5Z" fill="#8A8A8A"/>
+</svg>