pull/16017/head
Rich Harris 4 months ago
parent 9cd02ab5f0
commit da5885e046

@ -1,3 +1,4 @@
/** @import { Expression } from 'estree' */
/** @import { Location } from 'locate-character' */ /** @import { Location } from 'locate-character' */
/** @import { AST } from '#compiler' */ /** @import { AST } from '#compiler' */
/** @import { ComponentContext, ComponentServerTransformState } from '../types.js' */ /** @import { ComponentContext, ComponentServerTransformState } from '../types.js' */
@ -127,55 +128,50 @@ export function RegularElement(node, context) {
} }
} }
const is_option_with_implicit_value = if (
node.name === 'option' && node.name === 'option' &&
!node.attributes.some( !node.attributes.some(
(attribute) => (attribute) =>
attribute.type === 'SpreadAttribute' || attribute.type === 'SpreadAttribute' ||
((attribute.type === 'Attribute' || attribute.type === 'BindDirective') && ((attribute.type === 'Attribute' || attribute.type === 'BindDirective') &&
attribute.name === 'value') attribute.name === 'value')
); )
) {
if (body === null && !is_option_with_implicit_value) {
process_children(trimmed, { ...context, state });
} else {
// we need the body if:
// - it's a <textarea> or a contenteditable element...we will add it ad the inner template in case the value of value is falsy
// - it's a valueless <option> element...we will check the body value at runtime to determine the implicit value selection
const inner_state = { ...state, template: [], init: [] }; const inner_state = { ...state, template: [], init: [] };
process_children(trimmed, { ...context, state: inner_state }); process_children(trimmed, { ...context, state: inner_state });
if (is_option_with_implicit_value) { state.template.push(
// in case of a valueless `<option>` element, $$body is a function that accepts the children...internally it b.stmt(
// will run the children to get the value of the body at runtime since it's needed to for the implicit value b.call(
// selection '$.valueless_option',
state.template.push( b.id('$$payload'),
b.stmt( b.thunk(b.block([...inner_state.init, ...build_template(inner_state.template)]))
b.call(
'$.valueless_option',
b.id('$$payload'),
b.thunk(b.block([...inner_state.init, ...build_template(inner_state.template)]))
)
) )
); )
} else { );
let id = body; } else if (body !== null) {
// if this is a `<textarea>` value or a contenteditable binding, we only add
// the body if the attribute/binding is falsy
const inner_state = { ...state, template: [], init: [] };
process_children(trimmed, { ...context, state: inner_state });
if (body.type !== 'Identifier') { let id = /** @type {Expression} */ (body);
id = b.id(state.scope.generate('$$body'));
state.template.push(b.const(id, body));
}
// Use the body expression as the body if it's truthy, otherwise use the inner template if (body.type !== 'Identifier') {
state.template.push( id = b.id(state.scope.generate('$$body'));
b.if( state.template.push(b.const(id, body));
id,
b.block(build_template([id])),
b.block([...inner_state.init, ...build_template(inner_state.template)])
)
);
} }
// Use the body expression as the body if it's truthy, otherwise use the inner template
state.template.push(
b.if(
id,
b.block(build_template([id])),
b.block([...inner_state.init, ...build_template(inner_state.template)])
)
);
} else {
process_children(trimmed, { ...context, state });
} }
if (select_with_value) { if (select_with_value) {

Loading…
Cancel
Save