svelte-on-rails 0.0.1

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/RenderTag.js

@@ -0,0 +1,56 @@
+/** @import { Expression } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { unwrap_optional } from '../../../../utils/ast.js';
+import * as b from '../../../../utils/builders.js';
+
+/**
+ * @param {AST.RenderTag} node
+ * @param {ComponentContext} context
+ */
+export function RenderTag(node, context) {
+	context.state.template.push('<!>');
+
+	const expression = unwrap_optional(node.expression);
+
+	const callee = expression.callee;
+	const raw_args = expression.arguments;
+
+	/** @type {Expression[]} */
+	let args = [];
+	for (let i = 0; i < raw_args.length; i++) {
+		let thunk = b.thunk(/** @type {Expression} */ (context.visit(raw_args[i])));
+		const { has_call } = node.metadata.arguments[i];
+
+		if (has_call) {
+			const id = b.id(context.state.scope.generate('render_arg'));
+			context.state.init.push(b.var(id, b.call('$.derived_safe_equal', thunk)));
+			args.push(b.thunk(b.call('$.get', id)));
+		} else {
+			args.push(thunk);
+		}
+	}
+
+	let snippet_function = /** @type {Expression} */ (context.visit(callee));
+
+	if (node.metadata.dynamic) {
+		// If we have a chain expression then ensure a nullish snippet function gets turned into an empty one
+		if (node.expression.type === 'ChainExpression') {
+			snippet_function = b.logical('??', snippet_function, b.id('$.noop'));
+		}
+
+		context.state.init.push(
+			b.stmt(b.call('$.snippet', context.state.node, b.thunk(snippet_function), ...args))
+		);
+	} else {
+		context.state.init.push(
+			b.stmt(
+				(node.expression.type === 'CallExpression' ? b.call : b.maybe_call)(
+					snippet_function,
+					context.state.node,
+					...args
+				)
+			)
+		);
+	}
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SlotElement.js

@@ -0,0 +1,75 @@
+/** @import { BlockStatement, Expression, ExpressionStatement, Literal, Property } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import * as b from '../../../../utils/builders.js';
+import { build_attribute_value } from './shared/element.js';
+import { memoize_expression } from './shared/utils.js';
+
+/**
+ * @param {AST.SlotElement} node
+ * @param {ComponentContext} context
+ */
+export function SlotElement(node, context) {
+	// <slot {a}>fallback</slot>  -->   $.slot($$slots.default, { get a() { .. } }, () => ...fallback);
+	context.state.template.push('<!>');
+
+	/** @type {Property[]} */
+	const props = [];
+
+	/** @type {Expression[]} */
+	const spreads = [];
+
+	/** @type {ExpressionStatement[]} */
+	const lets = [];
+
+	let is_default = true;
+
+	let name = b.literal('default');
+
+	for (const attribute of node.attributes) {
+		if (attribute.type === 'SpreadAttribute') {
+			spreads.push(b.thunk(/** @type {Expression} */ (context.visit(attribute))));
+		} else if (attribute.type === 'Attribute') {
+			const { value, has_state } = build_attribute_value(
+				attribute.value,
+				context,
+				(value, metadata) => (metadata.has_call ? memoize_expression(context.state, value) : value)
+			);
+
+			if (attribute.name === 'name') {
+				name = /** @type {Literal} */ (value);
+				is_default = false;
+			} else if (attribute.name !== 'slot') {
+				if (has_state) {
+					props.push(b.get(attribute.name, [b.return(value)]));
+				} else {
+					props.push(b.init(attribute.name, value));
+				}
+			}
+		} else if (attribute.type === 'LetDirective') {
+			lets.push(/** @type {ExpressionStatement} */ (context.visit(attribute)));
+		}
+	}
+
+	// Let bindings first, they can be used on attributes
+	context.state.init.push(...lets);
+
+	const props_expression =
+		spreads.length === 0 ? b.object(props) : b.call('$.spread_props', b.object(props), ...spreads);
+
+	const fallback =
+		node.fragment.nodes.length === 0
+			? b.null
+			: b.arrow([b.id('$$anchor')], /** @type {BlockStatement} */ (context.visit(node.fragment)));
+
+	const slot = b.call(
+		'$.slot',
+		context.state.node,
+		b.id('$$props'),
+		name,
+		props_expression,
+		fallback
+	);
+
+	context.state.init.push(b.stmt(slot));
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SnippetBlock.js

@@ -0,0 +1,91 @@
+/** @import { AssignmentPattern, BlockStatement, Expression, Identifier, Statement } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { dev } from '../../../../state.js';
+import { extract_paths } from '../../../../utils/ast.js';
+import * as b from '../../../../utils/builders.js';
+import { get_value } from './shared/declarations.js';
+
+/**
+ * @param {AST.SnippetBlock} node
+ * @param {ComponentContext} context
+ */
+export function SnippetBlock(node, context) {
+	// TODO hoist where possible
+	/** @type {(Identifier | AssignmentPattern)[]} */
+	const args = [b.id('$$anchor')];
+
+	/** @type {BlockStatement} */
+	let body;
+
+	/** @type {Statement[]} */
+	const declarations = [];
+
+	if (dev) {
+		declarations.push(b.stmt(b.call('$.validate_snippet_args', b.spread(b.id('arguments')))));
+	}
+
+	const transform = { ...context.state.transform };
+	const child_state = { ...context.state, transform };
+
+	for (let i = 0; i < node.parameters.length; i++) {
+		const argument = node.parameters[i];
+
+		if (!argument) continue;
+
+		if (argument.type === 'Identifier') {
+			args.push(b.assignment_pattern(argument, b.id('$.noop')));
+			transform[argument.name] = { read: b.call };
+
+			continue;
+		}
+
+		let arg_alias = `$$arg${i}`;
+		args.push(b.id(arg_alias));
+
+		const paths = extract_paths(argument);
+
+		for (const path of paths) {
+			const name = /** @type {Identifier} */ (path.node).name;
+			const needs_derived = path.has_default_value; // to ensure that default value is only called once
+			const fn = b.thunk(
+				/** @type {Expression} */ (context.visit(path.expression?.(b.maybe_call(b.id(arg_alias)))))
+			);
+
+			declarations.push(b.let(path.node, needs_derived ? b.call('$.derived_safe_equal', fn) : fn));
+
+			transform[name] = {
+				read: needs_derived ? get_value : b.call
+			};
+
+			// we need to eagerly evaluate the expression in order to hit any
+			// 'Cannot access x before initialization' errors
+			if (dev) {
+				declarations.push(b.stmt(transform[name].read(b.id(name))));
+			}
+		}
+	}
+
+	body = b.block([
+		...declarations,
+		.../** @type {BlockStatement} */ (context.visit(node.body, child_state)).body
+	]);
+
+	// in dev we use a FunctionExpression (not arrow function) so we can use `arguments`
+	let snippet = dev
+		? b.call('$.wrap_snippet', b.id(context.state.analysis.name), b.function(null, args, body))
+		: b.arrow(args, body);
+
+	const declaration = b.const(node.expression, snippet);
+
+	// Top-level snippets are hoisted so they can be referenced in the `<script>`
+	if (context.path.length === 1 && context.path[0].type === 'Fragment') {
+		if (node.metadata.can_hoist) {
+			context.state.module_level_snippets.push(declaration);
+		} else {
+			context.state.instance_level_snippets.push(declaration);
+		}
+	} else {
+		context.state.init.push(declaration);
+	}
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SpreadAttribute.js

@@ -0,0 +1,10 @@
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+
+/**
+ * @param {AST.SpreadAttribute} node
+ * @param {ComponentContext} context
+ */
+export function SpreadAttribute(node, context) {
+	return context.visit(node.expression);
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SvelteBody.js

@@ -0,0 +1,11 @@
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { visit_special_element } from './shared/special_element.js';
+
+/**
+ * @param {AST.SvelteBody} node
+ * @param {ComponentContext} context
+ */
+export function SvelteBody(node, context) {
+	visit_special_element(node, '$.document.body', context);
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SvelteBoundary.js

@@ -0,0 +1,95 @@
+/** @import { BlockStatement, Statement, Expression } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { dev } from '../../../../state.js';
+import * as b from '../../../../utils/builders.js';
+
+/**
+ * @param {AST.SvelteBoundary} node
+ * @param {ComponentContext} context
+ */
+export function SvelteBoundary(node, context) {
+	const props = b.object([]);
+
+	for (const attribute of node.attributes) {
+		if (attribute.type !== 'Attribute' || attribute.value === true) {
+			// these can't exist, because they would have caused validation
+			// to fail, but typescript doesn't know that
+			continue;
+		}
+
+		const chunk = Array.isArray(attribute.value)
+			? /** @type {AST.ExpressionTag} */ (attribute.value[0])
+			: attribute.value;
+
+		const expression = /** @type {Expression} */ (context.visit(chunk.expression, context.state));
+
+		if (chunk.metadata.expression.has_state) {
+			props.properties.push(b.get(attribute.name, [b.return(expression)]));
+		} else {
+			props.properties.push(b.init(attribute.name, expression));
+		}
+	}
+
+	const nodes = [];
+
+	/** @type {Statement[]} */
+	const external_statements = [];
+
+	/** @type {Statement[]} */
+	const internal_statements = [];
+
+	const snippets_visits = [];
+
+	// Capture the `failed` implicit snippet prop
+	for (const child of node.fragment.nodes) {
+		if (child.type === 'SnippetBlock' && child.expression.name === 'failed') {
+			// we need to delay the visit of the snippets in case they access a ConstTag that is declared
+			// after the snippets so that the visitor for the const tag can be updated
+			snippets_visits.push(() => {
+				/** @type {Statement[]} */
+				const init = [];
+				context.visit(child, { ...context.state, init });
+				props.properties.push(b.prop('init', child.expression, child.expression));
+				external_statements.push(...init);
+			});
+		} else if (child.type === 'ConstTag') {
+			/** @type {Statement[]} */
+			const init = [];
+			context.visit(child, { ...context.state, init });
+
+			if (dev) {
+				// In dev we must separate the declarations from the code
+				// that eagerly evaluate the expression...
+				for (const statement of init) {
+					if (statement.type === 'VariableDeclaration') {
+						external_statements.push(statement);
+					} else {
+						internal_statements.push(statement);
+					}
+				}
+			} else {
+				external_statements.push(...init);
+			}
+		} else {
+			nodes.push(child);
+		}
+	}
+
+	snippets_visits.forEach((visit) => visit());
+
+	const block = /** @type {BlockStatement} */ (context.visit({ ...node.fragment, nodes }));
+
+	if (dev && internal_statements.length) {
+		block.body.unshift(...internal_statements);
+	}
+
+	const boundary = b.stmt(
+		b.call('$.boundary', context.state.node, props, b.arrow([b.id('$$anchor')], block))
+	);
+
+	context.state.template.push('<!>');
+	context.state.init.push(
+		external_statements.length > 0 ? b.block([...external_statements, boundary]) : boundary
+	);
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SvelteComponent.js

@@ -0,0 +1,12 @@
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { build_component } from './shared/component.js';
+
+/**
+ * @param {AST.SvelteComponent} node
+ * @param {ComponentContext} context
+ */
+export function SvelteComponent(node, context) {
+	const component = build_component(node, '$$component', context);
+	context.state.init.push(component);
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SvelteDocument.js

@@ -0,0 +1,11 @@
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { visit_special_element } from './shared/special_element.js';
+
+/**
+ * @param {AST.SvelteDocument} node
+ * @param {ComponentContext} context
+ */
+export function SvelteDocument(node, context) {
+	visit_special_element(node, '$.document', context);
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SvelteElement.js

@@ -0,0 +1,140 @@
+/** @import { BlockStatement, Expression, ExpressionStatement, Statement } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { dev, locator } from '../../../../state.js';
+import { is_text_attribute } from '../../../../utils/ast.js';
+import * as b from '../../../../utils/builders.js';
+import { determine_namespace_for_children } from '../../utils.js';
+import { build_attribute_value, build_set_attributes, build_set_class } from './shared/element.js';
+import { build_render_statement, get_expression_id } from './shared/utils.js';
+
+/**
+ * @param {AST.SvelteElement} node
+ * @param {ComponentContext} context
+ */
+export function SvelteElement(node, context) {
+	context.state.template.push(`<!>`);
+
+	/** @type {Array<AST.Attribute | AST.SpreadAttribute>} */
+	const attributes = [];
+
+	/** @type {AST.Attribute['value'] | undefined} */
+	let dynamic_namespace = undefined;
+
+	/** @type {AST.ClassDirective[]} */
+	const class_directives = [];
+
+	/** @type {AST.StyleDirective[]} */
+	const style_directives = [];
+
+	/** @type {ExpressionStatement[]} */
+	const lets = [];
+
+	// Create a temporary context which picks up the init/update statements.
+	// They'll then be added to the function parameter of $.element
+	const element_id = b.id(context.state.scope.generate('$$element'));
+
+	/** @type {ComponentContext} */
+	const inner_context = {
+		...context,
+		state: {
+			...context.state,
+			node: element_id,
+			init: [],
+			update: [],
+			expressions: [],
+			after_update: []
+		}
+	};
+
+	for (const attribute of node.attributes) {
+		if (attribute.type === 'Attribute') {
+			if (attribute.name === 'xmlns' && !is_text_attribute(attribute)) {
+				dynamic_namespace = attribute.value;
+			}
+			attributes.push(attribute);
+		} else if (attribute.type === 'SpreadAttribute') {
+			attributes.push(attribute);
+		} else if (attribute.type === 'ClassDirective') {
+			class_directives.push(attribute);
+		} else if (attribute.type === 'StyleDirective') {
+			style_directives.push(attribute);
+		} else if (attribute.type === 'LetDirective') {
+			lets.push(/** @type {ExpressionStatement} */ (context.visit(attribute)));
+		} else if (attribute.type === 'OnDirective') {
+			const handler = /** @type {Expression} */ (context.visit(attribute, inner_context.state));
+			inner_context.state.after_update.push(b.stmt(handler));
+		} else {
+			context.visit(attribute, inner_context.state);
+		}
+	}
+
+	// Let bindings first, they can be used on attributes
+	context.state.init.push(...lets); // create computeds in the outer context; the dynamic element is the single child of this slot
+
+	if (
+		attributes.length === 1 &&
+		attributes[0].type === 'Attribute' &&
+		attributes[0].name.toLowerCase() === 'class' &&
+		is_text_attribute(attributes[0])
+	) {
+		build_set_class(node, element_id, attributes[0], class_directives, inner_context, false);
+	} else if (attributes.length) {
+		const attributes_id = b.id(context.state.scope.generate('attributes'));
+
+		// Always use spread because we don't know whether the element is a custom element or not,
+		// therefore we need to do the "how to set an attribute" logic at runtime.
+		build_set_attributes(
+			attributes,
+			class_directives,
+			style_directives,
+			inner_context,
+			node,
+			element_id,
+			attributes_id
+		);
+	}
+
+	const get_tag = b.thunk(/** @type {Expression} */ (context.visit(node.tag)));
+
+	if (dev) {
+		if (node.fragment.nodes.length > 0) {
+			context.state.init.push(b.stmt(b.call('$.validate_void_dynamic_element', get_tag)));
+		}
+		context.state.init.push(b.stmt(b.call('$.validate_dynamic_element_tag', get_tag)));
+	}
+
+	/** @type {Statement[]} */
+	const inner = inner_context.state.init;
+	if (inner_context.state.update.length > 0) {
+		inner.push(build_render_statement(inner_context.state));
+	}
+	inner.push(...inner_context.state.after_update);
+	inner.push(
+		.../** @type {BlockStatement} */ (
+			context.visit(node.fragment, {
+				...context.state,
+				metadata: {
+					...context.state.metadata,
+					namespace: determine_namespace_for_children(node, context.state.metadata.namespace)
+				}
+			})
+		).body
+	);
+
+	const location = dev && locator(node.start);
+
+	context.state.init.push(
+		b.stmt(
+			b.call(
+				'$.element',
+				context.state.node,
+				get_tag,
+				node.metadata.svg || node.metadata.mathml ? b.true : b.false,
+				inner.length > 0 && b.arrow([element_id, b.id('$$anchor')], b.block(inner)),
+				dynamic_namespace && b.thunk(build_attribute_value(dynamic_namespace, context).value),
+				location && b.array([b.literal(location.line), b.literal(location.column)])
+			)
+		)
+	);
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SvelteFragment.js

@@ -0,0 +1,17 @@
+/** @import { BlockStatement, ExpressionStatement } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+
+/**
+ * @param {AST.SvelteFragment} node
+ * @param {ComponentContext} context
+ */
+export function SvelteFragment(node, context) {
+	for (const attribute of node.attributes) {
+		if (attribute.type === 'LetDirective') {
+			context.state.init.push(/** @type {ExpressionStatement} */ (context.visit(attribute)));
+		}
+	}
+
+	context.state.init.push(.../** @type {BlockStatement} */ (context.visit(node.fragment)).body);
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SvelteHead.js

@@ -0,0 +1,20 @@
+/** @import { BlockStatement } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import * as b from '../../../../utils/builders.js';
+
+/**
+ * @param {AST.SvelteHead} node
+ * @param {ComponentContext} context
+ */
+export function SvelteHead(node, context) {
+	// TODO attributes?
+	context.state.init.push(
+		b.stmt(
+			b.call(
+				'$.head',
+				b.arrow([b.id('$$anchor')], /** @type {BlockStatement} */ (context.visit(node.fragment)))
+			)
+		)
+	);
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SvelteSelf.js

@@ -0,0 +1,12 @@
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { build_component } from './shared/component.js';
+
+/**
+ * @param {AST.SvelteSelf} node
+ * @param {ComponentContext} context
+ */
+export function SvelteSelf(node, context) {
+	const component = build_component(node, context.state.analysis.name, context);
+	context.state.init.push(component);
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/SvelteWindow.js

@@ -0,0 +1,11 @@
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { visit_special_element } from './shared/special_element.js';
+
+/**
+ * @param {AST.SvelteWindow} node
+ * @param {ComponentContext} context
+ */
+export function SvelteWindow(node, context) {
+	visit_special_element(node, '$.window', context);
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/TitleElement.js

@@ -0,0 +1,24 @@
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import * as b from '../../../../utils/builders.js';
+import { build_template_chunk } from './shared/utils.js';
+
+/**
+ * @param {AST.TitleElement} node
+ * @param {ComponentContext} context
+ */
+export function TitleElement(node, context) {
+	const { has_state, value } = build_template_chunk(
+		/** @type {any} */ (node.fragment.nodes),
+		context.visit,
+		context.state
+	);
+
+	const statement = b.stmt(b.assignment('=', b.id('$.document.title'), value));
+
+	if (has_state) {
+		context.state.update.push(statement);
+	} else {
+		context.state.init.push(statement);
+	}
+}

data/lib/mount_svelte/node_modules/svelte/src/compiler/phases/3-transform/client/visitors/TransitionDirective.js

@@ -0,0 +1,29 @@
+/** @import { Expression } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { TRANSITION_GLOBAL, TRANSITION_IN, TRANSITION_OUT } from '../../../../../constants.js';
+import * as b from '../../../../utils/builders.js';
+import { parse_directive_name } from './shared/utils.js';
+
+/**
+ * @param {AST.TransitionDirective} node
+ * @param {ComponentContext} context
+ */
+export function TransitionDirective(node, context) {
+	let flags = node.modifiers.includes('global') ? TRANSITION_GLOBAL : 0;
+	if (node.intro) flags |= TRANSITION_IN;
+	if (node.outro) flags |= TRANSITION_OUT;
+
+	const args = [
+		b.literal(flags),
+		context.state.node,
+		b.thunk(/** @type {Expression} */ (context.visit(parse_directive_name(node.name))))
+	];
+
+	if (node.expression) {
+		args.push(b.thunk(/** @type {Expression} */ (context.visit(node.expression))));
+	}
+
+	// in after_update to ensure it always happens after bind:this
+	context.state.after_update.push(b.stmt(b.call('$.transition', ...args)));
+}