Home / Function/ visit_component() — svelte Function Reference

visit_component() — svelte Function Reference

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

Function javascript Compiler Transformer calls 11 called by 3

Entity Profile

Dependency Diagram

graph TD
  c2e078e7_8b02_06d2_5983_59b1af376889["visit_component()"]
  057ad110_57ab_942c_4f8d_5c2f711bef54["component.js"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|defined in| 057ad110_57ab_942c_4f8d_5c2f711bef54
  c091e9f5_16ea_045f_b570_48d9e86c74a4["Component()"]
  c091e9f5_16ea_045f_b570_48d9e86c74a4 -->|calls| c2e078e7_8b02_06d2_5983_59b1af376889
  39b8e00c_24e5_3250_d478_1839c88a4abc["SvelteComponent()"]
  39b8e00c_24e5_3250_d478_1839c88a4abc -->|calls| c2e078e7_8b02_06d2_5983_59b1af376889
  8d52d38a_9916_3129_a7be_b1e99c477849["SvelteSelf()"]
  8d52d38a_9916_3129_a7be_b1e99c477849 -->|calls| c2e078e7_8b02_06d2_5983_59b1af376889
  e4437bdc_6df3_4ac6_3252_12819762cc5e["is_expression_attribute()"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|calls| e4437bdc_6df3_4ac6_3252_12819762cc5e
  a997caf9_1d66_f005_5b11_675724bd0ed8["get_attribute_expression()"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|calls| a997caf9_1d66_f005_5b11_675724bd0ed8
  e0e99a00_6e05_14b1_3821_80dbb3341928["is_resolved_snippet()"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|calls| e0e99a00_6e05_14b1_3821_80dbb3341928
  313d2a82_30ea_3161_3aad_0cc2094979aa["mark_subtree_dynamic()"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|calls| 313d2a82_30ea_3161_3aad_0cc2094979aa
  aa1c0209_00f3_20a2_8151_f55983e6a7a1["component_invalid_directive()"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|calls| aa1c0209_00f3_20a2_8151_f55983e6a7a1
  a66f9d57_7b19_e25b_d25d_7b8b2157e763["event_handler_invalid_component_modifier()"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|calls| a66f9d57_7b19_e25b_d25d_7b8b2157e763
  c3dd29c6_654d_d119_4318_e8151ff6da98["validate_attribute()"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|calls| c3dd29c6_654d_d119_4318_e8151ff6da98
  bea68f0a_0a0a_7d8f_73e5_a743e1048f95["disallow_unparenthesized_sequences()"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|calls| bea68f0a_0a0a_7d8f_73e5_a743e1048f95
  cea20d98_b8d1_aa5c_5f46_4ac417b7053c["validate_attribute_name()"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|calls| cea20d98_b8d1_aa5c_5f46_4ac417b7053c
  c3969ef3_0f9b_1699_e3b6_75b4a9916c7d["validate_slot_attribute()"]
  c2e078e7_8b02_06d2_5983_59b1af376889 -->|calls| c3969ef3_0f9b_1699_e3b6_75b4a9916c7d
  style c2e078e7_8b02_06d2_5983_59b1af376889 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js lines 19–162

export function visit_component(node, context) {
	node.metadata.path = [...context.path];

	// link this node to all the snippets that it could render, so that we can prune CSS correctly
	node.metadata.snippets = new Set();

	// 'resolved' means we know which snippets this component might render. if it is `false`,
	// then `node.metadata.snippets` is populated with every locally defined snippet
	// once analysis is complete
	let resolved = true;

	for (const attribute of node.attributes) {
		if (attribute.type === 'SpreadAttribute' || attribute.type === 'BindDirective') {
			resolved = false;
			continue;
		}

		if (attribute.type !== 'Attribute' || !is_expression_attribute(attribute)) {
			continue;
		}

		const expression = get_attribute_expression(attribute);

		// given an attribute like `foo={bar}`, if `bar` resolves to an import or a prop
		// then we know it doesn't reference a locally defined snippet. if it resolves
		// to a `{#snippet bar()}` then we know _which_ snippet it resolves to. in all
		// other cases, we can't know (without much more complex static analysis) which
		// snippets the component might render, so we treat the component as unresolved
		if (expression.type === 'Identifier') {
			const binding = context.state.scope.get(expression.name);

			resolved &&= is_resolved_snippet(binding);

			if (binding?.initial?.type === 'SnippetBlock') {
				node.metadata.snippets.add(binding.initial);
			}
		} else if (expression.type !== 'Literal') {
			resolved = false;
		}
	}

	if (resolved) {
		for (const child of node.fragment.nodes) {
			if (child.type === 'SnippetBlock') {
				node.metadata.snippets.add(child);
			}
		}
	}

	context.state.analysis.snippet_renderers.set(node, resolved);

	mark_subtree_dynamic(context.path);

	for (const attribute of node.attributes) {
		if (
			attribute.type !== 'Attribute' &&
			attribute.type !== 'SpreadAttribute' &&
			attribute.type !== 'LetDirective' &&
			attribute.type !== 'OnDirective' &&
			attribute.type !== 'BindDirective' &&
			attribute.type !== 'AttachTag'
		) {
			e.component_invalid_directive(attribute);
		}

		if (
			attribute.type === 'OnDirective' &&
			(attribute.modifiers.length > 1 || attribute.modifiers.some((m) => m !== 'once'))
		) {
			e.event_handler_invalid_component_modifier(attribute);
		}

		if (attribute.type === 'Attribute') {
			if (context.state.analysis.runes) {
				validate_attribute(attribute, node);

				if (is_expression_attribute(attribute)) {
					disallow_unparenthesized_sequences(
						get_attribute_expression(attribute),
						context.state.analysis.source
					);

Domain

Subdomains

Frequently Asked Questions

What does visit_component() do?
visit_component() is a function in the svelte codebase, defined in packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js.
Where is visit_component() defined?
visit_component() is defined in packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js at line 19.
What does visit_component() call?
visit_component() calls 11 function(s): component_invalid_directive, determine_slot, disallow_unparenthesized_sequences, event_handler_invalid_component_modifier, get_attribute_expression, is_expression_attribute, is_resolved_snippet, mark_subtree_dynamic, and 3 more.
What calls visit_component()?
visit_component() is called by 3 function(s): Component, SvelteComponent, SvelteSelf.

Analyze Your Own Codebase

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

Try Supermodel Free