diff --git a/src/generators/dom/State.ts b/src/generators/dom/State.ts deleted file mode 100644 index 0c894e8f1f..0000000000 --- a/src/generators/dom/State.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { assign } from '../../shared/index.js'; - -interface StateData { - parentNode?: string; - parentNodes?: string; -} - -export default class State { - parentNode?: string; - parentNodes?: string; - - constructor(data: StateData = {}) { - assign(this, data) - } - - child(data?: StateData) { - return new State(assign({}, this, { - parentNode: null, - parentNodes: 'nodes' - }, data)); - } -} \ No newline at end of file diff --git a/src/generators/nodes/Attribute.ts b/src/generators/nodes/Attribute.ts index 043694f083..8c052f2c7c 100644 --- a/src/generators/nodes/Attribute.ts +++ b/src/generators/nodes/Attribute.ts @@ -42,10 +42,7 @@ export default class Attribute { this.value = value; } - render( - block: Block, - state: State - ) { + render(block: Block) { const node = this.parent; const name = this.name; @@ -151,7 +148,7 @@ export default class Attribute { name === 'value' && node.name === 'select'; const last = (shouldCache || isSelectValueAttribute) && block.getUniqueName( - `${state.parentNode}_${name.replace(/[^a-zA-Z_$]/g, '_')}_value` + `${node.var}_${name.replace(/[^a-zA-Z_$]/g, '_')}_value` ); if (shouldCache || isSelectValueAttribute) block.addVariable(last); @@ -161,9 +158,9 @@ export default class Attribute { if (isLegacyInputType) { block.builders.hydrate.addLine( - `@setInputType(${state.parentNode}, ${init});` + `@setInputType(${node.var}, ${init});` ); - updater = `@setInputType(${state.parentNode}, ${shouldCache ? last : value});`; + updater = `@setInputType(${node.var}, ${shouldCache ? last : value});`; } else if (isSelectValueAttribute) { // annoying special case const isMultipleSelect = @@ -184,8 +181,8 @@ export default class Attribute { }`; updater = deindent` - for (var ${i} = 0; ${i} < ${state.parentNode}.options.length; ${i} += 1) { - var ${option} = ${state.parentNode}.options[${i}]; + for (var ${i} = 0; ${i} < ${node.var}.options.length; ${i} += 1) { + var ${option} = ${node.var}.options[${i}]; ${ifStatement} } @@ -199,19 +196,19 @@ export default class Attribute { block.builders.update.addLine(`${last} = ${value};`); } else if (propertyName) { block.builders.hydrate.addLine( - `${state.parentNode}.${propertyName} = ${init};` + `${node.var}.${propertyName} = ${init};` ); - updater = `${state.parentNode}.${propertyName} = ${shouldCache || isSelectValueAttribute ? last : value};`; + updater = `${node.var}.${propertyName} = ${shouldCache || isSelectValueAttribute ? last : value};`; } else if (isDataSet) { block.builders.hydrate.addLine( - `${state.parentNode}.dataset.${camelCaseName} = ${init};` + `${node.var}.dataset.${camelCaseName} = ${init};` ); - updater = `${state.parentNode}.dataset.${camelCaseName} = ${shouldCache || isSelectValueAttribute ? last : value};`; + updater = `${node.var}.dataset.${camelCaseName} = ${shouldCache || isSelectValueAttribute ? last : value};`; } else { block.builders.hydrate.addLine( - `${method}(${state.parentNode}, "${name}", ${init});` + `${method}(${node.var}, "${name}", ${init});` ); - updater = `${method}(${state.parentNode}, "${name}", ${shouldCache || isSelectValueAttribute ? last : value});`; + updater = `${method}(${node.var}, "${name}", ${shouldCache || isSelectValueAttribute ? last : value});`; } if (allDependencies.size || hasChangeableIndex || isSelectValueAttribute) { @@ -240,22 +237,22 @@ export default class Attribute { : stringify(this.value[0].data); const statement = ( - isLegacyInputType ? `@setInputType(${state.parentNode}, ${value});` : - propertyName ? `${state.parentNode}.${propertyName} = ${value};` : - isDataSet ? `${state.parentNode}.dataset.${camelCaseName} = ${value};` : - `${method}(${state.parentNode}, "${name}", ${value});` + isLegacyInputType ? `@setInputType(${node.var}, ${value});` : + propertyName ? `${node.var}.${propertyName} = ${value};` : + isDataSet ? `${node.var}.dataset.${camelCaseName} = ${value};` : + `${method}(${node.var}, "${name}", ${value});` ); block.builders.hydrate.addLine(statement); // special case – autofocus. has to be handled in a bit of a weird way if (this.value === true && name === 'autofocus') { - block.autofocus = state.parentNode; + block.autofocus = node.var; } } if (isIndirectlyBoundValue) { - const updateValue = `${state.parentNode}.value = ${state.parentNode}.__value;`; + const updateValue = `${node.var}.value = ${node.var}.__value;`; block.builders.hydrate.addLine(updateValue); if (isDynamic) block.builders.update.addLine(updateValue); diff --git a/src/generators/nodes/AwaitBlock.ts b/src/generators/nodes/AwaitBlock.ts index 29a71d429c..36f198d154 100644 --- a/src/generators/nodes/AwaitBlock.ts +++ b/src/generators/nodes/AwaitBlock.ts @@ -64,7 +64,7 @@ export default class AwaitBlock extends Node { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { const name = this.var; @@ -204,10 +204,11 @@ export default class AwaitBlock extends Node { `); [this.pending, this.then, this.catch].forEach(status => { - const childState = state.child(); // TODO is this necessary? - status.children.forEach(child => { - child.build(status._block, childState); + child.build(status._block, { + parentNode: null, + parentNodes: 'nodes' + }); }); }); } diff --git a/src/generators/nodes/Binding.ts b/src/generators/nodes/Binding.ts index bbddb541a4..fbc5bc5d0f 100644 --- a/src/generators/nodes/Binding.ts +++ b/src/generators/nodes/Binding.ts @@ -21,7 +21,6 @@ export default class Binding extends Node { munge( block: Block, - state: State, allUsedContexts: Set ) { const node: Element = this.parent; diff --git a/src/generators/nodes/Component.ts b/src/generators/nodes/Component.ts index 63a5066c1f..5010e94351 100644 --- a/src/generators/nodes/Component.ts +++ b/src/generators/nodes/Component.ts @@ -62,7 +62,7 @@ export default class Component extends Node { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { const { generator } = this; generator.hasComponents = true; @@ -75,12 +75,11 @@ export default class Component extends Node { const slots = Array.from(this._slots).map(name => `${name}: @createFragment()`); componentInitProperties.push(`slots: { ${slots.join(', ')} }`); - const childState = state.child({ - parentNode: `${this.var}._slotted.default` - }); - this.children.forEach((child: Node) => { - child.build(block, childState); + child.build(block, { + parentNode: `${this.var}._slotted.default`, + parentNodes: 'nodes' + }); }); } diff --git a/src/generators/nodes/EachBlock.ts b/src/generators/nodes/EachBlock.ts index c210ac1940..066664e425 100644 --- a/src/generators/nodes/EachBlock.ts +++ b/src/generators/nodes/EachBlock.ts @@ -104,7 +104,7 @@ export default class EachBlock extends Node { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { const { generator } = this; @@ -221,15 +221,19 @@ export default class EachBlock extends Node { `); } - const childState = state.child(); // TODO is this necessary? reuse state? this.children.forEach((child: Node) => { - child.build(this._block, childState); + child.build(this._block, { + parentNode: null, + parentNodes: 'nodes' + }); }); if (this.else) { - const childState = state.child(); // TODO is this necessary? reuse state? this.else.children.forEach((child: Node) => { - child.build(this.else._block, childState); + child.build(this.else._block, { + parentNode: null, + parentNodes: 'nodes' + }); }); } } @@ -238,7 +242,7 @@ export default class EachBlock extends Node { function keyed( generator: DomGenerator, block: Block, - state: State, + state: { parentNode: string, parentNodes: string }, node: EachBlock, snippet: string, { @@ -458,7 +462,7 @@ function keyed( function unkeyed( generator: DomGenerator, block: Block, - state: State, + state: { parentNode: string, parentNodes: string }, node: EachBlock, snippet: string, { diff --git a/src/generators/nodes/Element.ts b/src/generators/nodes/Element.ts index 89351780c5..9a30d6e92f 100644 --- a/src/generators/nodes/Element.ts +++ b/src/generators/nodes/Element.ts @@ -164,7 +164,7 @@ export default class Element extends Node { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { const { generator } = this; @@ -173,12 +173,12 @@ export default class Element extends Node { this.generator.slots.add(slotName); } - const childState = state.child({ + const childState = { parentNode: this.var, parentNodes: block.getUniqueName(`${this.var}_nodes`) - }); + }; - const name = childState.parentNode; + const name = this.var; const allUsedContexts: Set = new Set(); const slot = this.attributes.find((attribute: Node) => attribute.name === 'slot'); @@ -245,10 +245,10 @@ export default class Element extends Node { }); } - this.addBindings(block, childState, allUsedContexts); + this.addBindings(block, allUsedContexts); this.attributes.filter((a: Attribute) => a.type === 'Attribute').forEach((attribute: Attribute) => { - attribute.render(block, childState); + attribute.render(block); }); // event handlers @@ -435,7 +435,6 @@ export default class Element extends Node { addBindings( block: Block, - state: State, allUsedContexts: Set ) { const bindings: Binding[] = this.attributes.filter((a: Binding) => a.type === 'Binding'); @@ -445,7 +444,7 @@ export default class Element extends Node { const needsLock = this.name !== 'input' || !/radio|checkbox|range|color/.test(this.getStaticAttributeValue('type')); - const mungedBindings = bindings.map(binding => binding.munge(block, state, allUsedContexts)); + const mungedBindings = bindings.map(binding => binding.munge(block, allUsedContexts)); const lock = mungedBindings.some(binding => binding.needsLock) ? block.getUniqueName(`${this.var}_updating`) : diff --git a/src/generators/nodes/Fragment.ts b/src/generators/nodes/Fragment.ts index bfdbac2a85..02ea99d960 100644 --- a/src/generators/nodes/Fragment.ts +++ b/src/generators/nodes/Fragment.ts @@ -5,7 +5,6 @@ import State from '../dom/State'; export default class Fragment extends Node { block: Block; - state: State; children: Node[]; init() { @@ -34,13 +33,11 @@ export default class Fragment extends Node { build() { this.init(); - const state = new State({ - parentNode: null, - parentNodes: 'nodes' - }); - this.children.forEach(child => { - child.build(this.block, state); + child.build(this.block, { + parentNode: null, + parentNodes: 'nodes' + }); }); } } \ No newline at end of file diff --git a/src/generators/nodes/IfBlock.ts b/src/generators/nodes/IfBlock.ts index 38e01139ba..c491b29f7f 100644 --- a/src/generators/nodes/IfBlock.ts +++ b/src/generators/nodes/IfBlock.ts @@ -92,7 +92,7 @@ export default class IfBlock extends Node { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { const name = this.var; @@ -156,7 +156,7 @@ export default class IfBlock extends Node { function getBranches( generator: DomGenerator, block: Block, - state: State, + state: { parentNode: string, parentNodes: string }, node: Node ) { block.contextualise(node.expression); // TODO remove @@ -171,7 +171,7 @@ function getBranches( }, ]; - visitChildren(generator, block, state, node); + visitChildren(generator, block, node); if (isElseIf(node.else)) { branches.push( @@ -187,7 +187,7 @@ function getBranches( }); if (node.else) { - visitChildren(generator, block, state, node.else); + visitChildren(generator, block, node.else); } } @@ -197,12 +197,13 @@ function getBranches( function visitChildren( generator: DomGenerator, block: Block, - state: State, node: Node ) { - const childState = state.child(); // TODO necessary? node.children.forEach((child: Node) => { - child.build(node._block, childState); + child.build(node._block, { + parentNode: null, + parentNodes: 'nodes' + }); }); } @@ -211,7 +212,7 @@ function visitChildren( function simple( generator: DomGenerator, block: Block, - state: State, + state: { parentNode: string, parentNodes: string }, node: Node, branch, dynamic, @@ -300,7 +301,7 @@ function simple( function compound( generator: DomGenerator, block: Block, - state: State, + state: { parentNode: string, parentNodes: string }, node: Node, branches, dynamic, @@ -375,7 +376,7 @@ function compound( function compoundWithOutros( generator: DomGenerator, block: Block, - state: State, + state: { parentNode: string, parentNodes: string }, node: Node, branches, dynamic, diff --git a/src/generators/nodes/MustacheTag.ts b/src/generators/nodes/MustacheTag.ts index c7122b9cfc..2dd7481d2e 100644 --- a/src/generators/nodes/MustacheTag.ts +++ b/src/generators/nodes/MustacheTag.ts @@ -12,7 +12,7 @@ export default class MustacheTag extends Tag { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { const { init } = this.renameThisMethod( block, diff --git a/src/generators/nodes/RawMustacheTag.ts b/src/generators/nodes/RawMustacheTag.ts index c067cb0683..5d3110a31d 100644 --- a/src/generators/nodes/RawMustacheTag.ts +++ b/src/generators/nodes/RawMustacheTag.ts @@ -13,7 +13,7 @@ export default class RawMustacheTag extends Tag { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { const name = this.var; diff --git a/src/generators/nodes/Slot.ts b/src/generators/nodes/Slot.ts index a1a07ac2e9..eb1760a909 100644 --- a/src/generators/nodes/Slot.ts +++ b/src/generators/nodes/Slot.ts @@ -27,7 +27,7 @@ export default class Slot extends Element { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { const { generator } = this; diff --git a/src/generators/nodes/Text.ts b/src/generators/nodes/Text.ts index de8976f7e8..d8d77db34e 100644 --- a/src/generators/nodes/Text.ts +++ b/src/generators/nodes/Text.ts @@ -35,7 +35,7 @@ export default class Text extends Node { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { if (this.shouldSkip) return; diff --git a/src/generators/nodes/Window.ts b/src/generators/nodes/Window.ts index b189fa3df9..d19223e316 100644 --- a/src/generators/nodes/Window.ts +++ b/src/generators/nodes/Window.ts @@ -41,7 +41,7 @@ export default class Window extends Node { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { const { generator } = this; diff --git a/src/generators/nodes/shared/Node.ts b/src/generators/nodes/shared/Node.ts index 370b72421f..3bac7cc813 100644 --- a/src/generators/nodes/shared/Node.ts +++ b/src/generators/nodes/shared/Node.ts @@ -118,7 +118,7 @@ export default class Node { build( block: Block, - state: State + state: { parentNode: string, parentNodes: string } ) { // implemented by subclasses }