@ -4,33 +4,28 @@ import {
EACH _IS _CONTROLLED ,
EACH _IS _STRICT _EQUALS ,
EACH _ITEM _REACTIVE ,
EACH _KEYED
EACH _KEYED ,
HYDRATION _END _ELSE ,
HYDRATION _START
} from '../../../../constants.js' ;
import {
hydrate _nodes ,
hydrate _block _anchor ,
hydrating ,
set _hydrating ,
update _hydrate _nodes
} from '../hydration.js' ;
import { hydrate _anchor , hydrate _nodes , hydrating , set _hydrating } from '../hydration.js' ;
import { empty } from '../operations.js' ;
import { insert, remove } from '../reconciler.js' ;
import { remove } from '../reconciler.js' ;
import { untrack } from '../../runtime.js' ;
import {
block ,
branch ,
destroy _effect ,
effect ,
run _out _transitions ,
pause _children ,
pause _effect ,
pause _effects ,
render _effect ,
resume _effect ,
user _effect
resume _effect
} from '../../reactivity/effects.js' ;
import { source , mutable _source , set } from '../../reactivity/sources.js' ;
import { is _array , is _frozen , map _get , map _set } from '../../utils.js' ;
import { STATE _SYMBOL } from '../../constants.js' ;
var NEW _ITEM = - 1 ;
var LIS _ITEM = - 2 ;
/ * *
* The row of a keyed each block that is currently updating . We track this
* so that ` animate: ` directives have something to attach themselves to
@ -43,33 +38,77 @@ export function set_current_each_item(item) {
current _each _item = item ;
}
/ * *
* @ param { any } _
* @ param { number } i
* /
export function index ( _ , i ) {
return i ;
}
/ * *
* Pause multiple effects simultaneously , and coordinate their
* subsequent destruction . Used in each blocks
* @ param { import ( '#client' ) . EachItem [ ] } items
* @ param { null | Node } controlled _anchor
* @ param { ( ) => void } [ callback ]
* /
function pause _effects ( items , controlled _anchor , callback ) {
/** @type {import('#client').TransitionManager[]} */
var transitions = [ ] ;
var length = items . length ;
for ( var i = 0 ; i < length ; i ++ ) {
pause _children ( items [ i ] . e , transitions , true ) ;
}
// If we have a controlled anchor, it means that the each block is inside a single
// DOM element, so we can apply a fast-path for clearing the contents of the element.
if ( length > 0 && transitions . length === 0 && controlled _anchor !== null ) {
var parent _node = /** @type {Element} */ ( controlled _anchor . parentNode ) ;
parent _node . textContent = '' ;
parent _node . append ( controlled _anchor ) ;
}
run _out _transitions ( transitions , ( ) => {
for ( var i = 0 ; i < length ; i ++ ) {
destroy _effect ( items [ i ] . e ) ;
}
if ( callback !== undefined ) callback ( ) ;
} ) ;
}
/ * *
* @ template V
* @ param { Element | Comment } anchor The next sibling node , or the parent node if this is a 'controlled' block
* @ param { ( ) => V [ ] } get _collection
* @ param { number } flags
* @ param { null | ( ( item : V ) => string ) } get _key
* @ param { ( anchor : null , item : V , index : import ( '#client' ) . MaybeSource < number > ) => void } render _fn
* @ param { null | ( ( anchor : Node | null ) => void ) } fallback _fn
* @ param { typeof reconcile _indexed _array | reconcile _tracked _array } reconcile _fn
* @ param { ( ) => V [ ] } get _collection
* @ param { ( value: V , index : number ) => any } get _key
* @ param { ( anchor : Node , item : import ( '#client' ) . MaybeSource < V > , index : import ( '#client' ) . MaybeSource < number > ) => void } render _fn
* @ param { null | ( ( anchor : Node ) => void ) } fallback _fn
* @ returns { void }
* /
function each ( anchor , get _collection , flags , get _key , render _fn , fallback _fn , reconcile _fn ) {
export function each ( anchor , flags, get_collection , _key , render _fn , fallback _fn = null ) {
/** @type {import('#client').EachState} */
var state = { flags , items : [ ] } ;
var state = { flags , items : new Map ( ) , next : null } ;
var is _controlled = ( flags & EACH _IS _CONTROLLED ) !== 0 ;
hydrate _block _anchor ( is _controlled ? /** @type {Node} */ ( anchor . firstChild ) : anchor ) ;
if ( is _controlled ) {
var parent _node = /** @type {Element} */ ( anchor ) ;
parent _node . append ( ( anchor = empty ( ) ) ) ;
anchor = hydrating
? /** @type {Comment | Text} */ (
hydrate _anchor ( /** @type {Comment | Text} */ ( parent _node . firstChild ) )
)
: parent _node . appendChild ( empty ( ) ) ;
}
/** @type {import('#client').Effect | null} */
var fallback = null ;
var effect = render _effect ( ( ) => {
block ( ( ) => {
var collection = get _collection ( ) ;
var array = is _array ( collection )
@ -78,8 +117,6 @@ function each(anchor, get_collection, flags, get_key, render_fn, fallback_fn, re
? [ ]
: Array . from ( collection ) ;
var keys = get _key === null ? array : array . map ( get _key ) ;
var length = array . length ;
// If we are working with an array that isn't proxied or frozen, then remove strict equality and ensure the items
@ -98,31 +135,32 @@ function each(anchor, get_collection, flags, get_key, render_fn, fallback_fn, re
let mismatch = false ;
if ( hydrating ) {
var is _else = /** @type {Comment} */ ( hydrate_nodes ? . [ 0 ] ) ? . data === 'ssr:each_else' ;
var is _else = /** @type {Comment} */ ( anchor) . data === HYDRATION _END _ELSE ;
if ( is _else !== ( length === 0 ) ) {
// hydration mismatch — remove the server-rendered DOM and start over
remove ( hydrate _nodes ) ;
set _hydrating ( false ) ;
mismatch = true ;
} else if ( is _else ) {
// Remove the each_else comment node or else it will confuse the subsequent hydration algorithm
/** @type {import('#client').TemplateNode[]} */ ( hydrate _nodes ) . shift ( ) ;
}
}
// this is separate to the previous block because `hydrating` might change
if ( hydrating ) {
var b _items = [ ] ;
/** @type {Node} */
var child _anchor = hydrate _nodes [ 0 ] ;
// Hydrate block
var hydration _list = /** @type {import('#client').TemplateNode[]} */ ( hydrate _nodes ) ;
var hydrating _node = hydration _list [ 0 ] ;
/** @type {import('#client').EachItem | import('#client').EachState} */
var prev = state ;
for ( var i = 0 ; i < length ; i ++ ) {
var nodes = update _hydrate _nodes ( hydrating _node ) ;
/** @type {import('#client').EachItem} */
var item ;
if ( nodes === null ) {
for ( var i = 0 ; i < length ; i ++ ) {
if (
child _anchor . nodeType !== 8 ||
/** @type {Comment} */ ( child _anchor ) . data !== HYDRATION _START
) {
// If `nodes` is null, then that means that the server rendered fewer items than what
// expected, so break out and continue appending non-hydrated items
mismatch = true ;
@ -130,24 +168,28 @@ function each(anchor, get_collection, flags, get_key, render_fn, fallback_fn, re
break ;
}
b _items [ i ] = create _item ( array [ i ] , keys ? . [ i ] , i , render _fn , flags ) ;
child _anchor = hydrate _anchor ( child _anchor ) ;
var value = array [ i ] ;
var key = get _key ( value , i ) ;
item = create _item ( child _anchor , prev , null , value , key , i , render _fn , flags ) ;
state . items . set ( key , item ) ;
child _anchor = /** @type {Comment} */ ( child _anchor . nextSibling ) ;
// TODO helperise this
hydrating _node = /** @type {import('#client').TemplateNode} */ (
/** @type {Node} */ (
/** @type {Node} */ ( nodes [ nodes . length - 1 ] || hydrating _node ) . nextSibling
) . nextSibling
) ;
prev = item ;
}
remove _excess _hydration _nodes ( hydration _list , hydrating _node ) ;
state . items = b _items ;
// remove excess nodes
if ( length > 0 ) {
while ( child _anchor !== anchor ) {
var next = /** @type {import('#client').TemplateNode} */ ( child _anchor . nextSibling ) ;
/** @type {import('#client').TemplateNode} */ ( child _anchor ) . remove ( ) ;
child _anchor = next ;
}
}
}
if ( ! hydrating ) {
// TODO add 'empty controlled block' optimisation here
reconcile _fn ( array , state , anchor , render _fn , flags , keys ) ;
reconcile ( array , state , anchor , render _fn , flags , get _key ) ;
}
if ( fallback _fn !== null ) {
@ -155,15 +197,7 @@ function each(anchor, get_collection, flags, get_key, render_fn, fallback_fn, re
if ( fallback ) {
resume _effect ( fallback ) ;
} else {
fallback = render _effect ( ( ) => {
var dom = fallback _fn ( hydrating ? null : anchor ) ;
return ( ) => {
if ( dom !== undefined ) {
remove ( dom ) ;
}
} ;
} , true ) ;
fallback = branch ( ( ) => fallback _fn ( anchor ) ) ;
}
} else if ( fallback !== null ) {
pause _effect ( fallback , ( ) => {
@ -177,44 +211,6 @@ function each(anchor, get_collection, flags, get_key, render_fn, fallback_fn, re
set _hydrating ( true ) ;
}
} ) ;
effect . ondestroy = ( ) => {
for ( var item of state . items ) {
if ( item . e . dom !== null ) {
remove ( item . e . dom ) ;
destroy _effect ( item . e ) ;
}
}
if ( fallback ) destroy _effect ( fallback ) ;
} ;
}
/ * *
* @ template V
* @ param { Element | Comment } anchor
* @ param { ( ) => V [ ] } get _collection
* @ param { number } flags
* @ param { null | ( ( item : V ) => string ) } get _key
* @ param { ( anchor : null , item : V , index : import ( '#client' ) . MaybeSource < number > ) => void } render _fn
* @ param { null | ( ( anchor : Node | null ) => void ) } fallback _fn
* @ returns { void }
* /
export function each _keyed ( anchor , get _collection , flags , get _key , render _fn , fallback _fn ) {
each ( anchor , get _collection , flags , get _key , render _fn , fallback _fn , reconcile _tracked _array ) ;
}
/ * *
* @ template V
* @ param { Element | Comment } anchor
* @ param { ( ) => V [ ] } get _collection
* @ param { number } flags
* @ param { ( anchor : null , item : V , index : import ( '#client' ) . MaybeSource < number > ) => void } render _fn
* @ param { null | ( ( anchor : Node | null ) => void ) } fallback _fn
* @ returns { void }
* /
export function each _indexed ( anchor , get _collection , flags , render _fn , fallback _fn ) {
each ( anchor , get _collection , flags , null , render _fn , fallback _fn , reconcile _indexed _array ) ;
}
/ * *
@ -222,321 +218,187 @@ export function each_indexed(anchor, get_collection, flags, render_fn, fallback_
* @ param { Array < V > } array
* @ param { import ( '#client' ) . EachState } state
* @ param { Element | Comment | Text } anchor
* @ param { ( anchor : null , item : V , index : number | import ( '#client' ) . Source < number > ) => void } render _fn
* @ param { ( anchor : Node , item : import ( '#client' ) . MaybeSource < V > , index : number | import ( '#client' ) . Source < number > ) => void } render _fn
* @ param { number } flags
* @ param { ( value : V , index : number ) => any } get _key
* @ returns { void }
* /
function reconcile _indexed _array ( array , state , anchor , render _fn , flags ) {
var a _items = state . items ;
function reconcile ( array , state , anchor , render _fn , flags , get _key ) {
var is _animated = ( flags & EACH _IS _ANIMATED ) !== 0 ;
var should _update = ( flags & ( EACH _ITEM _REACTIVE | EACH _INDEX _REACTIVE ) ) !== 0 ;
var a = a _items . length ;
var b = array . length ;
var min = Math . min ( a , b ) ;
var length = array . length ;
var items = state . items ;
var first = state . next ;
var current = first ;
/** @type { typeof a_items } */
var b_items = Array ( b ) ;
/** @type { Set<import('#client').EachItem> } */
var seen = new Set ( ) ;
var item ;
var valu e;
/** @type {import('#client').EachState | import('#client').EachItem} */
var prev = stat e;
// update items
for ( var i = 0 ; i < min ; i += 1 ) {
value = array [ i ] ;
item = a _items [ i ] ;
b _items [ i ] = item ;
update _item ( item , value , i , flags ) ;
resume _effect ( item . e ) ;
}
if ( b > a ) {
// add items
for ( ; i < b ; i += 1 ) {
value = array [ i ] ;
item = create _item ( value , null , i , render _fn , flags ) ;
b _items [ i ] = item ;
insert _item ( item , anchor ) ;
}
state . items = b _items ;
} else if ( a > b ) {
// remove items
var effects = [ ] ;
for ( i = b ; i < a ; i += 1 ) {
effects . push ( a _items [ i ] . e ) ;
}
/** @type {import('#client').EachItem[]} */
var to _animate = [ ] ;
pause _effects ( effects , ( ) => {
state . items . length = b ;
} ) ;
}
}
/** @type {import('#client').EachItem[]} */
var matched = [ ] ;
/ * *
* Reconcile arrays by the equality of the elements in the array . This algorithm
* is based on Ivi ' s reconcilation logic :
* https : //github.com/localvoid/ivi/blob/9f1bd0918f487da5b131941228604763c5d8ef56/packages/ivi/src/client/core.ts#L968
* @ template V
* @ param { Array < V > } array
* @ param { import ( '#client' ) . EachState } state
* @ param { Element | Comment | Text } anchor
* @ param { ( anchor : null , item : V , index : number | import ( '#client' ) . Source < number > ) => void } render _fn
* @ param { number } flags
* @ param { any [ ] } keys
* @ returns { void }
* /
function reconcile _tracked _array ( array , state , anchor , render _fn , flags , keys ) {
var a _items = state . items ;
/** @type {import('#client').EachItem[]} */
var stashed = [ ] ;
var a = a _items . length ;
var b = array . length ;
/** @type {V} */
var value ;
/** @type { Array<import('#client').EachItem> } */
var b_items = Array ( b ) ;
/** @type {any} */
var key ;
var is _animated = ( flags & EACH _IS _ANIMATED ) !== 0 ;
var should _update = ( flags & ( EACH _ITEM _REACTIVE | EACH _INDEX _REACTIVE ) ) !== 0 ;
var start = 0 ;
/** @type {import('#client').EachItem | undefined} */
var item ;
/** @type {import('#client').Effect[]} */
var to _destroy = [ ] ;
// Step 1 — trim common suffix
while ( a > 0 && b > 0 && a _items [ a - 1 ] . k === keys [ b - 1 ] ) {
item = b _items [ -- b ] = a _items [ -- a ] ;
anchor = get _first _child ( item ) ;
/** @type {number} */
var i ;
resume _effect ( item . e ) ;
if ( is _animated ) {
for ( i = 0 ; i < length ; i += 1 ) {
value = array [ i ] ;
key = get _key ( value , i ) ;
item = items . get ( key ) ;
if ( should _update ) {
update _item ( item , array [ b ] , b , flags ) ;
if ( item !== undefined ) {
item . a ? . measure ( ) ;
to _animate . push ( item ) ;
}
}
}
// Step 2 — trim common prefix
while ( start < a && start < b && a _items [ start ] . k === keys [ start ] ) {
item = b _items [ start ] = a _items [ start ] ;
resume _effect ( item . e ) ;
for ( i = 0 ; i < length ; i += 1 ) {
value = array [ i ] ;
key = get _key ( value , i ) ;
item = items . get ( key ) ;
if ( item === undefined ) {
prev = create _item (
current ? get _first _child ( current ) : anchor ,
prev ,
prev . next ,
value ,
key ,
i ,
render _fn ,
flags
) ;
items . set ( key , prev ) ;
matched = [ ] ;
stashed = [ ] ;
current = prev . next ;
continue ;
}
if ( should _update ) {
update _item ( item , array [ start ] , start , flags ) ;
update _item ( item , value, i , flags ) ;
}
start += 1 ;
}
resume _effect ( item . e ) ;
// Step 3 — update
if ( start === a ) {
// add only
while ( start < b ) {
item = create _item ( array [ start ] , keys [ start ] , start , render _fn , flags ) ;
b _items [ start ++ ] = item ;
insert _item ( item , anchor ) ;
}
} else if ( start === b ) {
// remove only
while ( start < a ) {
to _destroy . push ( a _items [ start ++ ] . e ) ;
}
} else {
// reconcile
var moved = false ;
var sources = new Int32Array ( b - start ) ;
var indexes = new Map ( ) ;
var i ;
var index ;
var last _item ;
var last _sibling ;
// store the indexes of each item in the new world
for ( i = start ; i < b ; i += 1 ) {
sources [ i - start ] = NEW _ITEM ;
map _set ( indexes , keys [ i ] , i ) ;
}
if ( item !== current ) {
if ( seen . has ( item ) ) {
if ( matched . length < stashed . length ) {
// more efficient to move later items to the front
var start = stashed [ 0 ] ;
var local _anchor = get _first _child ( start ) ;
var j ;
/** @type {Array<import('#client').EachItem>} */
var to _animate = [ ] ;
if ( is _animated ) {
// for all items that were in both the old and the new list,
// measure them and store them in `to_animate` so we can
// apply animations once the DOM has been updated
for ( i = 0 ; i < a _items . length ; i += 1 ) {
item = a _items [ i ] ;
if ( indexes . has ( item . k ) ) {
item . a ? . measure ( ) ;
to _animate . push ( item ) ;
}
}
}
prev = start . prev ;
// populate the `sources` array for each old item with
// its new index, so that we can calculate moves
for ( i = start ; i < a ; i += 1 ) {
item = a _items [ i ] ;
index = map _get ( indexes , item . k ) ;
var a = matched [ 0 ] ;
var b = matched [ matched . length - 1 ] ;
resume _effect ( item . e ) ;
link ( a . prev , b . next ) ;
link ( prev , a ) ;
link ( b , start ) ;
if ( index === undefined ) {
to _destroy . push ( item . e ) ;
} else {
moved = true ;
sources [ index - start ] = i ;
b _items [ index ] = item ;
for ( j = 0 ; j < matched . length ; j += 1 ) {
move ( matched [ j ] , local _anchor ) ;
}
if ( is _animated ) {
to _animate . push ( item ) ;
}
}
}
for ( j = 0 ; j < stashed . length ; j += 1 ) {
seen . delete ( stashed [ j ] ) ;
}
// if we need to move items (as opposed to just adding/removing),
// figure out how to do so efficiently (I would be lying if I said
// I fully understand this part)
if ( moved ) {
mark _lis ( sources ) ;
}
current = start ;
prev = b ;
i -= 1 ;
matched = [ ] ;
stashed = [ ] ;
} else {
// more efficient to move earlier items to the back
seen . delete ( item ) ;
move ( item , current ? get _first _child ( current ) : anchor ) ;
// working from the back, insert new or moved items
while ( b -- > start ) {
index = sources [ b - start ] ;
var insert = index === NEW _ITEM ;
if ( insert ) {
item = create _item ( array [ b ] , keys [ b ] , b , render _fn , flags ) ;
} else {
item = b _items [ b ] ;
if ( should _update ) {
update _item ( item , array [ b ] , b , flags ) ;
link ( item . prev , item . next ) ;
link ( item , prev . next ) ;
link ( prev , item ) ;
prev = item ;
}
continue ;
}
if ( insert || ( moved && index !== LIS _ITEM ) ) {
last _sibling = last _item === undefined ? anchor : get _first _child ( last _item ) ;
anchor = insert _item ( item , last _sibling ) ;
matched = [ ] ;
stashed = [ ] ;
while ( current !== null && current . k !== key ) {
seen . add ( current ) ;
stashed . push ( current ) ;
current = current . next ;
}
last _item = b _items [ b ] = item ;
}
if ( current === null ) {
continue ;
}
if ( to _animate . length > 0 ) {
// TODO we need to briefly take any outroing elements out of the flow, so that
// we can figure out the eventual destination of the animating elements
// - https://github.com/sveltejs/svelte/pull/10798#issuecomment-2013681778
// - https://svelte.dev/repl/6e891305e9644a7ca7065fa95c79d2d2?version=4.2.9
user _effect ( ( ) => {
untrack ( ( ) => {
for ( item of to _animate ) {
item . a ? . apply ( ) ;
}
} ) ;
} ) ;
item = current ;
}
}
pause _effects ( to _destroy , ( ) => {
state . items = b _items ;
} ) ;
}
/ * *
* The server could have rendered more list items than the client specifies .
* In that case , we need to remove the remaining server - rendered nodes .
* @ param { import ( '#client' ) . TemplateNode [ ] } hydration _list
* @ param { import ( '#client' ) . TemplateNode | null } next _node
* /
function remove _excess _hydration _nodes ( hydration _list , next _node ) {
if ( next _node === null ) return ;
var idx = hydration _list . indexOf ( next _node ) ;
if ( idx !== - 1 && hydration _list . length > idx + 1 ) {
remove ( hydration _list . slice ( idx ) ) ;
matched . push ( item ) ;
prev = item ;
current = item . next ;
}
}
/ * *
* Longest Increased Subsequence algorithm
* @ param { Int32Array } a
* @ returns { void }
* /
function mark _lis ( a ) {
var length = a . length ;
var parent = new Int32Array ( length ) ;
var index = new Int32Array ( length ) ;
var index _length = 0 ;
var i = 0 ;
/** @type {number} */
var j ;
/** @type {number} */
var k ;
/** @type {number} */
var lo ;
/** @type {number} */
var hi ;
const to _destroy = Array . from ( seen ) ;
// Skip -1 values at the start of the input array `a`.
for ( ; a [ i ] === NEW _ITEM ; ++ i ) {
/**/
while ( current ) {
to _destroy . push ( current ) ;
current = current . next ;
}
index [ 0 ] = i ++ ;
var controlled _anchor = ( flags & EACH _IS _CONTROLLED ) !== 0 && length === 0 ? anchor : null ;
for ( ; i < length ; ++ i ) {
k = a [ i ] ;
if ( k !== NEW _ITEM ) {
// Ignore -1 values.
j = index [ index _length ] ;
if ( a [ j ] < k ) {
parent [ i ] = j ;
index [ ++ index _length ] = i ;
} else {
lo = 0 ;
hi = index _length ;
while ( lo < hi ) {
j = ( lo + hi ) >> 1 ;
if ( a [ index [ j ] ] < k ) {
lo = j + 1 ;
} else {
hi = j ;
}
}
if ( k < a [ index [ lo ] ] ) {
if ( lo > 0 ) {
parent [ i ] = index [ lo - 1 ] ;
}
index [ lo ] = i ;
}
}
pause _effects ( to _destroy , controlled _anchor , ( ) => {
for ( var i = 0 ; i < to _destroy . length ; i += 1 ) {
var item = to _destroy [ i ] ;
items . delete ( item . k ) ;
link ( item . prev , item . next ) ;
}
}
// Mutate input array `a` and assign -2 value to all nodes that are part of LIS.
j = index [ index _length ] ;
} ) ;
while ( index _length -- >= 0 ) {
a [ j ] = LIS _ITEM ;
j = parent [ j ] ;
if ( is _animated ) {
effect ( ( ) => {
untrack ( ( ) => {
for ( item of to _animate ) {
item . a ? . apply ( ) ;
}
} ) ;
} ) ;
}
}
/ * *
* @ param { import ( '#client' ) . EachItem } item
* @ param { Text | Element | Comment } anchor
* @ returns { Text | Element | Comment }
* /
function insert _item ( item , anchor ) {
var current = /** @type {import('#client').Dom} */ ( item . e . dom ) ;
return insert ( current , anchor ) ;
}
/ * *
* @ param { import ( '#client' ) . EachItem } item
* @ returns { Text | Element | Comment }
@ -572,51 +434,74 @@ function update_item(item, value, index, type) {
/ * *
* @ template V
* @ param { Node } anchor
* @ param { import ( '#client' ) . EachItem | import ( '#client' ) . EachState } prev
* @ param { import ( '#client' ) . EachItem | null } next
* @ param { V } value
* @ param { unknown } key
* @ param { number } index
* @ param { ( anchor : null , item : V , index : number | import ( '#client' ) . Value < number > ) => void } render _fn
* @ param { ( anchor : Node , item : V | import ( '#client' ) . Source < V > , index : number | import ( '#client' ) . Value < number > ) => void } render _fn
* @ param { number } flags
* @ returns { import ( '#client' ) . EachItem }
* /
function create _item ( value , key , index , render _fn , flags ) {
var each _item _not _reactive = ( flags & EACH _ITEM _REACTIVE ) === 0 ;
/** @type {import('#client').EachItem} */
var item = {
a : null ,
// dom
// @ts-expect-error
e : null ,
// index
i : ( flags & EACH _INDEX _REACTIVE ) === 0 ? index : source ( index ) ,
// key
k : key ,
// item
v : each _item _not _reactive
? value
: ( flags & EACH _IS _STRICT _EQUALS ) !== 0
? source ( value )
: mutable _source ( value )
} ;
function create _item ( anchor , prev , next , value , key , index , render _fn , flags ) {
var previous _each _item = current _each _item ;
try {
current _each _item = item ;
var reactive = ( flags & EACH _ITEM _REACTIVE ) !== 0 ;
var mutable = ( flags & EACH _IS _STRICT _EQUALS ) === 0 ;
var v = reactive ? ( mutable ? mutable _source ( value ) : source ( value ) ) : value ;
var i = ( flags & EACH _INDEX _REACTIVE ) === 0 ? index : source ( index ) ;
/** @type {import('#client').EachItem} */
var item = {
i ,
v ,
k : key ,
a : null ,
// @ts-expect-error
e : null ,
prev ,
next
} ;
prev . next = item ;
if ( next !== null ) next . prev = item ;
item . e = render _effect ( ( ) => {
var dom = render _fn ( null , item . v , item . i ) ;
return ( ) => {
if ( dom !== undefined ) {
remove ( dom ) ;
}
} ;
} , true ) ;
current _each _item = item ;
item . e = branch ( ( ) => render _fn ( anchor , v , i ) ) ;
return item ;
} finally {
current _each _item = previous _each _item ;
}
}
/ * *
* @ param { import ( '#client' ) . EachItem } item
* @ param { Text | Element | Comment } anchor
* /
function move ( item , anchor ) {
var dom = item . e . dom ;
if ( dom !== null ) {
if ( is _array ( dom ) ) {
for ( var i = 0 ; i < dom . length ; i ++ ) {
anchor . before ( dom [ i ] ) ;
}
} else {
anchor . before ( dom ) ;
}
}
}
/ * *
*
* @ param { import ( '#client' ) . EachItem | import ( '#client' ) . EachState } prev
* @ param { import ( '#client' ) . EachItem | null } next
* /
function link ( prev , next ) {
prev . next = next ;
if ( next !== null ) next . prev = prev ;
}
Daniel
2 years ago
committed by
GitHub