chore: change options from `boolean` to `list` (templatingMode: "functional")

custom-render-shim-dom
paoloricciuti 6 months ago
parent c75c42949b
commit 64219ed5e4

@ -167,7 +167,7 @@ export function client_component(analysis, options) {
in_constructor: false, in_constructor: false,
instance_level_snippets: [], instance_level_snippets: [],
module_level_snippets: [], module_level_snippets: [],
prevent_template_cloning: options.preventTemplateCloning, is_functional_template_mode: options.templatingMode === 'functional',
// these are set inside the `Fragment` visitor, and cannot be used until then // these are set inside the `Fragment` visitor, and cannot be used until then
init: /** @type {any} */ (null), init: /** @type {any} */ (null),

@ -27,7 +27,7 @@ function get_template_function(namespace, state) {
: contains_script_tag : contains_script_tag
? '$.template_with_script' ? '$.template_with_script'
: '$.template' : '$.template'
).concat(state.prevent_template_cloning ? '_fn' : ''); ).concat(state.is_functional_template_mode ? '_fn' : '');
} }
/** /**
@ -75,7 +75,7 @@ export function transform_template(state, context, namespace, template_name, fla
/** @type {Expression[]} */ /** @type {Expression[]} */
const args = [ const args = [
state.prevent_template_cloning state.is_functional_template_mode
? template_to_functions(state.template, namespace) ? template_to_functions(state.template, namespace)
: b.template([b.quasi(template_to_string(state.template), true)], []) : b.template([b.quasi(template_to_string(state.template), true)], [])
]; ];

@ -94,7 +94,7 @@ export interface ComponentClientTransformState extends ClientTransformState {
}; };
}; };
readonly preserve_whitespace: boolean; readonly preserve_whitespace: boolean;
readonly prevent_template_cloning?: boolean; readonly is_functional_template_mode?: boolean;
/** The anchor node for the current context */ /** The anchor node for the current context */
readonly node: Identifier; readonly node: Identifier;

@ -37,7 +37,7 @@ export function Fragment(node, context) {
context.state, context.state,
context.state.preserve_whitespace, context.state.preserve_whitespace,
context.state.options.preserveComments, context.state.options.preserveComments,
context.state.prevent_template_cloning context.state.is_functional_template_mode
); );
if (hoisted.length === 0 && trimmed.length === 0) { if (hoisted.length === 0 && trimmed.length === 0) {
@ -133,7 +133,7 @@ export function Fragment(node, context) {
...context, ...context,
state state
}, },
context.state.prevent_template_cloning context.state.is_functional_template_mode
); );
body.push(b.var(id, b.call('$.text'))); body.push(b.var(id, b.call('$.text')));
@ -146,7 +146,7 @@ export function Fragment(node, context) {
() => b.id('$$anchor'), () => b.id('$$anchor'),
false, false,
{ ...context, state }, { ...context, state },
context.state.prevent_template_cloning context.state.is_functional_template_mode
); );
} else { } else {
/** @type {(is_text: boolean) => Expression} */ /** @type {(is_text: boolean) => Expression} */
@ -157,7 +157,7 @@ export function Fragment(node, context) {
expression, expression,
false, false,
{ ...context, state }, { ...context, state },
context.state.prevent_template_cloning context.state.is_functional_template_mode
); );
let flags = TEMPLATE_FRAGMENT; let flags = TEMPLATE_FRAGMENT;

