msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

rename Fragment to Block

Browse Source
pull/453/head
Rich-Harris 8 years ago
parent bd85ffbf28
commit 552820cd7f
5 changed files with 86 additions and 86 deletions
Show Stats Download Patch File Download Diff File

4
src/generators/dom/Fragment.js → src/generators/dom/Block.js
Unescape View File

@ -1,7 +1,7 @@
import CodeBuilder from '../../utils/CodeBuilder.js';
import deindent from '../../utils/deindent.js';
export default class Fragment {
export default class Block {
constructor ({ generator, name, key, expression, context, contextDependencies, component, contexts, indexes, params, indexNames, listNames, getUniqueName }) {
this.generator = generator;
this.name = name;
@ -48,7 +48,7 @@ export default class Fragment {
}
child ( options ) {
return new Fragment( Object.assign( {}, this, options, { parent: this } ) );
return new Block( Object.assign( {}, this, options, { parent: this } ) );
}
createAnchor ( name, parentNode ) {

12
src/generators/dom/index.js
Unescape View File

@ -2,7 +2,7 @@ import deindent from '../../utils/deindent.js';
import CodeBuilder from '../../utils/CodeBuilder.js';
import visit from './visit.js';
import Generator from '../Generator.js';
import Fragment from './Fragment.js';
import Block from './Block.js';
import * as shared from '../../shared/index.js';
class DomGenerator extends Generator {
@ -17,8 +17,8 @@ class DomGenerator extends Generator {
};
}
addBlock ( fragment ) {
this.blocks.push( fragment );
addBlock ( block ) {
this.blocks.push( block );
}
helper ( name ) {
@ -43,7 +43,7 @@ export default function dom ( parsed, source, options ) {
const getUniqueName = generator.getUniqueNameMaker( [ 'root' ] );
const component = getUniqueName( 'component' );
const mainFragment = new Fragment({
const mainBlock = new Block({
generator,
name: generator.alias( 'create_main_fragment' ),
key: null,
@ -67,10 +67,10 @@ export default function dom ( parsed, source, options ) {
};
parsed.html.children.forEach( node => {
visit( generator, mainFragment, state, node );
visit( generator, mainBlock, state, node );
});
generator.addBlock( mainFragment );
generator.addBlock( mainBlock );
const builders = {
main: new CodeBuilder(),

42
src/generators/dom/visitors/Component.js
Unescape View File

@ -19,9 +19,9 @@ function stringifyProps ( props ) {
return `{ ${joined} }`;
}
export default function visitComponent ( generator, fragment, state, node ) {
export default function visitComponent ( generator, block, state, node ) {
const hasChildren = node.children.length > 0;
const name = fragment.getUniqueName( capDown( node.name === ':Self' ? generator.name : node.name ) );
const name = block.getUniqueName( capDown( node.name === ':Self' ? generator.name : node.name ) );
const local = {
name,
@ -38,14 +38,14 @@ export default function visitComponent ( generator, fragment, state, node ) {
generator.hasComponents = true;
addComponentAttributes( generator, fragment, node, local );
addComponentAttributes( generator, block, node, local );
if ( local.allUsedContexts.length ) {
const initialProps = local.allUsedContexts.map( contextName => {
if ( contextName === 'root' ) return `root: root`;
const listName = fragment.listNames.get( contextName );
const indexName = fragment.indexNames.get( contextName );
const listName = block.listNames.get( contextName );
const indexName = block.indexNames.get( contextName );
return `${listName}: ${listName},\n${indexName}: ${indexName}`;
}).join( ',\n' );
@ -53,8 +53,8 @@ export default function visitComponent ( generator, fragment, state, node ) {
const updates = local.allUsedContexts.map( contextName => {
if ( contextName === 'root' ) return `${name}._context.root = root;`;
const listName = fragment.listNames.get( contextName );
const indexName = fragment.indexNames.get( contextName );
const listName = block.listNames.get( contextName );
const indexName = block.indexNames.get( contextName );
return `${name}._context.${listName} = ${listName};\n${name}._context.${indexName} = ${indexName};`;
}).join( '\n' );
@ -70,14 +70,14 @@ export default function visitComponent ( generator, fragment, state, node ) {
const componentInitProperties = [
`target: ${!isToplevel ? state.parentNode: 'null'}`,
`_root: ${fragment.component}._root || ${fragment.component}`
`_root: ${block.component}._root || ${block.component}`
];
// Component has children, put them in a separate {{yield}} block
if ( hasChildren ) {
const params = fragment.params.join( ', ' );
const params = block.params.join( ', ' );
const childFragment = fragment.child({
const childBlock = block.child({
name: generator.getUniqueName( `render_${name}_yield_fragment` ) // TODO should getUniqueName happen inside Fragment? probably
});
@ -86,22 +86,22 @@ export default function visitComponent ( generator, fragment, state, node ) {
});
node.children.forEach( child => {
visit( generator, childFragment, childState, child );
visit( generator, childBlock, childState, child );
});
const yieldFragment = fragment.getUniqueName( `${name}_yield_fragment` );
const yieldFragment = block.getUniqueName( `${name}_yield_fragment` );
fragment.builders.create.addLine(
`var ${yieldFragment} = ${childFragment.name}( ${params}, ${fragment.component} );`
block.builders.create.addLine(
`var ${yieldFragment} = ${childBlock.name}( ${params}, ${block.component} );`
);
fragment.builders.update.addLine(
block.builders.update.addLine(
`${yieldFragment}.update( changed, ${params} );`
);
componentInitProperties.push( `_yield: ${yieldFragment}`);
generator.addBlock( childFragment );
generator.addBlock( childBlock );
}
const statements = [];
@ -114,7 +114,7 @@ export default function visitComponent ( generator, fragment, state, node ) {
const initialPropString = stringifyProps( initialProps );
if ( local.bindings.length ) {
const initialData = fragment.getUniqueName( `${name}_initial_data` );
const initialData = block.getUniqueName( `${name}_initial_data` );
statements.push( `var ${name}_initial_data = ${initialPropString};` );
@ -138,7 +138,7 @@ export default function visitComponent ( generator, fragment, state, node ) {
` );
if ( isToplevel ) {
fragment.builders.mount.addLine( `${name}._fragment.mount( target, anchor );` );
block.builders.mount.addLine( `${name}._fragment.mount( target, anchor );` );
}
if ( local.dynamicAttributes.length ) {
@ -163,8 +163,8 @@ export default function visitComponent ( generator, fragment, state, node ) {
` );
}
fragment.builders.destroy.addLine( `${name}.destroy( ${isToplevel ? 'detach' : 'false'} );` );
block.builders.destroy.addLine( `${name}.destroy( ${isToplevel ? 'detach' : 'false'} );` );
fragment.builders.create.addBlock( local.create );
if ( !local.update.isEmpty() ) fragment.builders.update.addBlock( local.update );
block.builders.create.addBlock( local.create );
if ( !local.update.isEmpty() ) block.builders.update.addBlock( local.update );
}

96
src/generators/dom/visitors/EachBlock.js
Unescape View File

@ -2,52 +2,52 @@ import CodeBuilder from '../../../utils/CodeBuilder.js';
import deindent from '../../../utils/deindent.js';
import visit from '../visit.js';
export default function visitEachBlock ( generator, fragment, state, node ) {
export default function visitEachBlock ( generator, block, state, node ) {
const name = generator.getUniqueName( `each_block` );
const renderer = generator.getUniqueName( `render_each_block` );
const elseName = generator.getUniqueName( `${name}_else` );
const renderElse = generator.getUniqueName( `${renderer}_else` );
const i = fragment.getUniqueName( `i` );
const params = fragment.params.join( ', ' );
const i = block.getUniqueName( `i` );
const params = block.params.join( ', ' );
const listName = fragment.getUniqueName( `${name}_value` );
const listName = block.getUniqueName( `${name}_value` );
const isToplevel = !state.parentNode;
generator.addSourcemapLocations( node.expression );
const { dependencies, snippet } = generator.contextualise( fragment, node.expression );
const { dependencies, snippet } = generator.contextualise( block, node.expression );
const anchor = fragment.getUniqueName( `${name}_anchor` );
fragment.createAnchor( anchor, state.parentNode );
const anchor = block.getUniqueName( `${name}_anchor` );
block.createAnchor( anchor, state.parentNode );
const localVars = {};
localVars.iteration = fragment.getUniqueName( `${name}_iteration` );
localVars.iterations = fragment.getUniqueName( `${name}_iterations` );
localVars._iterations = fragment.getUniqueName( `_${name}_iterations` );
localVars.lookup = fragment.getUniqueName( `${name}_lookup` );
localVars._lookup = fragment.getUniqueName( `_${name}_lookup` );
localVars.iteration = block.getUniqueName( `${name}_iteration` );
localVars.iterations = block.getUniqueName( `${name}_iterations` );
localVars._iterations = block.getUniqueName( `_${name}_iterations` );
localVars.lookup = block.getUniqueName( `${name}_lookup` );
localVars._lookup = block.getUniqueName( `_${name}_lookup` );
fragment.builders.create.addLine( `var ${listName} = ${snippet};` );
fragment.builders.create.addLine( `var ${localVars.iterations} = [];` );
if ( node.key ) fragment.builders.create.addLine( `var ${localVars.lookup} = Object.create( null );` );
if ( node.else ) fragment.builders.create.addLine( `var ${elseName} = null;` );
block.builders.create.addLine( `var ${listName} = ${snippet};` );
block.builders.create.addLine( `var ${localVars.iterations} = [];` );
if ( node.key ) block.builders.create.addLine( `var ${localVars.lookup} = Object.create( null );` );
if ( node.else ) block.builders.create.addLine( `var ${elseName} = null;` );
const initialRender = new CodeBuilder();
if ( node.key ) {
localVars.fragment = fragment.getUniqueName( 'fragment' );
localVars.value = fragment.getUniqueName( 'value' );
localVars.key = fragment.getUniqueName( 'key' );
localVars.fragment = block.getUniqueName( 'fragment' );
localVars.value = block.getUniqueName( 'value' );
localVars.key = block.getUniqueName( 'key' );
initialRender.addBlock( deindent`
var ${localVars.key} = ${listName}[${i}].${node.key};
${localVars.iterations}[${i}] = ${localVars.lookup}[ ${localVars.key} ] = ${renderer}( ${params}, ${listName}, ${listName}[${i}], ${i}, ${fragment.component}${node.key ? `, ${localVars.key}` : `` } );
${localVars.iterations}[${i}] = ${localVars.lookup}[ ${localVars.key} ] = ${renderer}( ${params}, ${listName}, ${listName}[${i}], ${i}, ${block.component}${node.key ? `, ${localVars.key}` : `` } );
` );
} else {
initialRender.addLine(
`${localVars.iterations}[${i}] = ${renderer}( ${params}, ${listName}, ${listName}[${i}], ${i}, ${fragment.component} );`
`${localVars.iterations}[${i}] = ${renderer}( ${params}, ${listName}, ${listName}[${i}], ${i}, ${block.component} );`
);
}
@ -57,29 +57,29 @@ export default function visitEachBlock ( generator, fragment, state, node ) {
);
}
fragment.builders.create.addBlock( deindent`
block.builders.create.addBlock( deindent`
for ( var ${i} = 0; ${i} < ${listName}.length; ${i} += 1 ) {
${initialRender}
}
` );
if ( node.else ) {
fragment.builders.create.addBlock( deindent`
block.builders.create.addBlock( deindent`
if ( !${listName}.length ) {
${elseName} = ${renderElse}( ${params}, ${fragment.component} );
${elseName} = ${renderElse}( ${params}, ${block.component} );
${!isToplevel ? `${elseName}.mount( ${anchor}.parentNode, ${anchor} );` : ''}
}
` );
}
if ( isToplevel ) {
fragment.builders.mount.addBlock( deindent`
block.builders.mount.addBlock( deindent`
for ( var ${i} = 0; ${i} < ${localVars.iterations}.length; ${i} += 1 ) {
${localVars.iterations}[${i}].mount( ${anchor}.parentNode, ${anchor} );
}
` );
if ( node.else ) {
fragment.builders.mount.addBlock( deindent`
block.builders.mount.addBlock( deindent`
if ( ${elseName} ) {
${elseName}.mount( ${anchor}.parentNode, ${anchor} );
}
@ -88,7 +88,7 @@ export default function visitEachBlock ( generator, fragment, state, node ) {
}
if ( node.key ) {
fragment.builders.update.addBlock( deindent`
block.builders.update.addBlock( deindent`
var ${listName} = ${snippet};
var ${localVars._iterations} = [];
var ${localVars._lookup} = Object.create( null );
@ -104,7 +104,7 @@ export default function visitEachBlock ( generator, fragment, state, node ) {
${localVars._iterations}[${i}] = ${localVars._lookup}[ ${localVars.key} ] = ${localVars.lookup}[ ${localVars.key} ];
${localVars._lookup}[ ${localVars.key} ].update( changed, ${params}, ${listName}, ${listName}[${i}], ${i} );
} else {
${localVars._iterations}[${i}] = ${localVars._lookup}[ ${localVars.key} ] = ${renderer}( ${params}, ${listName}, ${listName}[${i}], ${i}, ${fragment.component}${node.key ? `, ${localVars.key}` : `` } );
${localVars._iterations}[${i}] = ${localVars._lookup}[ ${localVars.key} ] = ${renderer}( ${params}, ${listName}, ${listName}[${i}], ${i}, ${block.component}${node.key ? `, ${localVars.key}` : `` } );
}
${localVars._iterations}[${i}].mount( ${localVars.fragment}, null );
@ -124,12 +124,12 @@ export default function visitEachBlock ( generator, fragment, state, node ) {
${localVars.lookup} = ${localVars._lookup};
` );
} else {
fragment.builders.update.addBlock( deindent`
block.builders.update.addBlock( deindent`
var ${listName} = ${snippet};
for ( var ${i} = 0; ${i} < ${listName}.length; ${i} += 1 ) {
if ( !${localVars.iterations}[${i}] ) {
${localVars.iterations}[${i}] = ${renderer}( ${params}, ${listName}, ${listName}[${i}], ${i}, ${fragment.component} );
${localVars.iterations}[${i}] = ${renderer}( ${params}, ${listName}, ${listName}[${i}], ${i}, ${block.component} );
${localVars.iterations}[${i}].mount( ${anchor}.parentNode, ${anchor} );
} else {
${localVars.iterations}[${i}].update( changed, ${params}, ${listName}, ${listName}[${i}], ${i} );
@ -143,11 +143,11 @@ export default function visitEachBlock ( generator, fragment, state, node ) {
}
if ( node.else ) {
fragment.builders.update.addBlock( deindent`
block.builders.update.addBlock( deindent`
if ( !${listName}.length && ${elseName} ) {
${elseName}.update( changed, ${params} );
} else if ( !${listName}.length ) {
${elseName} = ${renderElse}( ${params}, ${fragment.component} );
${elseName} = ${renderElse}( ${params}, ${block.component} );
${elseName}.mount( ${anchor}.parentNode, ${anchor} );
} else if ( ${elseName} ) {
${elseName}.destroy( true );
@ -155,39 +155,39 @@ export default function visitEachBlock ( generator, fragment, state, node ) {
` );
}
fragment.builders.destroy.addBlock(
block.builders.destroy.addBlock(
`${generator.helper( 'destroyEach' )}( ${localVars.iterations}, ${isToplevel ? 'detach' : 'false'} );` );
if ( node.else ) {
fragment.builders.destroy.addBlock( deindent`
block.builders.destroy.addBlock( deindent`
if ( ${elseName} ) {
${elseName}.destroy( ${isToplevel ? 'detach' : 'false'} );
}
` );
}
const indexNames = new Map( fragment.indexNames );
const indexName = node.index || fragment.getUniqueName( `${node.context}_index` );
const indexNames = new Map( block.indexNames );
const indexName = node.index || block.getUniqueName( `${node.context}_index` );
indexNames.set( node.context, indexName );
const listNames = new Map( fragment.listNames );
const listNames = new Map( block.listNames );
listNames.set( node.context, listName );
const context = generator.getUniqueName( node.context );
const contexts = new Map( fragment.contexts );
const contexts = new Map( block.contexts );
contexts.set( node.context, context );
const indexes = new Map( fragment.indexes );
const indexes = new Map( block.indexes );
if ( node.index ) indexes.set( indexName, node.context );
const contextDependencies = new Map( fragment.contextDependencies );
const contextDependencies = new Map( block.contextDependencies );
contextDependencies.set( node.context, dependencies );
const blockParams = fragment.params.concat( listName, context, indexName );
const blockParams = block.params.concat( listName, context, indexName );
const getUniqueName = generator.getUniqueNameMaker( blockParams );
const childFragment = fragment.child({
const childBlock = block.child({
name: renderer,
expression: node.expression,
context: node.context,
@ -211,21 +211,21 @@ export default function visitEachBlock ( generator, fragment, state, node ) {
});
node.children.forEach( child => {
visit( generator, childFragment, childState, child );
visit( generator, childBlock, childState, child );
});
generator.addBlock( childFragment );
generator.addBlock( childBlock );
if ( node.else ) {
const childFragment = fragment.child({
const childBlock = block.child({
name: renderElse,
getUniqueName: generator.getUniqueNameMaker( fragment.params )
getUniqueName: generator.getUniqueNameMaker( block.params )
});
node.else.children.forEach( child => {
visit( generator, childFragment, childState, child );
visit( generator, childBlock, childState, child );
});
generator.addBlock( childFragment );
generator.addBlock( childBlock );
}
}

18
src/generators/dom/visitors/IfBlock.js
Unescape View File

@ -1,21 +1,21 @@
import deindent from '../../../utils/deindent.js';
import visit from '../visit.js';
function getConditionsAndBlocks ( generator, fragment, state, node, _name, i = 0 ) {
function getConditionsAndBlocks ( generator, block, state, node, _name, i = 0 ) {
generator.addSourcemapLocations( node.expression );
const name = generator.getUniqueName( `${_name}_${i}` );
const conditionsAndBlocks = [{
condition: generator.contextualise( fragment, node.expression ).snippet,
condition: generator.contextualise( block, node.expression ).snippet,
block: name
}];
generateBlock( generator, fragment, state, node, name );
generateBlock( generator, block, state, node, name );
if ( node.else && node.else.children.length === 1 &&
node.else.children[0].type === 'IfBlock' ) {
conditionsAndBlocks.push(
...getConditionsAndBlocks( generator, fragment, state, node.else.children[0], _name, i + 1 )
...getConditionsAndBlocks( generator, block, state, node.else.children[0], _name, i + 1 )
);
} else {
const name = generator.getUniqueName( `${_name}_${i + 1}` );
@ -25,14 +25,14 @@ function getConditionsAndBlocks ( generator, fragment, state, node, _name, i = 0
});
if ( node.else ) {
generateBlock( generator, fragment, state, node.else, name );
generateBlock( generator, block, state, node.else, name );
}
}
return conditionsAndBlocks;
}
function generateBlock ( generator, fragment, state, node, name ) {
const childFragment = fragment.child({
function generateBlock ( generator, block, state, node, name ) {
const childBlock = block.child({
name
});
@ -42,10 +42,10 @@ function generateBlock ( generator, fragment, state, node, name ) {
// walk the children here
node.children.forEach( node => {
visit( generator, childFragment, childState, node );
visit( generator, childBlock, childState, node );
});
generator.addBlock( childFragment );
generator.addBlock( childBlock );
}
export default function visitIfBlock ( generator, fragment, state, node ) {

Write Preview
Loading…
Cancel
Save