Parcourir la source

refactor: remove @vue/vapor package

Evan You il y a 1 an
Parent
commit
3a6915b587

+ 1 - 1
benchmark/client/App.vue

@@ -4,7 +4,7 @@ import {
   triggerRef,
   type ShallowRef,
   createSelector,
-} from '@vue/vapor'
+} from 'vue/vapor'
 import { buildData } from './data'
 import { defer, wrap } from './profiling'
 

+ 1 - 1
benchmark/client/data.ts

@@ -1,4 +1,4 @@
-import { shallowRef } from '@vue/vapor'
+import { shallowRef } from 'vue/vapor'
 
 let ID = 1
 

+ 1 - 1
benchmark/client/profiling.ts

@@ -2,7 +2,7 @@
 /* eslint-disable no-restricted-syntax */
 /* eslint-disable no-restricted-globals */
 
-import { nextTick } from '@vue/vapor'
+import { nextTick } from 'vue/vapor'
 
 declare namespace globalThis {
   let doProfile: boolean

+ 1 - 1
benchmark/client/vapor.ts

@@ -1,4 +1,4 @@
-import { createVaporApp } from '@vue/vapor'
+import { createVaporApp } from 'vue/vapor'
 import App from './App.vue'
 
 createVaporApp(App as any).mount('#app')

+ 0 - 1
benchmark/index.js

@@ -179,7 +179,6 @@ async function buildApp(isVapor) {
     },
     resolve: {
       alias: {
-        '@vue/vapor': runtimePath,
         'vue/vapor': runtimePath,
         vue: runtimePath,
       },

+ 0 - 2
benchmark/tsconfig.json

@@ -18,8 +18,6 @@
     "noEmit": true,
     "paths": {
       "vue": ["../packages/vue/src"],
-      "@vue/vapor": ["../packages/vue-vapor/src"],
-      "vue/vapor": ["../packages/vue-vapor/src"],
       "@vue/*": ["../packages/*/src"]
     }
   },

+ 4 - 4
packages/runtime-dom/src/index.ts

@@ -230,9 +230,9 @@ function injectCompilerOptionsCheck(app: App) {
 /**
  * @internal
  */
-export function normalizeContainer(
-  container: Element | ShadowRoot | string,
-): Element | ShadowRoot | null {
+export function normalizeContainer<T extends ParentNode>(
+  container: T | string,
+): T | null {
   if (isString(container)) {
     const res = document.querySelector(container)
     if (__DEV__ && !res) {
@@ -240,7 +240,7 @@ export function normalizeContainer(
         `Failed to mount app: mount target selector "${container}" returned null.`,
       )
     }
-    return res
+    return res as any
   }
   if (
     __DEV__ &&

+ 3 - 3
packages/runtime-vapor/src/apiCreateApp.ts

@@ -1,4 +1,3 @@
-import { normalizeContainer } from './_old/apiRender'
 import { insert } from './dom/element'
 import { type VaporComponent, createComponent } from './component'
 import {
@@ -6,7 +5,8 @@ import {
   type AppUnmountFn,
   type CreateAppFunction,
   createAppAPI,
-} from '@vue/runtime-core'
+  normalizeContainer,
+} from '@vue/runtime-dom'
 
 let _createApp: CreateAppFunction<ParentNode, VaporComponent>
 
@@ -32,7 +32,7 @@ export const createVaporApp: CreateAppFunction<
   const app = _createApp(comp)
   const mount = app.mount
   app.mount = (container, ...args: any[]) => {
-    container = normalizeContainer(container) // TODO reuse from runtime-dom
+    container = normalizeContainer(container) as ParentNode
     return mount(container, ...args)
   }
   return app

+ 1 - 1
packages/runtime-vapor/src/component.ts

@@ -11,7 +11,7 @@ import {
   nextUid,
   popWarningContext,
   pushWarningContext,
-} from '@vue/runtime-core'
+} from '@vue/runtime-dom'
 import type { Block } from './block'
 import { pauseTracking, resetTracking } from '@vue/reactivity'
 import { EMPTY_OBJ, isFunction } from '@vue/shared'

+ 1 - 1
packages/runtime-vapor/src/componentEmits.ts

@@ -2,7 +2,7 @@ import {
   type EmitFn,
   type ObjectEmitsOptions,
   baseEmit,
-} from '@vue/runtime-core'
+} from '@vue/runtime-dom'
 import {
   type VaporComponent,
   type VaporComponentInstance,

+ 1 - 1
packages/runtime-vapor/src/componentProps.ts

@@ -5,7 +5,7 @@ import {
   baseNormalizePropsOptions,
   isEmitListener,
   resolvePropValue,
-} from '@vue/runtime-core'
+} from '@vue/runtime-dom'
 import { normalizeEmitsOptions } from './componentEmits'
 
 export interface RawProps {

+ 2 - 2
packages/runtime-vapor/src/dom/prop.ts

@@ -12,7 +12,6 @@ import {
   shouldSetAsAttr,
   toDisplayString,
 } from '@vue/shared'
-import { warn } from '../_old/warning'
 import { setStyle } from './style'
 import {
   MetadataKind,
@@ -20,7 +19,8 @@ import {
   recordPropMetadata,
 } from '../componentMetadata'
 import { on } from './event'
-import { currentInstance } from '../_old/component'
+import { currentInstance } from '../component'
+import { warn } from '@vue/runtime-dom'
 
 export function mergeInheritAttr(key: string, value: any): unknown {
   const instance = currentInstance!

+ 1 - 1
packages/runtime-vapor/src/dom/style.ts

@@ -6,7 +6,7 @@ import {
   isString,
   normalizeStyle,
 } from '@vue/shared'
-import { warn } from '../_old/warning'
+import { warn } from '@vue/runtime-dom'
 import { recordPropMetadata } from '../componentMetadata'
 import { mergeInheritAttr } from './prop'
 

+ 14 - 9
packages/runtime-vapor/src/dom/templateRef.ts

@@ -1,10 +1,15 @@
 import { type Ref, isRef, onScopeDispose } from '@vue/reactivity'
 import {
-  type ComponentInternalInstance,
+  type VaporComponentInstance,
   currentInstance,
   isVaporComponent,
-} from '../_old/component'
-import { VaporErrorCodes, callWithErrorHandling } from '../_old/errorHandling'
+} from '../component'
+import {
+  type SchedulerJob,
+  callWithErrorHandling,
+  queuePostFlushCb,
+  warn,
+} from '@vue/runtime-dom'
 import {
   EMPTY_OBJ,
   hasOwn,
@@ -13,11 +18,9 @@ import {
   isString,
   remove,
 } from '@vue/shared'
-import { warn } from '../_old/warning'
-import { type SchedulerJob, queuePostFlushCb } from '../_old/scheduler'
 
 export type NodeRef = string | Ref | ((ref: Element) => void)
-export type RefEl = Element | ComponentInternalInstance
+export type RefEl = Element | VaporComponentInstance
 
 /**
  * Function for handling a template ref
@@ -29,6 +32,7 @@ export function setRef(
   refFor = false,
 ): NodeRef | undefined {
   if (!currentInstance) return
+  // @ts-expect-error TODO
   const { setupState, isUnmounted } = currentInstance
 
   if (isUnmounted) {
@@ -46,7 +50,7 @@ export function setRef(
   if (oldRef != null && oldRef !== ref) {
     if (isString(oldRef)) {
       refs[oldRef] = null
-      if (hasOwn(setupState, oldRef)) {
+      if (setupState && hasOwn(setupState, oldRef)) {
         setupState[oldRef] = null
       }
     } else if (isRef(oldRef)) {
@@ -59,7 +63,8 @@ export function setRef(
       callWithErrorHandling(
         ref,
         currentInstance,
-        VaporErrorCodes.FUNCTION_REF,
+        // @ts-expect-error
+        null,
         [value, refs],
       )
     }
@@ -126,7 +131,7 @@ export function setRef(
         })
       })
     } else if (__DEV__) {
-      warn('Invalid template ref type:', ref, `(${typeof ref})`)
+      // warn('Invalid template ref type:', ref, `(${typeof ref})`)
     }
   }
   return ref

+ 1 - 1
packages/runtime-vapor/src/renderEffect.ts

@@ -1,5 +1,5 @@
 import { ReactiveEffect } from '@vue/reactivity'
-import { type SchedulerJob, queueJob } from '@vue/runtime-core'
+import { type SchedulerJob, queueJob } from '@vue/runtime-dom'
 import { currentInstance } from './component'
 
 export function renderEffect(fn: () => void): void {

+ 0 - 21
packages/vue-vapor/LICENSE

@@ -1,21 +0,0 @@
-The MIT License (MIT)
-
-Copyright (c) 2018-present, Yuxi (Evan) You
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in
-all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-THE SOFTWARE.

+ 0 - 1
packages/vue-vapor/README.md

@@ -1 +0,0 @@
-# @vue/vapor

+ 0 - 209
packages/vue-vapor/__tests__/e2e/e2eUtils.ts

@@ -1,209 +0,0 @@
-import puppeteer, {
-  type Browser,
-  type ClickOptions,
-  type Page,
-  type PuppeteerLaunchOptions,
-} from 'puppeteer'
-
-export const E2E_TIMEOUT: number = 30 * 1000
-
-const puppeteerOptions: PuppeteerLaunchOptions = {
-  args: process.env.CI ? ['--no-sandbox', '--disable-setuid-sandbox'] : [],
-  headless: true,
-}
-
-const maxTries = 30
-export const timeout = (n: number): Promise<any> =>
-  new Promise(r => setTimeout(r, n))
-
-export async function expectByPolling(
-  poll: () => Promise<any>,
-  expected: string,
-): Promise<void> {
-  for (let tries = 0; tries < maxTries; tries++) {
-    const actual = (await poll()) || ''
-    if (actual.indexOf(expected) > -1 || tries === maxTries - 1) {
-      expect(actual).toMatch(expected)
-      break
-    } else {
-      await timeout(50)
-    }
-  }
-}
-
-interface PuppeteerUtils {
-  page: () => Page
-  click(selector: string, options?: ClickOptions): Promise<void>
-  count(selector: string): Promise<number>
-  text(selector: string): Promise<string | null>
-  value(selector: string): Promise<string>
-  html(selector: string): Promise<string>
-  classList(selector: string): Promise<string[]>
-  children(selector: string): Promise<any[]>
-  isVisible(selector: string): Promise<boolean>
-  isChecked(selector: string): Promise<boolean>
-  isFocused(selector: string): Promise<boolean>
-  setValue(selector: string, value: string): Promise<any>
-  typeValue(selector: string, value: string): Promise<any>
-  enterValue(selector: string, value: string): Promise<any>
-  clearValue(selector: string): Promise<any>
-  timeout(time: number): Promise<any>
-  nextFrame(): Promise<any>
-}
-
-export function setupPuppeteer(args?: string[]): PuppeteerUtils {
-  let browser: Browser
-  let page: Page
-
-  const resolvedOptions = args
-    ? {
-        ...puppeteerOptions,
-        args: [...puppeteerOptions.args!, ...args],
-      }
-    : puppeteerOptions
-
-  beforeAll(async () => {
-    browser = await puppeteer.launch(resolvedOptions)
-  }, 20000)
-
-  beforeEach(async () => {
-    page = await browser.newPage()
-
-    await page.evaluateOnNewDocument(() => {
-      localStorage.clear()
-    })
-
-    page.on('console', e => {
-      if (e.type() === 'error') {
-        const err = e.args()[0]
-        console.error(`Error from Puppeteer-loaded page:\n`, err.remoteObject())
-      }
-    })
-  })
-
-  afterEach(async () => {
-    await page.close()
-  })
-
-  afterAll(async () => {
-    await browser.close()
-  })
-
-  async function click(
-    selector: string,
-    options?: ClickOptions,
-  ): Promise<void> {
-    await page.click(selector, options)
-  }
-
-  async function count(selector: string): Promise<number> {
-    return (await page.$$(selector)).length
-  }
-
-  async function text(selector: string): Promise<string | null> {
-    return page.$eval(selector, node => node.textContent)
-  }
-
-  async function value(selector: string): Promise<string> {
-    return page.$eval(selector, node => (node as HTMLInputElement).value)
-  }
-
-  async function html(selector: string): Promise<string> {
-    return page.$eval(selector, node => node.innerHTML)
-  }
-
-  async function classList(selector: string): Promise<string[]> {
-    return page.$eval(selector, (node: any) => [...node.classList])
-  }
-
-  async function children(selector: string): Promise<any[]> {
-    return page.$eval(selector, (node: any) => [...node.children])
-  }
-
-  async function isVisible(selector: string): Promise<boolean> {
-    const display = await page.$eval(selector, node => {
-      return window.getComputedStyle(node).display
-    })
-    return display !== 'none'
-  }
-
-  async function isChecked(selector: string) {
-    return await page.$eval(
-      selector,
-      node => (node as HTMLInputElement).checked,
-    )
-  }
-
-  async function isFocused(selector: string) {
-    return await page.$eval(selector, node => node === document.activeElement)
-  }
-
-  async function setValue(selector: string, value: string) {
-    await page.$eval(
-      selector,
-      (node, value) => {
-        ;(node as HTMLInputElement).value = value as string
-        node.dispatchEvent(new Event('input'))
-      },
-      value,
-    )
-  }
-
-  async function typeValue(selector: string, value: string) {
-    const el = (await page.$(selector))!
-    await el.evaluate(node => ((node as HTMLInputElement).value = ''))
-    await el.type(value)
-  }
-
-  async function enterValue(selector: string, value: string) {
-    const el = (await page.$(selector))!
-    await el.evaluate(node => ((node as HTMLInputElement).value = ''))
-    await el.type(value)
-    await el.press('Enter')
-  }
-
-  async function clearValue(selector: string) {
-    return await page.$eval(
-      selector,
-      node => ((node as HTMLInputElement).value = ''),
-    )
-  }
-
-  function timeout(time: number) {
-    return page.evaluate(time => {
-      return new Promise(r => {
-        setTimeout(r, time)
-      })
-    }, time)
-  }
-
-  function nextFrame() {
-    return page.evaluate(() => {
-      return new Promise(resolve => {
-        requestAnimationFrame(() => {
-          requestAnimationFrame(resolve)
-        })
-      })
-    })
-  }
-
-  return {
-    page: () => page,
-    click,
-    count,
-    text,
-    value,
-    html,
-    classList,
-    children,
-    isVisible,
-    isChecked,
-    isFocused,
-    setValue,
-    typeValue,
-    enterValue,
-    clearValue,
-    timeout,
-    nextFrame,
-  }
-}

+ 0 - 177
packages/vue-vapor/__tests__/e2e/todomvc.spec.ts

@@ -1,177 +0,0 @@
-import path from 'node:path'
-import { E2E_TIMEOUT, setupPuppeteer } from './e2eUtils'
-
-describe('e2e: todomvc', () => {
-  const {
-    page,
-    click,
-    isVisible,
-    count,
-    text,
-    value,
-    isChecked,
-    isFocused,
-    classList,
-    enterValue,
-    clearValue,
-  } = setupPuppeteer()
-
-  async function removeItemAt(n: number) {
-    const item = (await page().$('.todo:nth-child(' + n + ')'))!
-    const itemBBox = (await item.boundingBox())!
-    await page().mouse.move(itemBBox.x + 10, itemBBox.y + 10)
-    await click('.todo:nth-child(' + n + ') .destroy')
-  }
-
-  async function testTodomvc(apiType: 'classic' | 'composition') {
-    let baseUrl = `../../examples/${apiType}/todomvc.html`
-    baseUrl = `file://${path.resolve(__dirname, baseUrl)}`
-
-    await page().goto(baseUrl)
-    expect(await isVisible('.main')).toBe(false)
-    expect(await isVisible('.footer')).toBe(false)
-    expect(await count('.filters .selected')).toBe(1)
-    expect(await text('.filters .selected')).toBe('All')
-    expect(await count('.todo')).toBe(0)
-
-    await enterValue('.new-todo', 'test')
-    expect(await count('.todo')).toBe(1)
-    expect(await isVisible('.todo .edit')).toBe(false)
-    expect(await text('.todo label')).toBe('test')
-    expect(await text('.todo-count strong')).toBe('1')
-    expect(await isChecked('.todo .toggle')).toBe(false)
-    expect(await isVisible('.main')).toBe(true)
-    expect(await isVisible('.footer')).toBe(true)
-    expect(await isVisible('.clear-completed')).toBe(false)
-    expect(await value('.new-todo')).toBe('')
-
-    await enterValue('.new-todo', 'test2')
-    expect(await count('.todo')).toBe(2)
-    expect(await text('.todo:nth-child(2) label')).toBe('test2')
-    expect(await text('.todo-count strong')).toBe('2')
-
-    // toggle
-    await click('.todo .toggle')
-    expect(await count('.todo.completed')).toBe(1)
-    expect(await classList('.todo:nth-child(1)')).toContain('completed')
-    expect(await text('.todo-count strong')).toBe('1')
-    expect(await isVisible('.clear-completed')).toBe(true)
-
-    await enterValue('.new-todo', 'test3')
-    expect(await count('.todo')).toBe(3)
-    expect(await text('.todo:nth-child(3) label')).toBe('test3')
-    expect(await text('.todo-count strong')).toBe('2')
-
-    await enterValue('.new-todo', 'test4')
-    await enterValue('.new-todo', 'test5')
-    expect(await count('.todo')).toBe(5)
-    expect(await text('.todo-count strong')).toBe('4')
-
-    // toggle more
-    await click('.todo:nth-child(4) .toggle')
-    await click('.todo:nth-child(5) .toggle')
-    expect(await count('.todo.completed')).toBe(3)
-    expect(await text('.todo-count strong')).toBe('2')
-
-    // remove
-    await removeItemAt(1)
-    expect(await count('.todo')).toBe(4)
-    expect(await count('.todo.completed')).toBe(2)
-    expect(await text('.todo-count strong')).toBe('2')
-    await removeItemAt(2)
-    expect(await count('.todo')).toBe(3)
-    expect(await count('.todo.completed')).toBe(2)
-    expect(await text('.todo-count strong')).toBe('1')
-
-    // remove all
-    await click('.clear-completed')
-    expect(await count('.todo')).toBe(1)
-    expect(await text('.todo label')).toBe('test2')
-    expect(await count('.todo.completed')).toBe(0)
-    expect(await text('.todo-count strong')).toBe('1')
-    expect(await isVisible('.clear-completed')).toBe(false)
-
-    // prepare to test filters
-    await enterValue('.new-todo', 'test')
-    await enterValue('.new-todo', 'test')
-    await click('.todo:nth-child(2) .toggle')
-    await click('.todo:nth-child(3) .toggle')
-
-    // active filter
-    await click('.filters li:nth-child(2) a')
-    expect(await count('.todo')).toBe(1)
-    expect(await count('.todo.completed')).toBe(0)
-    // add item with filter active
-    await enterValue('.new-todo', 'test')
-    expect(await count('.todo')).toBe(2)
-
-    // completed filter
-    await click('.filters li:nth-child(3) a')
-    expect(await count('.todo')).toBe(2)
-    expect(await count('.todo.completed')).toBe(2)
-
-    // filter on page load
-    await page().goto(`${baseUrl}#active`)
-    expect(await count('.todo')).toBe(2)
-    expect(await count('.todo.completed')).toBe(0)
-    expect(await text('.todo-count strong')).toBe('2')
-
-    // completed on page load
-    await page().goto(`${baseUrl}#completed`)
-    expect(await count('.todo')).toBe(2)
-    expect(await count('.todo.completed')).toBe(2)
-    expect(await text('.todo-count strong')).toBe('2')
-
-    // toggling with filter active
-    await click('.todo .toggle')
-    expect(await count('.todo')).toBe(1)
-    await click('.filters li:nth-child(2) a')
-    expect(await count('.todo')).toBe(3)
-    await click('.todo .toggle')
-    expect(await count('.todo')).toBe(2)
-
-    // editing triggered by blur
-    await click('.filters li:nth-child(1) a')
-    await click('.todo:nth-child(1) label', { clickCount: 2 })
-    expect(await count('.todo.editing')).toBe(1)
-    expect(await isFocused('.todo:nth-child(1) .edit')).toBe(true)
-    await clearValue('.todo:nth-child(1) .edit')
-    await page().type('.todo:nth-child(1) .edit', 'edited!')
-    await click('.new-todo') // blur
-    expect(await count('.todo.editing')).toBe(0)
-    expect(await text('.todo:nth-child(1) label')).toBe('edited!')
-
-    // editing triggered by enter
-    await click('.todo label', { clickCount: 2 })
-    await enterValue('.todo:nth-child(1) .edit', 'edited again!')
-    expect(await count('.todo.editing')).toBe(0)
-    expect(await text('.todo:nth-child(1) label')).toBe('edited again!')
-
-    // cancel
-    await click('.todo label', { clickCount: 2 })
-    await clearValue('.todo:nth-child(1) .edit')
-    await page().type('.todo:nth-child(1) .edit', 'edited!')
-    await page().keyboard.press('Escape')
-    expect(await count('.todo.editing')).toBe(0)
-    expect(await text('.todo:nth-child(1) label')).toBe('edited again!')
-
-    // empty value should remove
-    await click('.todo label', { clickCount: 2 })
-    await enterValue('.todo:nth-child(1) .edit', ' ')
-    expect(await count('.todo')).toBe(3)
-
-    // toggle all
-    await click('.toggle-all+label')
-    expect(await count('.todo.completed')).toBe(3)
-    await click('.toggle-all+label')
-    expect(await count('.todo:not(.completed)')).toBe(3)
-  }
-
-  test(
-    'composition',
-    async () => {
-      await testTodomvc('composition')
-    },
-    E2E_TIMEOUT,
-  )
-})

+ 0 - 289
packages/vue-vapor/examples/composition/todomvc.html

@@ -1,289 +0,0 @@
-<script src="../../dist/vue-vapor.global.js"></script>
-<link
-  rel="stylesheet"
-  href="../../../../node_modules/todomvc-app-css/index.css"
-/>
-
-<div id="app"></div>
-
-<script>
-  const {
-    createVaporApp,
-    defineComponent,
-    reactive,
-    computed,
-    watchEffect,
-    onMounted,
-    onUnmounted,
-    nextTick,
-  } = VueVapor
-
-  const STORAGE_KEY = 'todos-vuejs-3.x'
-  const todoStorage = {
-    fetch() {
-      const todos = JSON.parse(localStorage.getItem(STORAGE_KEY) || '[]')
-      todos.forEach((todo, index) => {
-        todo.id = index
-      })
-      todoStorage.uid = todos.length
-      return todos
-    },
-    save(todos) {
-      localStorage.setItem(STORAGE_KEY, JSON.stringify(todos))
-    },
-  }
-
-  const filters = {
-    all(todos) {
-      return todos
-    },
-    active(todos) {
-      return todos.filter(todo => {
-        return !todo.completed
-      })
-    },
-    completed(todos) {
-      return todos.filter(function (todo) {
-        return todo.completed
-      })
-    },
-  }
-
-  function pluralize(n) {
-    return n === 1 ? 'item' : 'items'
-  }
-
-  const _sfc_main = defineComponent({
-    setup() {
-      const state = reactive({
-        todos: todoStorage.fetch(),
-        editedTodo: null,
-        newTodo: '',
-        beforeEditCache: '',
-        visibility: 'all',
-        remaining: computed(() => {
-          return filters.active(state.todos).length
-        }),
-        remainingText: computed(() => {
-          return ` ${pluralize(state.remaining)} left`
-        }),
-        filteredTodos: computed(() => {
-          return filters[state.visibility](state.todos)
-        }),
-        allDone: computed({
-          get: function () {
-            return state.remaining === 0
-          },
-          set: function (value) {
-            state.todos.forEach(todo => {
-              todo.completed = value
-            })
-          },
-        }),
-      })
-
-      watchEffect(() => {
-        todoStorage.save(state.todos)
-      })
-
-      onMounted(() => {
-        window.addEventListener('hashchange', onHashChange)
-        onHashChange()
-      })
-
-      onUnmounted(() => {
-        window.removeEventListener('hashchange', onHashChange)
-      })
-
-      function onHashChange() {
-        const visibility = window.location.hash.replace(/#\/?/, '')
-        if (filters[visibility]) {
-          state.visibility = visibility
-        } else {
-          window.location.hash = ''
-          state.visibility = 'all'
-        }
-      }
-
-      function addTodo() {
-        const value = state.newTodo && state.newTodo.trim()
-        if (!value) {
-          return
-        }
-        state.todos.push({
-          id: todoStorage.uid++,
-          title: value,
-          completed: false,
-        })
-        state.newTodo = ''
-      }
-
-      function removeTodo(todo) {
-        state.todos.splice(state.todos.indexOf(todo), 1)
-      }
-
-      async function editTodo(todo) {
-        state.beforeEditCache = todo.title
-        state.editedTodo = todo
-        await nextTick()
-        document.getElementById(`todo-${todo.id}-input`).focus()
-      }
-
-      function doneEdit(todo) {
-        if (!state.editedTodo) {
-          return
-        }
-        state.editedTodo = null
-        todo.title = todo.title.trim()
-        if (!todo.title) {
-          removeTodo(todo)
-        }
-      }
-
-      function cancelEdit(todo) {
-        state.editedTodo = null
-        todo.title = state.beforeEditCache
-      }
-
-      function removeCompleted() {
-        state.todos = filters.active(state.todos)
-      }
-
-      return {
-        state,
-        addTodo,
-        removeTodo,
-        editTodo,
-        doneEdit,
-        cancelEdit,
-        removeCompleted,
-      }
-    },
-  })
-
-  const {
-    children: _children,
-    vModelText: _vModelText,
-    withDirectives: _withDirectives,
-    vShow: _vShow,
-    next: _next,
-    delegate: _delegate,
-    on: _on,
-    renderEffect: _renderEffect,
-    setDynamicProp: _setDynamicProp,
-    setText: _setText,
-    setClass: _setClass,
-    createFor: _createFor,
-    insert: _insert,
-    delegateEvents: _delegateEvents,
-    template: _template,
-  } = VueVapor
-  const t0 = _template(
-    '<li><div class="view"><input class="toggle" type="checkbox"><label></label><button class="destroy"></button></div><input class="edit" type="text"></li>',
-  )
-  const t1 = _template(
-    '<section class="todoapp"><header class="header"><h1>todos</h1><input class="new-todo" autofocus autocomplete="off" placeholder="What needs to be done?"></header><section class="main"><input id="toggle-all" class="toggle-all" type="checkbox"><label for="toggle-all">Mark all as complete</label><ul class="todo-list"></ul></section><footer class="footer"><span class="todo-count"><strong></strong><span></span></span><ul class="filters"><li><a href="#/all">All</a></li><li><a href="#/active">Active</a></li><li><a href="#/completed">Completed</a></li></ul><button class="clear-completed"> Clear completed </button></footer></section>',
-  )
-  _delegateEvents('keyup', 'dblclick', 'click', 'input')
-
-  function _sfc_render(_ctx) {
-    const n18 = t1()
-    const n0 = _children(n18, 0, 1)
-    _withDirectives(n0, [[_vModelText, () => _ctx.state.newTodo]])
-    const n10 = _children(n18, 1)
-    _withDirectives(n10, [[_vShow, () => _ctx.state.todos.length]])
-    const n1 = n10.firstChild
-    const n9 = _next(n1, 2)
-    const n17 = n10.nextSibling
-    _withDirectives(n17, [[_vShow, () => _ctx.state.todos.length]])
-    const n11 = _children(n17, 0, 0)
-    const n12 = n11.nextSibling
-    const n13 = _children(n17, 1, 0, 0)
-    const n14 = _children(n17, 1, 1, 0)
-    const n15 = _children(n17, 1, 2, 0)
-    const n16 = _children(n17, 2)
-    _withDirectives(n16, [
-      [_vShow, () => _ctx.state.todos.length > _ctx.state.remaining],
-    ])
-    _delegate(
-      n0,
-      'update:modelValue',
-      () => $event => (_ctx.state.newTodo = $event),
-    )
-    _delegate(n0, 'keyup', () => _ctx.addTodo, {
-      keys: ['enter'],
-    })
-    _on(
-      n1,
-      'change',
-      () => $event => (_ctx.state.allDone = $event.target.checked),
-    )
-    const n2 = _createFor(
-      () => _ctx.state.filteredTodos,
-      _ctx2 => {
-        const n8 = t0()
-        const n4 = _children(n8, 0, 0)
-        const n5 = n4.nextSibling
-        const n6 = n5.nextSibling
-        const n7 = _children(n8, 1)
-        _on(
-          n4,
-          'change',
-          () => $event => (_ctx2[0].completed = $event.target.checked),
-        )
-        _delegate(n5, 'dblclick', () => $event => _ctx.editTodo(_ctx2[0]))
-        _delegate(n6, 'click', () => $event => _ctx.removeTodo(_ctx2[0]))
-        _delegate(
-          n7,
-          'input',
-          () => $event => (_ctx2[0].title = $event.target.value),
-        )
-        _on(n7, 'blur', () => $event => _ctx.doneEdit(_ctx2[0]))
-        _delegate(n7, 'keyup', () => $event => _ctx.doneEdit(_ctx2[0]), {
-          keys: ['enter'],
-        })
-        _delegate(n7, 'keyup', () => $event => _ctx.cancelEdit(_ctx2[0]), {
-          keys: ['escape'],
-        })
-        _renderEffect(() => _setDynamicProp(n4, 'checked', _ctx2[0].completed))
-        _renderEffect(() => {
-          _setText(n5, _ctx2[0].title)
-          _setDynamicProp(n7, 'value', _ctx2[0].title)
-        })
-        _renderEffect(() =>
-          _setDynamicProp(n7, 'id', `todo-${_ctx2[0].id}-input`),
-        )
-        _renderEffect(() =>
-          _setClass(n8, [
-            'todo',
-            {
-              completed: _ctx2[0].completed,
-              editing: _ctx2[0] === _ctx.state.editedTodo,
-            },
-          ]),
-        )
-        return n8
-      },
-      todo => todo.id,
-    )
-    _insert(n2, n9)
-    _delegate(n16, 'click', () => _ctx.removeCompleted)
-    _renderEffect(() => _setDynamicProp(n1, 'checked', _ctx.state.allDone))
-    _renderEffect(() => _setText(n11, _ctx.state.remaining))
-    _renderEffect(() => _setText(n12, _ctx.state.remainingText))
-    _renderEffect(() =>
-      _setClass(n13, { selected: _ctx.state.visibility === 'all' }),
-    )
-    _renderEffect(() =>
-      _setClass(n14, { selected: _ctx.state.visibility === 'active' }),
-    )
-    _renderEffect(() =>
-      _setClass(n15, { selected: _ctx.state.visibility === 'completed' }),
-    )
-    return n18
-  }
-
-  _sfc_main.render = _sfc_render
-  const app = createVaporApp(_sfc_main, {})
-  app.mount('#app')
-</script>

+ 0 - 7
packages/vue-vapor/index.js

@@ -1,7 +0,0 @@
-'use strict'
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./dist/vue-vapor.cjs.prod.js')
-} else {
-  module.exports = require('./dist/vue-vapor.cjs.js')
-}

+ 0 - 1
packages/vue-vapor/index.mjs

@@ -1 +0,0 @@
-export * from './index.js'

+ 0 - 59
packages/vue-vapor/package.json

@@ -1,59 +0,0 @@
-{
-  "name": "@vue/vapor",
-  "version": "3.0.0-vapor",
-  "description": "The progressive JavaScript framework for building modern web UI.",
-  "main": "index.js",
-  "module": "dist/vue-vapor.esm-bundler.js",
-  "types": "dist/vue-vapor.d.ts",
-  "unpkg": "dist/vue-vapor.global.js",
-  "jsdelivr": "dist/vue-vapor.global.js",
-  "files": [
-    "index.js",
-    "index.mjs",
-    "dist"
-  ],
-  "exports": {
-    ".": {
-      "types": "./dist/vue-vapor.d.ts",
-      "import": {
-        "node": "./index.mjs",
-        "default": "./dist/vue-vapor.esm-bundler.js"
-      },
-      "require": {
-        "node": {
-          "production": "./dist/vue-vapor.cjs.prod.js",
-          "development": "./dist/vue-vapor.cjs.js",
-          "default": "./index.js"
-        },
-        "default": "./index.js"
-      }
-    },
-    "./dist/*": "./dist/*",
-    "./package.json": "./package.json"
-  },
-  "buildOptions": {
-    "name": "VueVapor",
-    "formats": [
-      "esm-bundler",
-      "cjs",
-      "global",
-      "esm-browser"
-    ]
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/vuejs/vue-vapor.git"
-  },
-  "keywords": [
-    "vue"
-  ],
-  "author": "Evan You",
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/vuejs/vue-vapor/issues"
-  },
-  "homepage": "https://github.com/vuejs/vue-vapor/tree/main/packages/vapor#readme",
-  "dependencies": {
-    "@vue/runtime-vapor": "workspace:*"
-  }
-}

+ 0 - 15
packages/vue-vapor/src/index.ts

@@ -1,15 +0,0 @@
-import { initCustomFormatter } from '@vue/runtime-dom'
-
-if (__DEV__ && __BROWSER__) {
-  /* istanbul ignore if */
-  if (!__ESM_BUNDLER__) {
-    console.info(
-      `You are running a development build of Vue.\n` +
-        `Make sure to use the production build (*.prod.js) when deploying for production.`,
-    )
-  }
-
-  initCustomFormatter()
-}
-
-export * from '@vue/runtime-vapor/src'

+ 1 - 1
packages/vue/package.json

@@ -107,9 +107,9 @@
   "homepage": "https://github.com/vuejs/vue-vapor/tree/main/packages/vue#readme",
   "dependencies": {
     "@vue/shared": "workspace:*",
-    "@vue/vapor": "workspace:*",
     "@vue/compiler-dom": "workspace:*",
     "@vue/runtime-dom": "workspace:*",
+    "@vue/runtime-vapor": "workspace:*",
     "@vue/compiler-sfc": "workspace:*",
     "@vue/server-renderer": "workspace:*"
   },

+ 1 - 1
packages/vue/vapor/index.d.mts

@@ -1 +1 @@
-export * from '@vue/vapor'
+export * from '@vue/runtime-vapor'

+ 1 - 1
packages/vue/vapor/index.d.ts

@@ -1 +1 @@
-export * from '@vue/vapor'
+export * from '@vue/runtime-vapor'

+ 1 - 1
packages/vue/vapor/index.js

@@ -1 +1 @@
-module.exports = require('@vue/vapor')
+module.exports = require('@vue/runtime-vapor')

+ 1 - 1
packages/vue/vapor/index.mjs

@@ -1 +1 @@
-export * from '@vue/vapor'
+export * from '@vue/runtime-vapor'

+ 1 - 2
playground/setup/dev.js

@@ -16,9 +16,8 @@ export function DevPlugin({ browser = false } = {}) {
       return {
         resolve: {
           alias: {
-            'vue/vapor': resolve('vue/vapor/index.mjs'),
+            'vue/vapor': resolve('runtime-vapor/src'),
             vue: resolve('vue/src/runtime.ts'),
-            '@vue/vapor': resolve('vue-vapor/src'),
 
             '@vue/runtime-core': resolve('runtime-core/src'),
             '@vue/runtime-dom': resolve('runtime-dom/src'),

+ 3 - 9
pnpm-lock.yaml

@@ -468,15 +468,15 @@ importers:
       '@vue/runtime-dom':
         specifier: workspace:*
         version: link:../runtime-dom
+      '@vue/runtime-vapor':
+        specifier: workspace:*
+        version: link:../runtime-vapor
       '@vue/server-renderer':
         specifier: workspace:*
         version: link:../server-renderer
       '@vue/shared':
         specifier: workspace:*
         version: link:../shared
-      '@vue/vapor':
-        specifier: workspace:*
-        version: link:../vue-vapor
       typescript:
         specifier: '*'
         version: 5.5.4
@@ -496,12 +496,6 @@ importers:
         specifier: workspace:*
         version: link:../vue
 
-  packages/vue-vapor:
-    dependencies:
-      '@vue/runtime-vapor':
-        specifier: workspace:*
-        version: link:../runtime-vapor
-
   playground:
     dependencies:
       '@vueuse/core':

+ 0 - 1
tsconfig.json

@@ -23,7 +23,6 @@
     "rootDir": ".",
     "paths": {
       "@vue/compat": ["packages/vue-compat/src"],
-      "@vue/vapor": ["packages/vue-vapor/src"],
       "@vue/*": ["packages/*/src"],
       "vue": ["packages/vue/src"]
     },