diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.js b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.js index 72ad964f79..561bea1796 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.js +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.js @@ -14,10 +14,20 @@ import { is_head } from '../shared/is_head.js'; import compiler_warnings from '../../../compiler_warnings.js'; import { namespaces } from '../../../../utils/namespaces.js'; import { extract_ignores_above_node } from '../../../../utils/extract_svelte_ignore.js'; + const regex_invalid_variable_identifier_characters = /[^a-zA-Z_$]/g; /** @extends Wrapper */ export default class InlineComponentWrapper extends Wrapper { + /** + * @typedef {{ + * block: import('../../Block.js').default; + * scope: import('../../../nodes/shared/TemplateScope.js').default; + * get_context?: import('estree').Node; + * get_changes?: import('estree').Node; + * }} SlotDefinition + */ + /** @type {import('estree').Identifier} */ var; @@ -133,10 +143,10 @@ export default class InlineComponentWrapper extends Wrapper { block.add_variable(name); const component_opts = /** @type {import('estree').ObjectExpression} */ (x`{}`); - /** @type {Array} */ + /** @type {Array} */ const statements = []; - /** @type {Array} */ + /** @type {Array} */ const updates = []; this.children.forEach((child) => { this.renderer.add_to_context('$$scope', true); @@ -235,7 +245,7 @@ export default class InlineComponentWrapper extends Wrapper { : null; const unchanged = dependencies.size === 0; - /** @type {Class>} */ + /** @type {import('estree').Node | ReturnType} */ let change_object; if (attr.is_spread) { const value = attr.expression.manipulate(block); @@ -650,12 +660,3 @@ export default class InlineComponentWrapper extends Wrapper { }); } } - -/** - * @typedef {{ - * block: Block; - * scope: TemplateScope; - * get_context?: Node; - * get_changes?: Node; - * }} SlotDefinition - */ diff --git a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts index c1ec1cfa35..e3133cf666 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts @@ -1,55 +1,55 @@ import { b, x } from 'code-red'; -import Block from '../../Block'; -import Action from '../../../nodes/Action'; -import { Expression, Node } from 'estree'; -import is_contextual from '../../../nodes/shared/is_contextual'; - -export default function add_actions(block: Block, target: string | Expression, actions: Action[]) { - actions.forEach((action) => add_action(block, target, action)); +import is_contextual from '../../../nodes/shared/is_contextual.js'; + +/** + * @param {import('../../Block.js').default} block + * @param {string | import('estree').Expression} target + * @param {import('../../../nodes/Action.js').default[]} actions + */ +export default function add_actions(block, target, actions) { + actions.forEach((action) => add_action(block, target, action)); } - const regex_invalid_variable_identifier_characters = /[^a-zA-Z0-9_$]/g; -export function add_action(block: Block, target: string | Expression, action: Action) { - const { expression, template_scope } = action; - let snippet: Node | undefined; - let dependencies: string[] | undefined; - - if (expression) { - snippet = expression.manipulate(block); - dependencies = expression.dynamic_dependencies(); - } - - const id = block.get_unique_name( - `${action.name.replace(regex_invalid_variable_identifier_characters, '_')}_action` - ); - - block.add_variable(id); - - const [obj, ...properties] = action.name.split('.'); - - const fn = is_contextual(action.component, template_scope, obj) - ? block.renderer.reference(obj) - : obj; +/** + * @param {import('../../Block.js').default} block + * @param {string | import('estree').Expression} target + * @param {import('../../../nodes/Action.js').default} action + */ +export function add_action(block, target, action) { + const { expression, template_scope } = action; + + /** @type {import('estree').Node | undefined} */ + let snippet; + + /** @type {string[] | undefined} */ + let dependencies; + if (expression) { + snippet = expression.manipulate(block); + dependencies = expression.dynamic_dependencies(); + } + const id = block.get_unique_name(`${action.name.replace(regex_invalid_variable_identifier_characters, '_')}_action`); + block.add_variable(id); + const [obj, ...properties] = action.name.split('.'); + const fn = is_contextual(action.component, template_scope, obj) + ? block.renderer.reference(obj) + : obj; + if (properties.length) { + const member_expression = properties.reduce((lhs, rhs) => x `${lhs}.${rhs}`, fn); + block.event_listeners.push(x `@action_destroyer(${id} = ${member_expression}(${target}, ${snippet}))`); + } + else { + block.event_listeners.push(x `@action_destroyer(${id} = ${fn}.call(null, ${target}, ${snippet}))`); + } + if (dependencies && dependencies.length > 0) { + let condition = x `${id} && @is_function(${id}.update)`; + if (dependencies.length > 0) { + condition = x `${condition} && ${block.renderer.dirty(dependencies)}`; + } + block.chunks.update.push(b `if (${condition}) ${id}.update.call(null, ${snippet});`); + } +} - if (properties.length) { - const member_expression = properties.reduce((lhs, rhs) => x`${lhs}.${rhs}`, fn); - block.event_listeners.push( - x`@action_destroyer(${id} = ${member_expression}(${target}, ${snippet}))` - ); - } else { - block.event_listeners.push( - x`@action_destroyer(${id} = ${fn}.call(null, ${target}, ${snippet}))` - ); - } - if (dependencies && dependencies.length > 0) { - let condition = x`${id} && @is_function(${id}.update)`; - if (dependencies.length > 0) { - condition = x`${condition} && ${block.renderer.dirty(dependencies)}`; - } - block.chunks.update.push(b`if (${condition}) ${id}.update.call(null, ${snippet});`); - } -}