Home / Function/ SvelteElement() — svelte Function Reference

SvelteElement() — svelte Function Reference

Architecture documentation for the SvelteElement() function in SvelteElement.js from the svelte codebase.

Entity Profile

Dependency Diagram

graph TD
  33910f4c_6ec4_15d9_8342_5265e706975f["SvelteElement()"]
  f7b5a3fc_d53e_8647_11c4_d826334aec0c["SvelteElement.js"]
  33910f4c_6ec4_15d9_8342_5265e706975f -->|defined in| f7b5a3fc_d53e_8647_11c4_d826334aec0c
  8b731563_0657_df8d_6a4b_cd33990e2ed2["validate_element()"]
  33910f4c_6ec4_15d9_8342_5265e706975f -->|calls| 8b731563_0657_df8d_6a4b_cd33990e2ed2
  c342967b_b314_8027_476d_d085ed0e13f0["check_element()"]
  33910f4c_6ec4_15d9_8342_5265e706975f -->|calls| c342967b_b314_8027_476d_d085ed0e13f0
  653284b2_68fd_eee3_0064_918a4c065d4a["is_text_attribute()"]
  33910f4c_6ec4_15d9_8342_5265e706975f -->|calls| 653284b2_68fd_eee3_0064_918a4c065d4a
  313d2a82_30ea_3161_3aad_0cc2094979aa["mark_subtree_dynamic()"]
  33910f4c_6ec4_15d9_8342_5265e706975f -->|calls| 313d2a82_30ea_3161_3aad_0cc2094979aa
  style 33910f4c_6ec4_15d9_8342_5265e706975f fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js lines 13–78

export function SvelteElement(node, context) {
	validate_element(node, context);
	check_element(node, context);

	node.metadata.path = [...context.path];
	context.state.analysis.elements.push(node);

	const xmlns = /** @type {AST.Attribute & { value: [AST.Text] } | undefined} */ (
		node.attributes.find(
			(a) => a.type === 'Attribute' && a.name === 'xmlns' && is_text_attribute(a)
		)
	);

	if (xmlns) {
		node.metadata.svg = xmlns.value[0].data === NAMESPACE_SVG;
		node.metadata.mathml = xmlns.value[0].data === NAMESPACE_MATHML;
	} else {
		let i = context.path.length;
		while (i--) {
			const ancestor = context.path[i];

			if (
				ancestor.type === 'Component' ||
				ancestor.type === 'SvelteComponent' ||
				ancestor.type === 'SvelteFragment' ||
				ancestor.type === 'SnippetBlock' ||
				i === 0
			) {
				// Root element, or inside a slot or a snippet -> this resets the namespace, so assume the component namespace
				node.metadata.svg = context.state.options.namespace === 'svg';
				node.metadata.mathml = context.state.options.namespace === 'mathml';
				break;
			}

			if (ancestor.type === 'SvelteElement' || ancestor.type === 'RegularElement') {
				node.metadata.svg =
					ancestor.type === 'RegularElement' && ancestor.name === 'foreignObject'
						? false
						: ancestor.metadata.svg;

				node.metadata.mathml =
					ancestor.type === 'RegularElement' && ancestor.name === 'foreignObject'
						? false
						: ancestor.metadata.mathml;

				break;
			}
		}
	}

	mark_subtree_dynamic(context.path);

	context.visit(node.tag, {
		...context.state,
		expression: node.metadata.expression
	});

	for (const attribute of node.attributes) {
		context.visit(attribute);
	}

	context.visit(node.fragment, {
		...context.state,
		parent_element: null
	});
}

Domain

Subdomains

Frequently Asked Questions

What does SvelteElement() do?
SvelteElement() is a function in the svelte codebase, defined in packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js.
Where is SvelteElement() defined?
SvelteElement() is defined in packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js at line 13.
What does SvelteElement() call?
SvelteElement() calls 4 function(s): check_element, is_text_attribute, mark_subtree_dynamic, validate_element.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free