|
|
|
|
@ -8,7 +8,7 @@ import {
|
|
|
|
|
is_dom_property,
|
|
|
|
|
is_load_error_element
|
|
|
|
|
} from '../../../../../utils.js';
|
|
|
|
|
import { is_ignored } from '../../../../state.js';
|
|
|
|
|
import { is_ignored, custom_renderer } from '../../../../state.js';
|
|
|
|
|
import { is_event_attribute, is_text_attribute } from '../../../../utils/ast.js';
|
|
|
|
|
import * as b from '#compiler/builders';
|
|
|
|
|
import {
|
|
|
|
|
@ -39,9 +39,7 @@ import { TEMPLATE_FRAGMENT } from '../../../../../constants.js';
|
|
|
|
|
*/
|
|
|
|
|
export function RegularElement(node, context) {
|
|
|
|
|
const is_html =
|
|
|
|
|
context.state.metadata.namespace === 'html' &&
|
|
|
|
|
node.name !== 'svg' &&
|
|
|
|
|
!context.state.analysis.custom_renderer;
|
|
|
|
|
context.state.metadata.namespace === 'html' && node.name !== 'svg' && !custom_renderer;
|
|
|
|
|
const name = is_html ? node.name.toLowerCase() : node.name;
|
|
|
|
|
context.state.template.push_element(name, node.start, is_html);
|
|
|
|
|
|
|
|
|
|
@ -51,7 +49,7 @@ export function RegularElement(node, context) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// we never treat elements as custom element in custom renderers, since we don't want to apply special handling to them (e.g. class merging)
|
|
|
|
|
const is_custom_element = is_custom_element_node(node) && !context.state.analysis.custom_renderer;
|
|
|
|
|
const is_custom_element = is_custom_element_node(node) && !custom_renderer;
|
|
|
|
|
|
|
|
|
|
// cloneNode is faster, but it does not instantiate the underlying class of the
|
|
|
|
|
// custom element until the template is connected to the dom, which would
|
|
|
|
|
@ -212,7 +210,7 @@ export function RegularElement(node, context) {
|
|
|
|
|
|
|
|
|
|
/** If true, needs `__value` for inputs */
|
|
|
|
|
const needs_special_value_handling =
|
|
|
|
|
!context.state.analysis.custom_renderer &&
|
|
|
|
|
!custom_renderer &&
|
|
|
|
|
(name === 'option' || name === 'select' || bindings.has('group') || bindings.has('checked'));
|
|
|
|
|
|
|
|
|
|
if (has_spread) {
|
|
|
|
|
@ -236,7 +234,7 @@ export function RegularElement(node, context) {
|
|
|
|
|
continue;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const name = get_attribute_name(node, attribute, !!context.state.analysis.custom_renderer);
|
|
|
|
|
const name = get_attribute_name(node, attribute);
|
|
|
|
|
|
|
|
|
|
if (
|
|
|
|
|
!is_custom_element &&
|
|
|
|
|
@ -258,7 +256,7 @@ export function RegularElement(node, context) {
|
|
|
|
|
if (name !== 'class' || value) {
|
|
|
|
|
context.state.template.set_prop(attribute.name, value === true ? '' : value);
|
|
|
|
|
}
|
|
|
|
|
} else if (name === 'autofocus' && !context.state.analysis.custom_renderer) {
|
|
|
|
|
} else if (name === 'autofocus' && !custom_renderer) {
|
|
|
|
|
let { value } = build_attribute_value(attribute.value, context);
|
|
|
|
|
context.state.init.push(b.stmt(b.call('$.autofocus', node_id, value)));
|
|
|
|
|
} else if (name === 'class') {
|
|
|
|
|
@ -274,14 +272,7 @@ export function RegularElement(node, context) {
|
|
|
|
|
(value, metadata) => context.state.memoizer.add(value, metadata)
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
const update = build_element_attribute_update(
|
|
|
|
|
node,
|
|
|
|
|
node_id,
|
|
|
|
|
name,
|
|
|
|
|
value,
|
|
|
|
|
attributes,
|
|
|
|
|
!!context.state.analysis.custom_renderer
|
|
|
|
|
);
|
|
|
|
|
const update = build_element_attribute_update(node, node_id, name, value, attributes);
|
|
|
|
|
|
|
|
|
|
(has_state ? context.state.update : context.state.init).push(b.stmt(update));
|
|
|
|
|
}
|
|
|
|
|
@ -357,7 +348,7 @@ export function RegularElement(node, context) {
|
|
|
|
|
const empty_string = value.type === 'Literal' && value.value === '';
|
|
|
|
|
|
|
|
|
|
if (!empty_string) {
|
|
|
|
|
if (context.state.analysis.custom_renderer) {
|
|
|
|
|
if (custom_renderer) {
|
|
|
|
|
// custom renderers need to use the method to invoke the renderer
|
|
|
|
|
context.state.template.push_text([
|
|
|
|
|
{
|
|
|
|
|
@ -377,7 +368,7 @@ export function RegularElement(node, context) {
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
} else if (is_customizable_select_element(node) && !context.state.analysis.custom_renderer) {
|
|
|
|
|
} else if (is_customizable_select_element(node) && !custom_renderer) {
|
|
|
|
|
// For <option>, <optgroup>, or <select> elements with rich content, we need to branch based on browser support.
|
|
|
|
|
// Modern browsers preserve rich HTML in options, older browsers strip it to text only.
|
|
|
|
|
// We create a separate template for the rich content and append it to the element.
|
|
|
|
|
@ -439,7 +430,7 @@ export function RegularElement(node, context) {
|
|
|
|
|
|
|
|
|
|
// The same applies if it's a `<template>` element, since we need to
|
|
|
|
|
// set the value of `hydrate_node` to `node.content`
|
|
|
|
|
if (name === 'template' && !context.state.analysis.custom_renderer) {
|
|
|
|
|
if (name === 'template' && !custom_renderer) {
|
|
|
|
|
needs_reset = true;
|
|
|
|
|
child_state.init.push(b.stmt(b.call('$.hydrate_template', arg)));
|
|
|
|
|
arg = b.member(arg, 'content');
|
|
|
|
|
@ -476,7 +467,7 @@ export function RegularElement(node, context) {
|
|
|
|
|
context.state.after_update.push(...element_state.after_update);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (name === 'selectedcontent' && !context.state.analysis.custom_renderer) {
|
|
|
|
|
if (name === 'selectedcontent' && !custom_renderer) {
|
|
|
|
|
context.state.init.push(
|
|
|
|
|
b.stmt(
|
|
|
|
|
b.call(
|
|
|
|
|
@ -608,14 +599,7 @@ export function build_style_directives_object(
|
|
|
|
|
* @param {Expression} value
|
|
|
|
|
* @param {Array<AST.Attribute | AST.SpreadAttribute>} attributes
|
|
|
|
|
*/
|
|
|
|
|
function build_element_attribute_update(
|
|
|
|
|
element,
|
|
|
|
|
node_id,
|
|
|
|
|
name,
|
|
|
|
|
value,
|
|
|
|
|
attributes,
|
|
|
|
|
custom_renderer = false
|
|
|
|
|
) {
|
|
|
|
|
function build_element_attribute_update(element, node_id, name, value, attributes) {
|
|
|
|
|
if (name === 'muted' && !custom_renderer) {
|
|
|
|
|
// Special case for Firefox who needs it set as a property in order to work
|
|
|
|
|
return b.assignment('=', b.member(node_id, b.id('muted')), value);
|
|
|
|
|
|