@ -124,7 +124,7 @@ export function RegularElement(node, context) {
kind: 'set_prop', kind: 'set_prop',
args: [ args: [
'is', 'is',
context.state.prevent_template_cloning context.state.is_functional_template_mode
? value.value ? value.value
: escape_html(value.value, true) : escape_html(value.value, true)
] ]
@ -312,7 +312,7 @@ export function RegularElement(node, context) {
: [ : [
value === true value === true
? '' ? ''
: context.state.prevent_template_cloning : context.state.is_functional_template_mode
? value ? value
: escape_html(value, true) : escape_html(value, true)
] ]
@ -386,7 +386,7 @@ export function RegularElement(node, context) {
state, state,
node.name === 'script' || state.preserve_whitespace, node.name === 'script' || state.preserve_whitespace,
state.options.preserveComments, state.options.preserveComments,
state.prevent_template_cloning state.is_functional_template_mode
); );
/** @type {typeof state} */ /** @type {typeof state} */
@ -438,7 +438,7 @@ export function RegularElement(node, context) {
...context, ...context,
state: child_state state: child_state
}, },
context.state.prevent_template_cloning context.state.is_functional_template_mode
); );
if (needs_reset) { if (needs_reset) {

@ -15,14 +15,14 @@ import { build_template_chunk } from './utils.js';
* @param {(is_text: boolean) => Expression} initial * @param {(is_text: boolean) => Expression} initial
* @param {boolean} is_element * @param {boolean} is_element
* @param {ComponentContext} context * @param {ComponentContext} context
* @param {boolean} [prevent_template_cloning] * @param {boolean} [is_functional_template_mode]
*/ */
export function process_children( export function process_children(
nodes, nodes,
initial, initial,
is_element, is_element,
{ visit, state }, { visit, state },
prevent_template_cloning is_functional_template_mode
) { ) {
const within_bound_contenteditable = state.metadata.bound_contenteditable; const within_bound_contenteditable = state.metadata.bound_contenteditable;
let prev = initial; let prev = initial;
@ -73,7 +73,9 @@ export function process_children(
skipped += 1; skipped += 1;
state.template.push({ state.template.push({
kind: 'create_text', kind: 'create_text',
args: [sequence.map((node) => (prevent_template_cloning ? node.data : node.raw)).join('')] args: [
sequence.map((node) => (is_functional_template_mode ? node.data : node.raw)).join('')
]
}); });
return; return;
} }

@ -141,7 +141,7 @@ function sort_const_tags(nodes, state) {
* @param {TransformState & { options: ValidatedCompileOptions }} state * @param {TransformState & { options: ValidatedCompileOptions }} state
* @param {boolean} preserve_whitespace * @param {boolean} preserve_whitespace
* @param {boolean} preserve_comments * @param {boolean} preserve_comments
* @param {boolean} [prevent_template_cloning] * @param {boolean} [is_functional_template_mode]
*/ */
export function clean_nodes( export function clean_nodes(
parent, parent,
@ -154,7 +154,7 @@ export function clean_nodes(
// rather than from `ClientTransformState` and `ServerTransformState` // rather than from `ClientTransformState` and `ServerTransformState`
preserve_whitespace, preserve_whitespace,
preserve_comments, preserve_comments,
prevent_template_cloning is_functional_template_mode
) { ) {
if (!state.analysis.runes) { if (!state.analysis.runes) {
nodes = sort_const_tags(nodes, state); nodes = sort_const_tags(nodes, state);
@ -276,13 +276,13 @@ export function clean_nodes(
// initial newline inside a `<pre>` is disregarded, if not followed by another newline // initial newline inside a `<pre>` is disregarded, if not followed by another newline
if ( if (
parent.type === 'RegularElement' && parent.type === 'RegularElement' &&
(parent.name === 'pre' || (prevent_template_cloning && parent.name === 'textarea')) && (parent.name === 'pre' || (is_functional_template_mode && parent.name === 'textarea')) &&
first?.type === 'Text' first?.type === 'Text'
) { ) {
const text = first.data.replace(regex_starts_with_newline, ''); const text = first.data.replace(regex_starts_with_newline, '');
if (text !== first.data) { if (text !== first.data) {
const tmp = text.replace(regex_starts_with_newline, ''); const tmp = text.replace(regex_starts_with_newline, '');
if (text === tmp || prevent_template_cloning) { if (text === tmp || is_functional_template_mode) {
first.data = text; first.data = text;
first.raw = first.raw.replace(regex_starts_with_newline, ''); first.raw = first.raw.replace(regex_starts_with_newline, '');
if (first.data === '') { if (first.data === '') {

@ -114,11 +114,11 @@ export interface CompileOptions extends ModuleCompileOptions {
*/ */
preserveWhitespace?: boolean; preserveWhitespace?: boolean;
/** /**
* If `true`, the template will get compiled to a series of `document.createElement` calls instead of using `template.innerHTML`. * If `functional`, the template will get compiled to a series of `document.createElement` calls, if `string` it will render the template tp a string and use `template.innerHTML`.
* *
* @default false * @default 'string'
*/ */
preventTemplateCloning?: boolean; templatingMode?: 'string' | 'functional';
/** /**
* Set to `true` to force the compiler into runes mode, even if there are no indications of runes usage. * Set to `true` to force the compiler into runes mode, even if there are no indications of runes usage.
* Set to `false` to force the compiler into ignoring runes, even if there are indications of runes usage. * Set to `false` to force the compiler into ignoring runes, even if there are indications of runes usage.

@ -110,7 +110,7 @@ export const validate_component_options =
preserveComments: boolean(false), preserveComments: boolean(false),
preventTemplateCloning: boolean(false), templatingMode: list(['string', 'functional']),
preserveWhitespace: boolean(false), preserveWhitespace: boolean(false),

@ -80,7 +80,7 @@ export async function compile_directory(
filename: path.join(cwd, file), filename: path.join(cwd, file),
...compileOptions, ...compileOptions,
generate, generate,
preventTemplateCloning: templating_mode === 'functional' templatingMode: templating_mode
}; };
if (file.endsWith('.js')) { if (file.endsWith('.js')) {

@ -106,7 +106,7 @@ async function run_test(
immutable: config.immutable, immutable: config.immutable,
customElement: test_dir.includes('custom-elements-samples'), customElement: test_dir.includes('custom-elements-samples'),
accessors: 'accessors' in config ? config.accessors : true, accessors: 'accessors' in config ? config.accessors : true,
preventTemplateCloning: templating_mode === 'functional' templatingMode: templating_mode
}); });
write( write(
@ -171,7 +171,7 @@ async function run_test(
immutable: config.immutable, immutable: config.immutable,
customElement: test_dir.includes('custom-elements-samples'), customElement: test_dir.includes('custom-elements-samples'),
accessors: 'accessors' in config ? config.accessors : true, accessors: 'accessors' in config ? config.accessors : true,
preventTemplateCloning: templating_mode === 'functional' templatingMode: templating_mode
}); });
return { return {

@ -168,7 +168,7 @@ async function common_setup(
immutable: config.immutable, immutable: config.immutable,
accessors: 'accessors' in config ? config.accessors : true, accessors: 'accessors' in config ? config.accessors : true,
runes, runes,
preventTemplateCloning: templating_mode === 'functional' templatingMode: templating_mode
}; };
// load_compiled can be used for debugging a test. It means the compiler will not run on the input // load_compiled can be used for debugging a test. It means the compiler will not run on the input

@ -845,11 +845,11 @@ declare module 'svelte/compiler' {
*/ */
preserveWhitespace?: boolean; preserveWhitespace?: boolean;
/** /**
* If `true`, the template will get compiled to a series of `document.createElement` calls instead of using `template.innerHTML`. * If `functional`, the template will get compiled to a series of `document.createElement` calls, if `string` it will render the template tp a string and use `template.innerHTML`.
* *
* @default false * @default 'string'
*/ */
preventTemplateCloning?: boolean; templatingMode?: 'string' | 'functional';
/** /**
* Set to `true` to force the compiler into runes mode, even if there are no indications of runes usage. * Set to `true` to force the compiler into runes mode, even if there are no indications of runes usage.
* Set to `false` to force the compiler into ignoring runes, even if there are indications of runes usage. * Set to `false` to force the compiler into ignoring runes, even if there are indications of runes usage.
@ -2561,11 +2561,11 @@ declare module 'svelte/types/compiler/interfaces' {
*/ */
preserveWhitespace?: boolean; preserveWhitespace?: boolean;
/** /**
* If `true`, the template will get compiled to a series of `document.createElement` calls instead of using `template.innerHTML`. * If `functional`, the template will get compiled to a series of `document.createElement` calls, if `string` it will render the template tp a string and use `template.innerHTML`.
* *
* @default false * @default 'string'
*/ */
preventTemplateCloning?: boolean; templatingMode?: 'string' | 'functional';
/** /**
* Set to `true` to force the compiler into runes mode, even if there are no indications of runes usage. * Set to `true` to force the compiler into runes mode, even if there are no indications of runes usage.
* Set to `false` to force the compiler into ignoring runes, even if there are indications of runes usage. * Set to `false` to force the compiler into ignoring runes, even if there are indications of runes usage.

Loading…
Cancel
Save