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

chore: rename serialize_ prefix to build_ (#12696)

Browse Source
pull/12697/head
Rich Harris 3 months ago committed by GitHub
parent 79ef645151
commit 4fd7834169
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
38 changed files with 200 additions and 236 deletions
Show Stats Download Patch File Download Diff File

8
packages/svelte/src/compiler/phases/3-transform/client/transform-client.js
Unescape View File

@ -5,7 +5,7 @@
import { walk } from 'zimmerframe';
import * as b from '../../../utils/builders.js';
import { set_scope } from '../../scope.js';
import { serialize_get_binding } from './utils.js';
import { build_getter } from './utils.js';
import { render_stylesheet } from '../css/index.js';
import { dev, filename } from '../../../state.js';
import { AnimateDirective } from './visitors/AnimateDirective.js';
@ -198,7 +198,7 @@ export function client_component(analysis, options) {
}
// We're creating an arrow function that gets the store value which minifies better for two or more references
const store_reference = serialize_get_binding(b.id(name.slice(1)), instance_state);
const store_reference = build_getter(b.id(name.slice(1)), instance_state);
const store_get = b.call('$.store_get', store_reference, b.literal(name), b.id('$$stores'));
store_setup.push(
b.const(
@ -240,7 +240,7 @@ export function client_component(analysis, options) {
/** @type {Array<ESTree.Property | ESTree.SpreadElement>} */
const component_returned_object = analysis.exports.flatMap(({ name, alias }) => {
const binding = instance_state.scope.get(name);
const expression = serialize_get_binding(b.id(name), instance_state);
const expression = build_getter(b.id(name), instance_state);
const getter = b.get(alias ?? name, [b.return(expression)]);
if (expression.type === 'Identifier') {
@ -365,7 +365,7 @@ export function client_component(analysis, options) {
'$.bind_prop',
b.id('$$props'),
b.literal(alias ?? name),
serialize_get_binding(b.id(name), instance_state)
build_getter(b.id(name), instance_state)
)
)
);

30
packages/svelte/src/compiler/phases/3-transform/client/utils.js
Unescape View File

@ -32,7 +32,7 @@ export function get_assignment_value(node, { state, visit }) {
: // turn something like x += 1 into x = x + 1
b.binary(
/** @type {BinaryOperator} */ (operator.slice(0, -1)),
serialize_get_binding(node.left, state),
build_getter(node.left, state),
/** @type {Expression} */ (visit(node.right))
);
} else if (
@ -72,7 +72,7 @@ export function is_state_source(binding, state) {
* @param {ClientTransformState} state
* @returns {Expression}
*/
export function serialize_get_binding(node, state) {
export function build_getter(node, state) {
const binding = state.scope.get(node.name);
if (binding === null || node === binding.node) {
@ -130,7 +130,7 @@ export function serialize_get_binding(node, state) {
* @param {{skip_proxy_and_freeze?: boolean}} [options]
* @returns {Expression}
*/
export function serialize_set_binding(node, context, fallback, prefix, options) {
export function build_setter(node, context, fallback, prefix, options) {
const { state, visit } = context;
const assignee = node.left;
@ -154,9 +154,7 @@ export function serialize_set_binding(node, context, fallback, prefix, options)
const value = path.expression?.(b.id(tmp_id));
const assignment = b.assignment('=', path.node, value);
original_assignments.push(assignment);
assignments.push(
serialize_set_binding(assignment, context, () => assignment, prefix, options)
);
assignments.push(build_setter(assignment, context, () => assignment, prefix, options));
}
if (assignments.every((assignment, i) => assignment === original_assignments[i])) {
@ -213,7 +211,7 @@ export function serialize_set_binding(node, context, fallback, prefix, options)
assignment.right =
private_state.kind === 'frozen_state'
? b.call('$.freeze', value)
: serialize_proxy_reassignment(value, private_state.id);
: build_proxy_reassignment(value, private_state.id);
return assignment;
}
}
@ -226,7 +224,7 @@ export function serialize_set_binding(node, context, fallback, prefix, options)
should_proxy_or_freeze(value, context.state.scope)
? private_state.kind === 'frozen_state'
? b.call('$.freeze', value)
: serialize_proxy_reassignment(value, private_state.id)
: build_proxy_reassignment(value, private_state.id)
: value
);
}
@ -250,7 +248,7 @@ export function serialize_set_binding(node, context, fallback, prefix, options)
assignment.right =
public_state.kind === 'frozen_state'
? b.call('$.freeze', value)
: serialize_proxy_reassignment(value, public_state.id);
: build_proxy_reassignment(value, public_state.id);
return assignment;
}
}
@ -324,7 +322,7 @@ export function serialize_set_binding(node, context, fallback, prefix, options)
if ((binding.kind === 'prop' || binding.kind === 'bindable_prop') && !is_initial_proxy) {
return b.call(left, value);
} else if (is_store) {
return b.call('$.store_set', serialize_get_binding(b.id(left_name), state), value);
return b.call('$.store_set', build_getter(b.id(left_name), state), value);
} else {
let call;
if (binding.kind === 'state') {
@ -334,7 +332,7 @@ export function serialize_set_binding(node, context, fallback, prefix, options)
context.state.analysis.runes &&
!options?.skip_proxy_and_freeze &&
should_proxy_or_freeze(value, context.state.scope)
? serialize_proxy_reassignment(value, left_name)
? build_proxy_reassignment(value, left_name)
: value
);
} else if (binding.kind === 'frozen_state') {
@ -357,7 +355,7 @@ export function serialize_set_binding(node, context, fallback, prefix, options)
!options?.skip_proxy_and_freeze &&
should_proxy_or_freeze(value, context.state.scope) &&
binding.kind === 'bindable_prop'
? serialize_proxy_reassignment(value, left_name)
? build_proxy_reassignment(value, left_name)
: value
);
} else {
@ -401,7 +399,7 @@ export function serialize_set_binding(node, context, fallback, prefix, options)
return maybe_skip_ownership_validation(
b.call(
'$.store_mutate',
serialize_get_binding(b.id(left_name), state),
build_getter(b.id(left_name), state),
b.assignment(node.operator, /** @type {Pattern}} */ (visit_node(node.left)), value),
b.call('$.untrack', b.id('$' + left_name))
)
@ -453,7 +451,7 @@ export function serialize_set_binding(node, context, fallback, prefix, options)
};
if (value.type === 'BinaryExpression' && /** @type {any} */ (value.operator) === '??') {
return b.logical('??', serialize_get_binding(b.id(left_name), state), serialize());
return b.logical('??', build_getter(b.id(left_name), state), serialize());
}
return serialize();
@ -463,7 +461,7 @@ export function serialize_set_binding(node, context, fallback, prefix, options)
* @param {Expression} value
* @param {PrivateIdentifier | string} proxy_reference
*/
export function serialize_proxy_reassignment(value, proxy_reference) {
export function build_proxy_reassignment(value, proxy_reference) {
return dev
? b.call(
'$.proxy',
@ -549,7 +547,7 @@ function get_hoistable_params(node, context) {
* @param {ComponentContext} context
* @returns {Pattern[]}
*/
export function serialize_hoistable_params(node, context) {
export function build_hoistable_params(node, context) {
const hoistable_params = get_hoistable_params(node, context);
node.metadata.hoistable_params = hoistable_params;

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/AssignmentExpression.js
Unescape View File

@ -1,11 +1,11 @@
/** @import { AssignmentExpression } from 'estree' */
/** @import { Context } from '../types' */
import { serialize_set_binding } from '../utils.js';
import { build_setter } from '../utils.js';
/**
* @param {AssignmentExpression} node
* @param {Context} context
*/
export function AssignmentExpression(node, context) {
return serialize_set_binding(node, context, context.next);
return build_setter(node, context, context.next);
}

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/Attribute.js
Unescape View File

@ -1,7 +1,7 @@
/** @import { Attribute } from '#compiler' */
/** @import { ComponentContext } from '../types' */
import { is_event_attribute } from '../../../../utils/ast.js';
import { serialize_event_attribute } from './shared/element.js';
import { build_event_attribute } from './shared/element.js';
/**
* @param {Attribute} node
@ -9,6 +9,6 @@ import { serialize_event_attribute } from './shared/element.js';
*/
export function Attribute(node, context) {
if (is_event_attribute(node)) {
serialize_event_attribute(node, context);
build_event_attribute(node, context);
}
}

14
packages/svelte/src/compiler/phases/3-transform/client/visitors/BindDirective.js
Unescape View File

@ -5,9 +5,9 @@ import { dev, is_ignored } from '../../../../state.js';
import { is_text_attribute } from '../../../../utils/ast.js';
import * as b from '../../../../utils/builders.js';
import { binding_properties } from '../../../bindings.js';
import { serialize_set_binding } from '../utils.js';
import { serialize_attribute_value } from './shared/element.js';
import { serialize_bind_this, serialize_validate_binding } from './shared/utils.js';
import { build_setter } from '../utils.js';
import { build_attribute_value } from './shared/element.js';
import { build_bind_this, build_validate_binding } from './shared/utils.js';
/**
* @param {BindDirective} node
@ -31,7 +31,7 @@ export function BindDirective(node, context) {
!is_ignored(node, 'binding_property_non_reactive')
) {
context.state.init.push(
serialize_validate_binding(
build_validate_binding(
context.state,
node,
/**@type {MemberExpression} */ (context.visit(expression))
@ -43,7 +43,7 @@ export function BindDirective(node, context) {
const assignment = b.assignment('=', expression, b.id('$$value'));
const setter = b.arrow(
[b.id('$$value')],
serialize_set_binding(
build_setter(
assignment,
context,
() => /** @type {Expression} */ (context.visit(assignment)),
@ -161,7 +161,7 @@ export function BindDirective(node, context) {
break;
case 'this':
call = serialize_bind_this(expression, context.state.node, context);
call = build_bind_this(expression, context.state.node, context);
break;
case 'textContent':
@ -212,7 +212,7 @@ export function BindDirective(node, context) {
if (value !== undefined) {
group_getter = b.thunk(
b.block([
b.stmt(serialize_attribute_value(value, context)[1]),
b.stmt(build_attribute_value(value, context)[1]),
b.return(/** @type {Expression} */ (context.visit(expression)))
])
);

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/ClassBody.js
Unescape View File

@ -5,7 +5,7 @@ import { dev, is_ignored } from '../../../../state.js';
import * as b from '../../../../utils/builders.js';
import { regex_invalid_identifier_chars } from '../../../patterns.js';
import { get_rune } from '../../../scope.js';
import { serialize_proxy_reassignment, should_proxy_or_freeze } from '../utils.js';
import { build_proxy_reassignment, should_proxy_or_freeze } from '../utils.js';
/**
* @param {ClassBody} node
@ -149,7 +149,7 @@ export function ClassBody(node, context) {
'set',
definition.key,
[value],
[b.stmt(b.call('$.set', member, serialize_proxy_reassignment(value, field.id)))]
[b.stmt(b.call('$.set', member, build_proxy_reassignment(value, field.id)))]
)
);
}

6
packages/svelte/src/compiler/phases/3-transform/client/visitors/Component.js
Unescape View File

@ -2,7 +2,7 @@
/** @import { Component } from '#compiler' */
/** @import { ComponentContext } from '../types' */
import * as b from '../../../../utils/builders.js';
import { serialize_component } from './shared/component.js';
import { build_component } from './shared/component.js';
/**
* @param {Component} node
@ -11,7 +11,7 @@ import { serialize_component } from './shared/component.js';
export function Component(node, context) {
if (node.metadata.dynamic) {
// Handle dynamic references to what seems like static inline components
const component = serialize_component(node, '$$component', context, b.id('$$anchor'));
const component = build_component(node, '$$component', context, b.id('$$anchor'));
context.state.init.push(
b.stmt(
b.call(
@ -27,6 +27,6 @@ export function Component(node, context) {
return;
}
const component = serialize_component(node, node.name, context);
const component = build_component(node, node.name, context);
context.state.init.push(component);
}

19
packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js
Unescape View File

@ -12,12 +12,7 @@ import {
import { dev } from '../../../../state.js';
import { extract_paths, object } from '../../../../utils/ast.js';
import * as b from '../../../../utils/builders.js';
import {
get_assignment_value,
serialize_get_binding,
serialize_set_binding,
with_loc
} from '../utils.js';
import { get_assignment_value, build_getter, build_setter, with_loc } from '../utils.js';
/**
* @param {EachBlock} node
@ -94,7 +89,7 @@ export function EachBlock(node, context) {
// Legacy mode: find the parent each blocks which contain the arrays to invalidate
const indirect_dependencies = collect_parent_each_blocks(context).flatMap((block) => {
const array = /** @type {Expression} */ (context.visit(block.expression));
const transitive_dependencies = serialize_transitive_dependencies(
const transitive_dependencies = build_transitive_dependencies(
block.metadata.references,
context
);
@ -106,7 +101,7 @@ export function EachBlock(node, context) {
} else {
indirect_dependencies.push(collection);
const transitive_dependencies = serialize_transitive_dependencies(
const transitive_dependencies = build_transitive_dependencies(
each_node_meta.references,
context
);
@ -131,9 +126,9 @@ export function EachBlock(node, context) {
const create_mutation = (expression_for_id) => {
return (assignment, context) => {
if (assignment.left.type !== 'Identifier' && assignment.left.type !== 'MemberExpression') {
// serialize_set_binding turns other patterns into IIFEs and separates the assignments
// build_setter turns other patterns into IIFEs and separates the assignments
// into separate expressions, at which point this is called again with an identifier or member expression
return serialize_set_binding(assignment, context, () => assignment);
return build_setter(assignment, context, () => assignment);
}
const left = object(assignment.left);
@ -282,7 +277,7 @@ function collect_parent_each_blocks(context) {
* @param {Binding[]} references
* @param {ComponentContext} context
*/
function serialize_transitive_dependencies(references, context) {
function build_transitive_dependencies(references, context) {
/** @type {Set<Binding>} */
const dependencies = new Set();
@ -293,7 +288,7 @@ function serialize_transitive_dependencies(references, context) {
}
}
return [...dependencies].map((dep) => serialize_get_binding({ ...dep.node }, context.state));
return [...dependencies].map((dep) => build_getter({ ...dep.node }, context.state));
}
/**

10
packages/svelte/src/compiler/phases/3-transform/client/visitors/Fragment.js
Unescape View File

@ -7,7 +7,7 @@ import { dev } from '../../../../state.js';
import * as b from '../../../../utils/builders.js';
import { clean_nodes, infer_namespace } from '../../utils.js';
import { process_children } from './shared/fragment.js';
import { serialize_render_stmt } from './shared/utils.js';
import { build_render_statement } from './shared/utils.js';
/**
* @param {Fragment} node
@ -97,7 +97,7 @@ export function Fragment(node, context) {
'$.add_locations',
call,
b.member(b.id(context.state.analysis.name), b.id('$.FILENAME'), true),
serialize_locations(state.locations)
build_locations(state.locations)
);
}
@ -184,7 +184,7 @@ export function Fragment(node, context) {
}
if (state.update.length > 0) {
body.push(serialize_render_stmt(state.update));
body.push(build_render_statement(state.update));
}
body.push(...state.after_update);
@ -221,13 +221,13 @@ function get_template_function(namespace, state) {
/**
* @param {SourceLocation[]} locations
*/
function serialize_locations(locations) {
function build_locations(locations) {
return b.array(
locations.map((loc) => {
const expression = b.array([b.literal(loc[0]), b.literal(loc[1])]);
if (loc.length === 3) {
expression.elements.push(serialize_locations(loc[2]));
expression.elements.push(build_locations(loc[2]));
}
return expression;

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/FunctionDeclaration.js
Unescape View File

@ -1,6 +1,6 @@
/** @import { FunctionDeclaration } from 'estree' */
/** @import { ComponentContext } from '../types' */
import { serialize_hoistable_params } from '../utils.js';
import { build_hoistable_params } from '../utils.js';
import * as b from '../../../../utils/builders.js';
/**
@ -13,7 +13,7 @@ export function FunctionDeclaration(node, context) {
const state = { ...context.state, in_constructor: false };
if (metadata?.hoistable === true) {
const params = serialize_hoistable_params(node, context);
const params = build_hoistable_params(node, context);
context.state.hoisted.push(
/** @type {FunctionDeclaration} */ ({

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/Identifier.js
Unescape View File

@ -2,7 +2,7 @@
/** @import { Context } from '../types' */
import is_reference from 'is-reference';
import * as b from '../../../../utils/builders.js';
import { serialize_get_binding } from '../utils.js';
import { build_getter } from '../utils.js';
/**
* @param {Identifier} node
@ -36,6 +36,6 @@ export function Identifier(node, context) {
}
}
return serialize_get_binding(node, context.state);
return build_getter(node, context.state);
}
}

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/LabeledStatement.js
Unescape View File

@ -2,7 +2,7 @@
/** @import { ReactiveStatement } from '#compiler' */
/** @import { ComponentContext } from '../types' */
import * as b from '../../../../utils/builders.js';
import { serialize_get_binding } from '../utils.js';
import { build_getter } from '../utils.js';
/**
* @param {LabeledStatement} node
@ -37,7 +37,7 @@ export function LabeledStatement(node, context) {
if (binding.kind === 'normal') continue;
const name = binding.node.name;
let serialized = serialize_get_binding(b.id(name), context.state);
let serialized = build_getter(b.id(name), context.state);
// If the binding is a prop, we need to deep read it because it could be fine-grained $state
// from a runes-component, where mutations don't trigger an update on the prop as a whole.

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/OnDirective.js
Unescape View File

@ -1,11 +1,11 @@
/** @import { OnDirective } from '#compiler' */
/** @import { ComponentContext } from '../types' */
import { serialize_event } from './shared/element.js';
import { build_event } from './shared/element.js';
/**
* @param {OnDirective} node
* @param {ComponentContext} context
*/
export function OnDirective(node, context) {
serialize_event(node, node.metadata.expression, context);
build_event(node, node.metadata.expression, context);
}

64
packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js
Unescape View File

@ -19,20 +19,16 @@ import {
import * as b from '../../../../utils/builders.js';
import { is_custom_element_node } from '../../../nodes.js';
import { clean_nodes, determine_namespace_for_children } from '../../utils.js';
import { serialize_get_binding } from '../utils.js';
import { build_getter } from '../utils.js';
import {
get_attribute_name,
serialize_attribute_value,
serialize_class_directives,
serialize_event_attribute,
serialize_style_directives
build_attribute_value,
build_class_directives,
build_event_attribute,
build_style_directives
} from './shared/element.js';
import { process_children } from './shared/fragment.js';
import {
serialize_render_stmt,
serialize_update,
serialize_update_assignment
} from './shared/utils.js';
import { build_render_statement, build_update, build_update_assignment } from './shared/utils.js';
/**
* @param {RegularElement} node
@ -200,7 +196,7 @@ export function RegularElement(node, context) {
if (node.name === 'img') {
img_might_be_lazy = true;
}
serialize_element_spread_attributes(
build_element_spread_attributes(
attributes,
context,
node,
@ -218,12 +214,12 @@ export function RegularElement(node, context) {
) {
might_need_event_replaying = true;
}
serialize_event_attribute(attribute, context);
build_event_attribute(attribute, context);
continue;
}
if (needs_special_value_handling && attribute.name === 'value') {
serialize_element_special_value_attribute(node.name, node_id, attribute, context);
build_element_special_value_attribute(node.name, node_id, attribute, context);
continue;
}
@ -234,7 +230,7 @@ export function RegularElement(node, context) {
) {
const name = get_attribute_name(node, attribute, context);
const literal_value = /** @type {Literal} */ (
serialize_attribute_value(attribute.value, context)[1]
build_attribute_value(attribute.value, context)[1]
).value;
if (name !== 'class' || literal_value) {
// TODO namespace=foreign probably doesn't want to do template stuff at all and instead use programmatic methods
@ -252,8 +248,8 @@ export function RegularElement(node, context) {
const is =
is_custom_element && child_metadata.namespace !== 'foreign'
? serialize_custom_element_attribute_update_assignment(node_id, attribute, context)
: serialize_element_attribute_update_assignment(node, node_id, attribute, context);
? build_custom_element_attribute_update_assignment(node_id, attribute, context)
: build_element_attribute_update_assignment(node, node_id, attribute, context);
if (is) is_attributes_reactive = true;
}
}
@ -264,8 +260,8 @@ export function RegularElement(node, context) {
}
// class/style directives must be applied last since they could override class/style attributes
serialize_class_directives(class_directives, node_id, context, is_attributes_reactive);
serialize_style_directives(
build_class_directives(class_directives, node_id, context, is_attributes_reactive);
build_style_directives(
style_directives,
node_id,
context,
@ -343,7 +339,7 @@ export function RegularElement(node, context) {
context.state.init.push(
b.block([
...child_state.init,
child_state.update.length > 0 ? serialize_render_stmt(child_state.update) : b.empty,
child_state.update.length > 0 ? build_render_statement(child_state.update) : b.empty,
...child_state.after_update
])
);
@ -399,7 +395,7 @@ function setup_select_synchronization(value_binding, context) {
b.thunk(
b.block(
names.map((name) => {
const serialized = serialize_get_binding(b.id(name), context.state);
const serialized = build_getter(b.id(name), context.state);
return b.stmt(serialized);
})
)
@ -428,7 +424,7 @@ function setup_select_synchronization(value_binding, context) {
* @param {Identifier} element_id
* @param {boolean} needs_select_handling
*/
function serialize_element_spread_attributes(
function build_element_spread_attributes(
attributes,
context,
element,
@ -444,7 +440,7 @@ function serialize_element_spread_attributes(
if (attribute.type === 'Attribute') {
const name = get_attribute_name(element, attribute, context);
// TODO: handle has_call
const [, value] = serialize_attribute_value(attribute.value, context);
const [, value] = build_attribute_value(attribute.value, context);
if (
name === 'is' &&
@ -501,7 +497,7 @@ function serialize_element_spread_attributes(
// objects could contain reactive getters -> play it safe and always assume spread attributes are reactive
if (needs_isolation) {
context.state.init.push(serialize_update(update));
context.state.init.push(build_update(update));
} else {
context.state.update.push(update);
}
@ -553,12 +549,12 @@ function serialize_element_spread_attributes(
* @param {ComponentContext} context
* @returns {boolean}
*/
function serialize_element_attribute_update_assignment(element, node_id, attribute, context) {
function build_element_attribute_update_assignment(element, node_id, attribute, context) {
const state = context.state;
const name = get_attribute_name(element, attribute, context);
const is_svg = context.state.metadata.namespace === 'svg' || element.name === 'svg';
const is_mathml = context.state.metadata.namespace === 'mathml';
let [has_call, value] = serialize_attribute_value(attribute.value, context);
let [has_call, value] = build_attribute_value(attribute.value, context);
// The foreign namespace doesn't have any special handling, everything goes through the attr function
if (context.state.metadata.namespace === 'foreign') {
@ -574,7 +570,7 @@ function serialize_element_attribute_update_assignment(element, node_id, attribu
if (attribute.metadata.expression.has_state) {
const id = state.scope.generate(`${node_id.name}_${name}`);
serialize_update_assignment(state, id, undefined, value, statement);
build_update_assignment(state, id, undefined, value, statement);
return true;
} else {
state.init.push(statement);
@ -619,7 +615,7 @@ function serialize_element_attribute_update_assignment(element, node_id, attribu
if (attribute.metadata.expression.has_state) {
if (has_call) {
state.init.push(serialize_update(update));
state.init.push(build_update(update));
} else {
state.update.push(update);
}
@ -631,22 +627,22 @@ function serialize_element_attribute_update_assignment(element, node_id, attribu
}
/**
* Like `serialize_element_attribute_update_assignment` but without any special attribute treatment.
* Like `build_element_attribute_update_assignment` but without any special attribute treatment.
* @param {Identifier} node_id
* @param {Attribute} attribute
* @param {ComponentContext} context
* @returns {boolean}
*/
function serialize_custom_element_attribute_update_assignment(node_id, attribute, context) {
function build_custom_element_attribute_update_assignment(node_id, attribute, context) {
const state = context.state;
const name = attribute.name; // don't lowercase, as we set the element's property, which might be case sensitive
let [has_call, value] = serialize_attribute_value(attribute.value, context);
let [has_call, value] = build_attribute_value(attribute.value, context);
const update = b.stmt(b.call('$.set_custom_element_data', node_id, b.literal(name), value));
if (attribute.metadata.expression.has_state) {
if (has_call) {
state.init.push(serialize_update(update));
state.init.push(build_update(update));
} else {
state.update.push(update);
}
@ -667,9 +663,9 @@ function serialize_custom_element_attribute_update_assignment(node_id, attribute
* @param {ComponentContext} context
* @returns {boolean}
*/
function serialize_element_special_value_attribute(element, node_id, attribute, context) {
function build_element_special_value_attribute(element, node_id, attribute, context) {
const state = context.state;
const [, value] = serialize_attribute_value(attribute.value, context);
const [, value] = build_attribute_value(attribute.value, context);
const inner_assignment = b.assignment(
'=',
@ -705,7 +701,7 @@ function serialize_element_special_value_attribute(element, node_id, attribute,
if (is_reactive) {
const id = state.scope.generate(`${node_id.name}_value`);
serialize_update_assignment(
build_update_assignment(
state,
id,
// `<option>` is a special case: The value property reflects to the DOM. If the value is set to undefined,

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/SlotElement.js
Unescape View File

@ -2,7 +2,7 @@
/** @import { SlotElement } from '#compiler' */
/** @import { ComponentContext } from '../types' */
import * as b from '../../../../utils/builders.js';
import { serialize_attribute_value } from './shared/element.js';
import { build_attribute_value } from './shared/element.js';
/**
* @param {SlotElement} node
@ -30,7 +30,7 @@ export function SlotElement(node, context) {
if (attribute.type === 'SpreadAttribute') {
spreads.push(b.thunk(/** @type {Expression} */ (context.visit(attribute))));
} else if (attribute.type === 'Attribute') {
const [, value] = serialize_attribute_value(attribute.value, context);
const [, value] = build_attribute_value(attribute.value, context);
if (attribute.name === 'name') {
name = value;
is_default = false;

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteComponent.js
Unescape View File

@ -1,12 +1,12 @@
/** @import { SvelteComponent } from '#compiler' */
/** @import { ComponentContext } from '../types' */
import { serialize_component } from './shared/component.js';
import { build_component } from './shared/component.js';
/**
* @param {SvelteComponent} node
* @param {ComponentContext} context
*/
export function SvelteComponent(node, context) {
const component = serialize_component(node, '$$component', context);
const component = build_component(node, '$$component', context);
context.state.init.push(component);
}

30
packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteElement.js
Unescape View File

@ -12,11 +12,11 @@ import {
import * as b from '../../../../utils/builders.js';
import { determine_namespace_for_children } from '../../utils.js';
import {
serialize_attribute_value,
serialize_class_directives,
serialize_style_directives
build_attribute_value,
build_class_directives,
build_style_directives
} from './shared/element.js';
import { serialize_render_stmt, serialize_update } from './shared/utils.js';
import { build_render_statement, build_update } from './shared/utils.js';
/**
* @param {SvelteElement} node
@ -83,17 +83,11 @@ export function SvelteElement(node, context) {
// Always use spread because we don't know whether the element is a custom element or not,
// therefore we need to do the "how to set an attribute" logic at runtime.
const is_attributes_reactive =
serialize_dynamic_element_attributes(attributes, inner_context, element_id) !== null;
build_dynamic_element_attributes(attributes, inner_context, element_id) !== null;
// class/style directives must be applied last since they could override class/style attributes
serialize_class_directives(class_directives, element_id, inner_context, is_attributes_reactive);
serialize_style_directives(
style_directives,
element_id,
inner_context,
is_attributes_reactive,
true
);
build_class_directives(class_directives, element_id, inner_context, is_attributes_reactive);
build_style_directives(style_directives, element_id, inner_context, is_attributes_reactive, true);
const get_tag = b.thunk(/** @type {Expression} */ (context.visit(node.tag)));
@ -107,7 +101,7 @@ export function SvelteElement(node, context) {
/** @type {Statement[]} */
const inner = inner_context.state.init;
if (inner_context.state.update.length > 0) {
inner.push(serialize_render_stmt(inner_context.state.update));
inner.push(build_render_statement(inner_context.state.update));
}
inner.push(...inner_context.state.after_update);
inner.push(
@ -132,7 +126,7 @@ export function SvelteElement(node, context) {
get_tag,
node.metadata.svg || node.metadata.mathml ? b.true : b.false,
inner.length > 0 && b.arrow([element_id, b.id('$$anchor')], b.block(inner)),
dynamic_namespace && b.thunk(serialize_attribute_value(dynamic_namespace, context)[1]),
dynamic_namespace && b.thunk(build_attribute_value(dynamic_namespace, context)[1]),
location && b.array([b.literal(location.line), b.literal(location.column)])
)
)
@ -147,7 +141,7 @@ export function SvelteElement(node, context) {
* @param {Identifier} element_id
* @returns {boolean}
*/
function serialize_dynamic_element_attributes(attributes, context, element_id) {
function build_dynamic_element_attributes(attributes, context, element_id) {
if (attributes.length === 0) {
if (context.state.analysis.css.hash) {
context.state.init.push(
@ -167,7 +161,7 @@ function serialize_dynamic_element_attributes(attributes, context, element_id) {
for (const attribute of attributes) {
if (attribute.type === 'Attribute') {
const [, value] = serialize_attribute_value(attribute.value, context);
const [, value] = build_attribute_value(attribute.value, context);
if (
is_event_attribute(attribute) &&
@ -212,7 +206,7 @@ function serialize_dynamic_element_attributes(attributes, context, element_id) {
);
if (needs_isolation) {
context.state.init.push(serialize_update(update));
context.state.init.push(build_update(update));
return false;
}

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteSelf.js
Unescape View File

@ -1,12 +1,12 @@
/** @import { SvelteSelf } from '#compiler' */
/** @import { ComponentContext } from '../types' */
import { serialize_component } from './shared/component.js';
import { build_component } from './shared/component.js';
/**
* @param {SvelteSelf} node
* @param {ComponentContext} context
*/
export function SvelteSelf(node, context) {
const component = serialize_component(node, context.state.analysis.name, context);
const component = build_component(node, context.state.analysis.name, context);
context.state.init.push(component);
}

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/TitleElement.js
Unescape View File

@ -1,7 +1,7 @@
/** @import { TitleElement, Text } from '#compiler' */
/** @import { ComponentContext } from '../types' */
import * as b from '../../../../utils/builders.js';
import { serialize_template_literal } from './shared/utils.js';
import { build_template_literal } from './shared/utils.js';
/**
* @param {TitleElement} node
@ -27,7 +27,7 @@ export function TitleElement(node, context) {
b.assignment(
'=',
b.member(b.id('$.document'), b.id('title')),
serialize_template_literal(
build_template_literal(
/** @type {any} */ (node.fragment.nodes),
context.visit,
context.state

11
packages/svelte/src/compiler/phases/3-transform/client/visitors/UpdateExpression.js
Unescape View File

@ -2,7 +2,7 @@
/** @import { Context } from '../types' */
import { is_ignored } from '../../../../state.js';
import * as b from '../../../../utils/builders.js';
import { serialize_get_binding, serialize_set_binding } from '../utils.js';
import { build_getter, build_setter } from '../utils.js';
/**
* @param {UpdateExpression} node
@ -34,7 +34,7 @@ export function UpdateExpression(node, context) {
if (is_store) {
fn += '_store';
args.push(serialize_get_binding(b.id(name), context.state), b.call('$' + name));
args.push(build_getter(b.id(name), context.state), b.call('$' + name));
} else {
if (binding.kind === 'prop' || binding.kind === 'bindable_prop') fn += '_prop';
args.push(b.id(name));
@ -84,12 +84,7 @@ export function UpdateExpression(node, context) {
b.literal(1)
);
const serialized_assignment = serialize_set_binding(
assignment,
context,
() => assignment,
node.prefix
);
const serialized_assignment = build_setter(assignment, context, () => assignment, node.prefix);
const value = /** @type {Expression} */ (context.visit(argument));

24
packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/component.js
Unescape View File

@ -5,13 +5,9 @@ import { dev, is_ignored } from '../../../../../state.js';
import { get_attribute_chunks } from '../../../../../utils/ast.js';
import * as b from '../../../../../utils/builders.js';
import { is_element_node } from '../../../../nodes.js';
import { create_derived, serialize_set_binding } from '../../utils.js';
import {
serialize_bind_this,
serialize_event_handler,
serialize_validate_binding
} from '../shared/utils.js';
import { serialize_attribute_value } from '../shared/element.js';
import { create_derived, build_setter } from '../../utils.js';
import { build_bind_this, build_event_handler, build_validate_binding } from '../shared/utils.js';
import { build_attribute_value } from '../shared/element.js';
/**
* @param {Component | SvelteComponent | SvelteSelf} node
@ -20,7 +16,7 @@ import { serialize_attribute_value } from '../shared/element.js';
* @param {Expression} anchor
* @returns {Statement}
*/
export function serialize_component(node, component_name, context, anchor = context.state.node) {
export function build_component(node, component_name, context, anchor = context.state.node) {
/** @type {Array<Property[] | Expression>} */
const props_and_spreads = [];
@ -74,7 +70,7 @@ export function serialize_component(node, component_name, context, anchor = cont
lets.push(/** @type {ExpressionStatement} */ (context.visit(attribute)));
} else if (attribute.type === 'OnDirective') {
events[attribute.name] ||= [];
let handler = serialize_event_handler(attribute, null, context);
let handler = build_event_handler(attribute, null, context);
if (attribute.modifiers.includes('once')) {
handler = b.call('$.once', handler);
}
@ -97,7 +93,7 @@ export function serialize_component(node, component_name, context, anchor = cont
} else if (attribute.type === 'Attribute') {
if (attribute.name.startsWith('--')) {
custom_css_props.push(
b.init(attribute.name, serialize_attribute_value(attribute.value, context)[1])
b.init(attribute.name, build_attribute_value(attribute.value, context)[1])
);
continue;
}
@ -110,7 +106,7 @@ export function serialize_component(node, component_name, context, anchor = cont
has_children_prop = true;
}
const [, value] = serialize_attribute_value(attribute.value, context);
const [, value] = build_attribute_value(attribute.value, context);
if (attribute.metadata.expression.has_state) {
let arg = value;
@ -145,7 +141,7 @@ export function serialize_component(node, component_name, context, anchor = cont
context.state.analysis.runes &&
!is_ignored(node, 'binding_property_non_reactive')
) {
context.state.init.push(serialize_validate_binding(context.state, attribute, expression));
context.state.init.push(build_validate_binding(context.state, attribute, expression));
}
if (attribute.name === 'this') {
@ -169,7 +165,7 @@ export function serialize_component(node, component_name, context, anchor = cont
const assignment = b.assignment('=', attribute.expression, b.id('$$value'));
push_prop(
b.set(attribute.name, [
b.stmt(serialize_set_binding(assignment, context, () => context.visit(assignment)))
b.stmt(build_setter(assignment, context, () => context.visit(assignment)))
])
);
}
@ -314,7 +310,7 @@ export function serialize_component(node, component_name, context, anchor = cont
const prev = fn;
fn = (node_id) => {
return serialize_bind_this(bind_this, prev(node_id), context);
return build_bind_this(bind_this, prev(node_id), context);
};
}

30
packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js
Unescape View File

@ -8,8 +8,8 @@ import {
} from '../../../../../../utils.js';
import { get_attribute_expression } from '../../../../../utils/ast.js';
import * as b from '../../../../../utils/builders.js';
import { serialize_get_binding } from '../../utils.js';
import { serialize_event_handler, serialize_template_literal, serialize_update } from './utils.js';
import { build_getter } from '../../utils.js';
import { build_event_handler, build_template_literal, build_update } from './utils.js';
/**
* Serializes each style directive into something like `$.set_style(element, style_property, value)`
@ -20,7 +20,7 @@ import { serialize_event_handler, serialize_template_literal, serialize_update }
* @param {boolean} is_attributes_reactive
* @param {boolean} force_check Should be `true` if we can't rely on our cached value, because for example there's also a `style` attribute
*/
export function serialize_style_directives(
export function build_style_directives(
style_directives,
element_id,
context,
@ -32,8 +32,8 @@ export function serialize_style_directives(
for (const directive of style_directives) {
let value =
directive.value === true
? serialize_get_binding({ name: directive.name, type: 'Identifier' }, context.state)
: serialize_attribute_value(directive.value, context)[1];
? build_getter({ name: directive.name, type: 'Identifier' }, context.state)
: build_attribute_value(directive.value, context)[1];
const update = b.stmt(
b.call(
@ -49,7 +49,7 @@ export function serialize_style_directives(
const { has_state, has_call } = directive.metadata.expression;
if (!is_attributes_reactive && has_call) {
state.init.push(serialize_update(update));
state.init.push(build_update(update));
} else if (is_attributes_reactive || has_state || has_call) {
state.update.push(update);
} else {
@ -66,7 +66,7 @@ export function serialize_style_directives(
* @param {ComponentContext} context
* @param {boolean} is_attributes_reactive
*/
export function serialize_class_directives(
export function build_class_directives(
class_directives,
element_id,
context,
@ -80,7 +80,7 @@ export function serialize_class_directives(
const { has_state, has_call } = directive.metadata.expression;
if (!is_attributes_reactive && has_call) {
state.init.push(serialize_update(update));
state.init.push(build_update(update));
} else if (is_attributes_reactive || has_state || has_call) {
state.update.push(update);
} else {
@ -94,7 +94,7 @@ export function serialize_class_directives(
* @param {ComponentContext} context
* @returns {[has_call: boolean, Expression]}
*/
export function serialize_attribute_value(value, context) {
export function build_attribute_value(value, context) {
if (value === true) {
return [false, b.literal(true)];
}
@ -112,7 +112,7 @@ export function serialize_attribute_value(value, context) {
];
}
return serialize_template_literal(value, context.visit, context.state);
return build_template_literal(value, context.visit, context.state);
}
/**
@ -136,7 +136,7 @@ export function get_attribute_name(element, attribute, context) {
* @param {Attribute & { value: ExpressionTag | [ExpressionTag] }} node
* @param {ComponentContext} context
*/
export function serialize_event_attribute(node, context) {
export function build_event_attribute(node, context) {
/** @type {string[]} */
const modifiers = [];
@ -146,7 +146,7 @@ export function serialize_event_attribute(node, context) {
modifiers.push('capture');
}
serialize_event(
build_event(
{
name: event_name,
expression: get_attribute_expression(node),
@ -166,14 +166,14 @@ export function serialize_event_attribute(node, context) {
* @param {null | ExpressionMetadata} metadata
* @param {ComponentContext} context
*/
export function serialize_event(node, metadata, context) {
export function build_event(node, metadata, context) {
const state = context.state;
/** @type {Expression} */
let expression;
if (node.expression) {
let handler = serialize_event_handler(node, metadata, context);
let handler = build_event_handler(node, metadata, context);
const event_name = node.name;
const delegated = node.delegated;
@ -249,7 +249,7 @@ export function serialize_event(node, metadata, context) {
'$.event',
b.literal(node.name),
state.node,
serialize_event_handler(node, metadata, context)
build_event_handler(node, metadata, context)
);
}

8
packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js
Unescape View File

@ -2,7 +2,7 @@
/** @import { ExpressionTag, SvelteNode, Text } from '#compiler' */
/** @import { ComponentClientTransformState, ComponentContext } from '../../types' */
import * as b from '../../../../../utils/builders.js';
import { serialize_template_literal, serialize_update } from './utils.js';
import { build_template_literal, build_update } from './utils.js';
/**
* Processes an array of template nodes, joining sibling text/expression nodes
@ -44,7 +44,7 @@ export function process_children(nodes, expression, is_element, { visit, state }
);
if (node.metadata.expression.has_call && !within_bound_contenteditable) {
state.init.push(serialize_update(update));
state.init.push(build_update(update));
} else if (node.metadata.expression.has_state && !within_bound_contenteditable) {
state.update.push(update);
} else {
@ -66,12 +66,12 @@ export function process_children(nodes, expression, is_element, { visit, state }
state.template.push(' ');
const [has_call, value] = serialize_template_literal(sequence, visit, state);
const [has_call, value] = build_template_literal(sequence, visit, state);
const update = b.stmt(b.call('$.set_text', text_id, value));
if (has_call && !within_bound_contenteditable) {
state.init.push(serialize_update(update));
state.init.push(build_update(update));
} else if (
sequence.some(
(node) => node.type === 'ExpressionTag' && node.metadata.expression.has_state

4
packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/function.js
Unescape View File

@ -1,6 +1,6 @@
/** @import { ArrowFunctionExpression, FunctionExpression, Node } from 'estree' */
/** @import { ComponentContext } from '../../types' */
import { serialize_hoistable_params } from '../../utils.js';
import { build_hoistable_params } from '../../utils.js';
/**
* @param {ArrowFunctionExpression | FunctionExpression} node
@ -21,7 +21,7 @@ export const visit_function = (node, context) => {
}
if (metadata?.hoistable === true) {
const params = serialize_hoistable_params(node, context);
const params = build_hoistable_params(node, context);
return /** @type {FunctionExpression} */ ({
...node,

16
packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js
Unescape View File

@ -16,7 +16,7 @@ import { locator } from '../../../../../state.js';
* @param {ComponentClientTransformState} state
* @returns {[boolean, TemplateLiteral]}
*/
export function serialize_template_literal(values, visit, state) {
export function build_template_literal(values, visit, state) {
/** @type {TemplateElement[]} */
const quasis = [];
@ -76,7 +76,7 @@ export function serialize_template_literal(values, visit, state) {
/**
* @param {Statement} statement
*/
export function serialize_update(statement) {
export function build_update(statement) {
const body =
statement.type === 'ExpressionStatement' ? statement.expression : b.block([statement]);
@ -86,9 +86,9 @@ export function serialize_update(statement) {
/**
* @param {Statement[]} update
*/
export function serialize_render_stmt(update) {
export function build_render_statement(update) {
return update.length === 1
? serialize_update(update[0])
? build_update(update[0])
: b.stmt(b.call('$.template_effect', b.thunk(b.block(update))));
}
@ -120,7 +120,7 @@ export function parse_directive_name(name) {
* @param {Expression} value
* @param {ExpressionStatement} update
*/
export function serialize_update_assignment(state, id, init, value, update) {
export function build_update_assignment(state, id, init, value, update) {
state.init.push(b.var(id, init));
state.update.push(
b.if(b.binary('!==', b.id(id), b.assignment('=', b.id(id), value)), b.block([update]))
@ -133,7 +133,7 @@ export function serialize_update_assignment(state, id, init, value, update) {
* @param {null | ExpressionMetadata} metadata
* @param {ComponentContext} context
*/
export function serialize_event_handler(node, metadata, { state, visit }) {
export function build_event_handler(node, metadata, { state, visit }) {
/** @type {Expression} */
let handler;
@ -242,7 +242,7 @@ export function serialize_event_handler(node, metadata, { state, visit }) {
* @param {Expression} value
* @param {import('zimmerframe').Context<SvelteNode, ComponentClientTransformState>} context
*/
export function serialize_bind_this(expression, value, { state, visit }) {
export function build_bind_this(expression, value, { state, visit }) {
/** @type {Identifier[]} */
const ids = [];
@ -308,7 +308,7 @@ export function serialize_bind_this(expression, value, { state, visit }) {
* @param {BindDirective} binding
* @param {MemberExpression} expression
*/
export function serialize_validate_binding(state, binding, expression) {
export function build_validate_binding(state, binding, expression) {
const string = state.analysis.source.slice(binding.start, binding.end);
const get_object = b.thunk(/** @type {Expression} */ (expression.object));

10
packages/svelte/src/compiler/phases/3-transform/server/visitors/AssignmentExpression.js
Unescape View File

@ -3,7 +3,7 @@
/** @import { Context, ServerTransformState } from '../types.js' */
import * as b from '../../../../utils/builders.js';
import { extract_paths } from '../../../../utils/ast.js';
import { serialize_get_binding } from './shared/utils.js';
import { build_getter } from './shared/utils.js';
/**
* @param {AssignmentExpression} node
@ -27,7 +27,7 @@ export function AssignmentExpression(node, context) {
const assignments = extract_paths(node.left).map((path) => {
const value = path.expression?.(rhs);
let assignment = serialize_assignment('=', path.node, value, context);
let assignment = build_assignment('=', path.node, value, context);
if (assignment !== null) changed = true;
return assignment ?? b.assignment('=', path.node, value);
@ -53,7 +53,7 @@ export function AssignmentExpression(node, context) {
return sequence;
}
return serialize_assignment(node.operator, node.left, node.right, context) || context.next();
return build_assignment(node.operator, node.left, node.right, context) || context.next();
}
/**
@ -64,7 +64,7 @@ export function AssignmentExpression(node, context) {
* @param {import('zimmerframe').Context<SvelteNode, ServerTransformState>} context
* @returns {Expression | null}
*/
function serialize_assignment(operator, left, right, context) {
function build_assignment(operator, left, right, context) {
let object = left;
while (object.type === 'MemberExpression') {
@ -89,7 +89,7 @@ function serialize_assignment(operator, left, right, context) {
// turn `x += 1` into `x = x + 1`
value = b.binary(
/** @type {BinaryOperator} */ (operator.slice(0, -1)),
serialize_get_binding(left, context.state),
build_getter(left, context.state),
value
);
}

4
packages/svelte/src/compiler/phases/3-transform/server/visitors/Component.js
Unescape View File

@ -1,12 +1,12 @@
/** @import { Component } from '#compiler' */
/** @import { ComponentContext } from '../types.js' */
import * as b from '../../../../utils/builders.js';
import { serialize_inline_component } from './shared/component.js';
import { build_inline_component } from './shared/component.js';
/**
* @param {Component} node
* @param {ComponentContext} context
*/
export function Component(node, context) {
serialize_inline_component(node, b.id(node.name), context);
build_inline_component(node, b.id(node.name), context);
}

4
packages/svelte/src/compiler/phases/3-transform/server/visitors/Fragment.js
Unescape View File

@ -2,7 +2,7 @@
/** @import { ComponentContext, ComponentServerTransformState } from '../types.js' */
import { clean_nodes, infer_namespace } from '../../utils.js';
import * as b from '../../../../utils/builders.js';
import { empty_comment, process_children, serialize_template } from './shared/utils.js';
import { empty_comment, process_children, build_template } from './shared/utils.js';
/**
* @param {Fragment} node
@ -42,5 +42,5 @@ export function Fragment(node, context) {
process_children(trimmed, { ...context, state });
return b.block([...state.init, ...serialize_template(state.template)]);
return b.block([...state.init, ...build_template(state.template)]);
}

4
packages/svelte/src/compiler/phases/3-transform/server/visitors/Identifier.js
Unescape View File

@ -2,7 +2,7 @@
/** @import { Context } from '../types.js' */
import is_reference from 'is-reference';
import * as b from '../../../../utils/builders.js';
import { serialize_get_binding } from './shared/utils.js';
import { build_getter } from './shared/utils.js';
/**
* @param {Identifier} node
@ -14,6 +14,6 @@ export function Identifier(node, context) {
return b.id('$$sanitized_props');
}
return serialize_get_binding(node, context.state);
return build_getter(node, context.state);
}
}

10
packages/svelte/src/compiler/phases/3-transform/server/visitors/RegularElement.js
Unescape View File

@ -6,8 +6,8 @@ import { is_void } from '../../../../../utils.js';
import { dev, locator } from '../../../../state.js';
import * as b from '../../../../utils/builders.js';
import { clean_nodes, determine_namespace_for_children } from '../../utils.js';
import { serialize_element_attributes } from './shared/element.js';
import { process_children, serialize_template } from './shared/utils.js';
import { build_element_attributes } from './shared/element.js';
import { process_children, build_template } from './shared/utils.js';
/**
* @param {RegularElement} node
@ -26,7 +26,7 @@ export function RegularElement(node, context) {
};
context.state.template.push(b.literal(`<${node.name}`));
const body = serialize_element_attributes(node, { ...context, state });
const body = build_element_attributes(node, { ...context, state });
context.state.template.push(b.literal('>'));
if ((node.name === 'script' || node.name === 'style') && node.fragment.nodes.length === 1) {
@ -89,8 +89,8 @@ export function RegularElement(node, context) {
state.template.push(
b.if(
id,
b.block(serialize_template([id])),
b.block([...inner_state.init, ...serialize_template(inner_state.template)])
b.block(build_template([id])),
b.block([...inner_state.init, ...build_template(inner_state.template)])
)
);
}

4
packages/svelte/src/compiler/phases/3-transform/server/visitors/SlotElement.js
Unescape View File

@ -2,7 +2,7 @@
/** @import { SlotElement } from '#compiler' */
/** @import { ComponentContext } from '../types.js' */
import * as b from '../../../../utils/builders.js';
import { empty_comment, serialize_attribute_value } from './shared/utils.js';
import { empty_comment, build_attribute_value } from './shared/utils.js';
/**
* @param {SlotElement} node
@ -22,7 +22,7 @@ export function SlotElement(node, context) {
if (attribute.type === 'SpreadAttribute') {
spreads.push(/** @type {Expression} */ (context.visit(attribute)));
} else if (attribute.type === 'Attribute') {
const value = serialize_attribute_value(attribute.value, context, false, true);
const value = build_attribute_value(attribute.value, context, false, true);
if (attribute.name === 'name') {
expression = b.member(b.member_id('$$props.$$slots'), value, true, true);

8
packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteComponent.js
Unescape View File

@ -1,16 +1,12 @@
/** @import { Expression } from 'estree' */
/** @import { SvelteComponent } from '#compiler' */
/** @import { ComponentContext } from '../types.js' */
import { serialize_inline_component } from './shared/component.js';
import { build_inline_component } from './shared/component.js';
/**
* @param {SvelteComponent} node
* @param {ComponentContext} context
*/
export function SvelteComponent(node, context) {
serialize_inline_component(
node,
/** @type {Expression} */ (context.visit(node.expression)),
context
);
build_inline_component(node, /** @type {Expression} */ (context.visit(node.expression)), context);
}

8
packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteElement.js
Unescape View File

@ -4,8 +4,8 @@
import { dev } from '../../../../state.js';
import * as b from '../../../../utils/builders.js';
import { determine_namespace_for_children } from '../../utils.js';
import { serialize_element_attributes } from './shared/element.js';
import { serialize_template } from './shared/utils.js';
import { build_element_attributes } from './shared/element.js';
import { build_template } from './shared/utils.js';
/**
* @param {SvelteElement} node
@ -33,13 +33,13 @@ export function SvelteElement(node, context) {
init: []
};
serialize_element_attributes(node, { ...context, state });
build_element_attributes(node, { ...context, state });
if (dev) {
context.state.template.push(b.stmt(b.call('$.push_element', tag, b.id('$$payload'))));
}
const attributes = b.block([...state.init, ...serialize_template(state.template)]);
const attributes = b.block([...state.init, ...build_template(state.template)]);
const children = /** @type {BlockStatement} */ (context.visit(node.fragment, state));
context.state.template.push(

4
packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteSelf.js
Unescape View File

@ -1,12 +1,12 @@
/** @import { SvelteSelf } from '#compiler' */
/** @import { ComponentContext } from '../types.js' */
import * as b from '../../../../utils/builders.js';
import { serialize_inline_component } from './shared/component.js';
import { build_inline_component } from './shared/component.js';
/**
* @param {SvelteSelf} node
* @param {ComponentContext} context
*/
export function SvelteSelf(node, context) {
serialize_inline_component(node, b.id(context.state.analysis.name), context);
build_inline_component(node, b.id(context.state.analysis.name), context);
}

4
packages/svelte/src/compiler/phases/3-transform/server/visitors/TitleElement.js
Unescape View File

@ -1,7 +1,7 @@
/** @import { TitleElement } from '#compiler' */
/** @import { ComponentContext } from '../types.js' */
import * as b from '../../../../utils/builders.js';
import { process_children, serialize_template } from './shared/utils.js';
import { process_children, build_template } from './shared/utils.js';
/**
* @param {TitleElement} node
@ -13,5 +13,5 @@ export function TitleElement(node, context) {
process_children(node.fragment.nodes, { ...context, state: { ...context.state, template } });
template.push(b.literal('</title>'));
context.state.init.push(...serialize_template(template, b.id('$$payload.title'), '='));
context.state.init.push(...build_template(template, b.id('$$payload.title'), '='));
}

8
packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/component.js
Unescape View File

@ -1,7 +1,7 @@
/** @import { BlockStatement, Expression, Pattern, Property, Statement } from 'estree' */
/** @import { Attribute, Component, LetDirective, SvelteComponent, SvelteSelf, TemplateNode, Text } from '#compiler' */
/** @import { ComponentContext } from '../../types.js' */
import { empty_comment, serialize_attribute_value } from './utils.js';
import { empty_comment, build_attribute_value } from './utils.js';
import * as b from '../../../../../utils/builders.js';
import { is_element_node } from '../../../../nodes.js';
@ -10,7 +10,7 @@ import { is_element_node } from '../../../../nodes.js';
* @param {Expression} expression
* @param {ComponentContext} context
*/
export function serialize_inline_component(node, expression, context) {
export function build_inline_component(node, expression, context) {
/** @type {Array<Property[] | Expression>} */
const props_and_spreads = [];
@ -59,7 +59,7 @@ export function serialize_inline_component(node, expression, context) {
props_and_spreads.push(/** @type {Expression} */ (context.visit(attribute)));
} else if (attribute.type === 'Attribute') {
if (attribute.name.startsWith('--')) {
const value = serialize_attribute_value(attribute.value, context, false, true);
const value = build_attribute_value(attribute.value, context, false, true);
custom_css_props.push(b.init(attribute.name, value));
continue;
}
@ -68,7 +68,7 @@ export function serialize_inline_component(node, expression, context) {
has_children_prop = true;
}
const value = serialize_attribute_value(attribute.value, context, false, true);
const value = build_attribute_value(attribute.value, context, false, true);
push_prop(b.prop('init', b.key(attribute.name), value));
} else if (attribute.type === 'BindDirective' && attribute.name !== 'this') {
// TODO this needs to turn the whole thing into a while loop because the binding could be mutated eagerly in the child

42
packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js
Unescape View File

@ -18,7 +18,7 @@ import {
ELEMENT_IS_NAMESPACED,
ELEMENT_PRESERVE_ATTRIBUTE_CASE
} from '../../../../../../constants.js';
import { serialize_attribute_value } from './utils.js';
import { build_attribute_value } from './utils.js';
import {
is_boolean_attribute,
is_content_editable_binding,
@ -33,7 +33,7 @@ const WHITESPACE_INSENSITIVE_ATTRIBUTES = ['class', 'style'];
* @param {RegularElement | SvelteElement} node
* @param {import('zimmerframe').Context<SvelteNode, ComponentServerTransformState>} context
*/
export function serialize_element_attributes(node, context) {
export function build_element_attributes(node, context) {
/** @type {Array<Attribute | SpreadAttribute>} */
const attributes = [];
@ -67,7 +67,7 @@ export function serialize_element_attributes(node, context) {
// also see related code in analysis phase
attribute.value[0].data = '\n' + attribute.value[0].data;
}
content = b.call('$.escape', serialize_attribute_value(attribute.value, context));
content = b.call('$.escape', build_attribute_value(attribute.value, context));
} else if (node.name !== 'select') {
// omit value attribute for select elements, it's irrelevant for the initially selected value and has no
// effect on the selected value after the user interacts with the select element (the value _property_ does, but not the attribute)
@ -139,12 +139,12 @@ export function serialize_element_attributes(node, context) {
expression: is_checkbox
? b.call(
b.member(attribute.expression, b.id('includes')),
serialize_attribute_value(value_attribute.value, context)
build_attribute_value(value_attribute.value, context)
)
: b.binary(
'===',
attribute.expression,
serialize_attribute_value(value_attribute.value, context)
build_attribute_value(value_attribute.value, context)
),
metadata: {
expression: create_expression_metadata()
@ -185,14 +185,14 @@ export function serialize_element_attributes(node, context) {
} else if (attribute.type === 'StyleDirective') {
style_directives.push(attribute);
} else if (attribute.type === 'LetDirective') {
// do nothing, these are handled inside `serialize_inline_component`
// do nothing, these are handled inside `build_inline_component`
} else {
context.visit(attribute);
}
}
if (class_directives.length > 0 && !has_spread) {
const class_attribute = serialize_class_directives(
const class_attribute = build_class_directives(
class_directives,
/** @type {Attribute | null} */ (attributes[class_index] ?? null)
);
@ -202,7 +202,7 @@ export function serialize_element_attributes(node, context) {
}
if (style_directives.length > 0 && !has_spread) {
serialize_style_directives(
build_style_directives(
style_directives,
/** @type {Attribute | null} */ (attributes[style_index] ?? null),
context
@ -213,19 +213,13 @@ export function serialize_element_attributes(node, context) {
}
if (has_spread) {
serialize_element_spread_attributes(
node,
attributes,
style_directives,
class_directives,
context
);
build_element_spread_attributes(node, attributes, style_directives, class_directives, context);
} else {
for (const attribute of /** @type {Attribute[]} */ (attributes)) {
if (attribute.value === true || is_text_attribute(attribute)) {
const name = get_attribute_name(node, attribute, context);
const literal_value = /** @type {Literal} */ (
serialize_attribute_value(
build_attribute_value(
attribute.value,
context,
WHITESPACE_INSENSITIVE_ATTRIBUTES.includes(name)
@ -246,7 +240,7 @@ export function serialize_element_attributes(node, context) {
}
const name = get_attribute_name(node, attribute, context);
const value = serialize_attribute_value(
const value = build_attribute_value(
attribute.value,
context,
WHITESPACE_INSENSITIVE_ATTRIBUTES.includes(name)
@ -290,7 +284,7 @@ function get_attribute_name(element, attribute, context) {
* @param {ClassDirective[]} class_directives
* @param {ComponentContext} context
*/
function serialize_element_spread_attributes(
function build_element_spread_attributes(
element,
attributes,
style_directives,
@ -324,7 +318,7 @@ function serialize_element_spread_attributes(
directive.name,
directive.value === true
? b.id(directive.name)
: serialize_attribute_value(directive.value, context, true)
: build_attribute_value(directive.value, context, true)
)
);
@ -341,7 +335,7 @@ function serialize_element_spread_attributes(
attributes.map((attribute) => {
if (attribute.type === 'Attribute') {
const name = get_attribute_name(element, attribute, context);
const value = serialize_attribute_value(
const value = build_attribute_value(
attribute.value,
context,
WHITESPACE_INSENSITIVE_ATTRIBUTES.includes(name)
@ -363,7 +357,7 @@ function serialize_element_spread_attributes(
* @param {Attribute | null} class_attribute
* @returns
*/
function serialize_class_directives(class_directives, class_attribute) {
function build_class_directives(class_directives, class_attribute) {
const expressions = class_directives.map((directive) =>
b.conditional(directive.expression, b.literal(directive.name), b.literal(''))
);
@ -415,12 +409,12 @@ function serialize_class_directives(class_directives, class_attribute) {
* @param {Attribute | null} style_attribute
* @param {ComponentContext} context
*/
function serialize_style_directives(style_directives, style_attribute, context) {
function build_style_directives(style_directives, style_attribute, context) {
const styles = style_directives.map((directive) => {
let value =
directive.value === true
? b.id(directive.name)
: serialize_attribute_value(directive.value, context, true);
: build_attribute_value(directive.value, context, true);
if (directive.modifiers.includes('important')) {
value = b.binary('+', value, b.literal(' !important'));
}
@ -432,7 +426,7 @@ function serialize_style_directives(style_directives, style_attribute, context)
? b.object(styles)
: b.call(
'$.merge_styles',
serialize_attribute_value(style_attribute.value, context, true),
build_attribute_value(style_attribute.value, context, true),
b.object(styles)
);

8
packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/utils.js
Unescape View File

@ -94,7 +94,7 @@ function is_statement(node) {
* @param {AssignmentOperator} operator
* @returns {Statement[]}
*/
export function serialize_template(template, out = b.id('$$payload.out'), operator = '+=') {
export function build_template(template, out = b.id('$$payload.out'), operator = '+=') {
/** @type {TemplateElement[]} */
let quasis = [];
@ -152,7 +152,7 @@ export function serialize_template(template, out = b.id('$$payload.out'), operat
* @param {boolean} is_component
* @returns {Expression}
*/
export function serialize_attribute_value(
export function build_attribute_value(
value,
context,
trim_whitespace = false,
@ -207,7 +207,7 @@ export function serialize_attribute_value(
* @param {ServerTransformState} state
* @returns {Expression}
*/
export function serialize_get_binding(node, state) {
export function build_getter(node, state) {
const binding = state.scope.get(node.name);
if (binding === null || node === binding.node) {
@ -221,7 +221,7 @@ export function serialize_get_binding(node, state) {
'$.store_get',
b.assignment('??=', b.id('$$store_subs'), b.object([])),
b.literal(node.name),
serialize_get_binding(store_id, state)
build_getter(store_id, state)
);
}

Write Preview
Loading…
Cancel
Save