ir: RootIRNode
code: string
helpers: Set<string>
- helpers: Set<string>
} => {
const ast = parse(template, {
prefixIdentifiers: true,
]
blockFn = genCall(
+ // @ts-expect-error
helper('withDestructure'),
destructureAssignmentFn,
blockFn,
isStaticArgOf,
} from '@vue/compiler-dom'
import type { DirectiveTransform } from '../transform'
-import { IRNodeTypes, type VaporHelper } from '../ir'
+import { IRNodeTypes } from '../ir'
export const transformVModel: DirectiveTransform = (dir, node, context) => {
const { exp, arg } = dir
)
const { tag } = node
const isCustomElement = context.options.isCustomElement(tag)
- let runtimeDirective: VaporHelper | undefined = 'vModelText'
+ let runtimeDirective: string | undefined = 'vModelText'
+ // TODO let runtimeDirective: VaporHelper | undefined = 'vModelText'
if (
tag === 'input' ||
tag === 'textarea' ||
export interface RenderContext {
component: VaporComponent
host: HTMLElement
- instance: Record<string, any> | undefined
+ instance: VaporComponentInstance | undefined
app: App
create: (props?: RawProps) => RenderContext
mount: (container?: string | ParentNode) => RenderContext
const isSleected = createSelector(index)
return createFor(
() => list.value,
- // @ts-expect-error
([item]) => {
const span = document.createElement('li')
renderEffect(() => {
})
return span
},
- // @ts-expect-error
item => item.id,
)
}).render()
)
return createFor(
() => list.value,
- // @ts-expect-error
([item]) => {
const span = document.createElement('li')
renderEffect(() => {
})
return span
},
- // @ts-expect-error
item => item.id,
)
}).render()
import {
createComponent,
- // @ts-expect-error
createForSlots,
createSlot,
createVaporApp,
import type { NodeRef } from '../../src/dom/templateRef'
import {
- // @ts-expect-error
createFor,
- // @ts-expect-error
createIf,
insert,
renderEffect,
const n1 = t0()
const n2 = createFor(
() => list,
- // @ts-expect-error
state => {
const n1 = t1()
setRef(n1 as Element, listRefs, undefined, true)
const n1 = t0()
const n2 = createFor(
() => list,
- // @ts-expect-error
state => {
const n1 = t1()
setRef(n1 as Element, 'listRefs', undefined, true)
const n2 = n1!.nextSibling!
const n3 = createFor(
() => list.value,
- // @ts-expect-error
state => {
const n4 = t1()
setRef(n4 as Element, 'listRefs', undefined, true)
-import {
- createFor,
- nextTick,
- ref,
- renderEffect,
- shallowRef,
- template,
- triggerRef,
- withDestructure,
-} from '../src'
+import { createFor, renderEffect } from '../src'
+import { nextTick, ref, shallowRef, triggerRef } from '@vue/runtime-dom'
import { makeRender } from './_utils'
const define = makeRender()
expectCalledTimesToBe('Clear rows', 1, 0, 0, 0)
})
- test('withDestructure', () => {
- const list = ref([{ name: 'a' }, { name: 'b' }, { name: 'c' }])
-
- const { host } = define(() => {
- const n1 = createFor(
- () => list.value,
- withDestructure(
- ([{ name }, index]) => [name, index],
- ctx => {
- const span = template(`<li>${ctx[1]}. ${ctx[0]}</li>`)()
- return span
- },
- ),
- item => item.name,
- )
- return n1
- }).render()
-
- expect(host.innerHTML).toBe(
- '<li>0. a</li><li>1. b</li><li>2. c</li><!--for-->',
- )
+ test.todo('withDestructure', () => {
+ // const list = ref([{ name: 'a' }, { name: 'b' }, { name: 'c' }])
+ // const { host } = define(() => {
+ // const n1 = createFor(
+ // () => list.value,
+ // withDestructure(
+ // ([{ name }, index]) => [name, index],
+ // ctx => {
+ // const span = template(`<li>${ctx[1]}. ${ctx[0]}</li>`)()
+ // return span
+ // },
+ // ),
+ // item => item.name,
+ // )
+ // return n1
+ // }).render()
+ // expect(host.innerHTML).toBe(
+ // '<li>0. a</li><li>1. b</li><li>2. c</li><!--for-->',
+ // )
})
})
children,
createIf,
insert,
- nextTick,
- ref,
renderEffect,
setText,
template,
+ // @ts-expect-error
withDirectives,
} from '../src'
+import { nextTick, ref } from '@vue/runtime-dom'
import type { Mock } from 'vitest'
import { makeRender } from './_utils'
import { unmountComponent } from '../src/component'
--- /dev/null
+import type { EffectScope, ShallowRef } from '@vue/reactivity'
+import type { Block, Fragment } from './block'
+
+interface ForBlock extends Fragment {
+ scope: EffectScope
+ state: [
+ item: ShallowRef<any>,
+ key: ShallowRef<any>,
+ index: ShallowRef<number | undefined>,
+ ]
+ key: any
+}
+
+type Source = any[] | Record<any, any> | number | Set<any> | Map<any, any>
+
+export const createFor = (
+ src: () => Source,
+ renderItem: (block: ForBlock['state']) => Block,
+ getKey?: (item: any, key: any, index?: number) => any,
+ container?: ParentNode,
+ hydrationNode?: Node,
+ once?: boolean,
+): Fragment => {
+ return [] as any
+}
--- /dev/null
+import type { BlockFn, Fragment } from './block'
+
+export function createIf(
+ condition: () => any,
+ b1: BlockFn,
+ b2?: BlockFn,
+ once?: boolean,
+ // hydrationNode?: Node,
+): Fragment {
+ return [] as any
+}
return fragment
}
+
+// TODO
+export function createForSlots(): any {}
import {
type VaporComponentInstance,
currentInstance,
+ getExposed,
isVaporComponent,
} from '../component'
import {
oldRef?: NodeRef,
refFor = false,
): NodeRef | undefined {
- if (!currentInstance) return
- // @ts-expect-error TODO
- const { setupState, isUnmounted } = currentInstance
+ if (!currentInstance || currentInstance.isUnmounted) return
- if (isUnmounted) {
- return
- }
-
- const refValue = isVaporComponent(el) ? el.exposed || el : el
+ const setupState = currentInstance.setupState || {}
+ const refValue = isVaporComponent(el) ? getExposed(el) || el : el
const refs =
currentInstance.refs === EMPTY_OBJ
if (oldRef != null && oldRef !== ref) {
if (isString(oldRef)) {
refs[oldRef] = null
- if (setupState && hasOwn(setupState, oldRef)) {
+ if (hasOwn(setupState, oldRef)) {
setupState[oldRef] = null
}
} else if (isRef(oldRef)) {
export { insert, prepend, remove } from './block'
export { createComponent, createComponentWithFallback } from './component'
export { renderEffect } from './renderEffect'
-export { createSlot } from './componentSlots'
+export { createSlot, createForSlots } from './componentSlots'
export { template, children, next } from './dom/template'
export { createTextNode } from './dom/node'
export { setStyle } from './dom/style'
setDynamicProps,
} from './dom/prop'
export { on, delegate, delegateEvents, setDynamicEvents } from './dom/event'
+export { createIf } from './apiCreateIf'
+export { createFor } from './apiCreateFor'
export { setRef } from './dom/templateRef'
projects / thirdparty / vuejs / core.git / commitdiff
