mirror of https://github.com/sveltejs/svelte
chore: move legacy code (#10775)
* move event modifier code * move more legacy code * oops --------- Co-authored-by: Rich Harris <rich.harris@vercel.com>pull/10778/head
parent
e36a8d06ea
commit
ea97fe22da
@ -0,0 +1,83 @@
|
|||||||
|
/**
|
||||||
|
* @param {(event: Event, ...args: Array<unknown>) => void} fn
|
||||||
|
* @returns {(event: Event, ...args: unknown[]) => void}
|
||||||
|
*/
|
||||||
|
export function trusted(fn) {
|
||||||
|
return function (...args) {
|
||||||
|
var event = /** @type {Event} */ (args[0]);
|
||||||
|
if (event.isTrusted) {
|
||||||
|
// @ts-ignore
|
||||||
|
fn.apply(this, args);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {(event: Event, ...args: Array<unknown>) => void} fn
|
||||||
|
* @returns {(event: Event, ...args: unknown[]) => void}
|
||||||
|
*/
|
||||||
|
export function self(fn) {
|
||||||
|
return function (...args) {
|
||||||
|
var event = /** @type {Event} */ (args[0]);
|
||||||
|
// @ts-ignore
|
||||||
|
if (event.target === this) {
|
||||||
|
// @ts-ignore
|
||||||
|
fn.apply(this, args);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {(event: Event, ...args: Array<unknown>) => void} fn
|
||||||
|
* @returns {(event: Event, ...args: unknown[]) => void}
|
||||||
|
*/
|
||||||
|
export function stopPropagation(fn) {
|
||||||
|
return function (...args) {
|
||||||
|
var event = /** @type {Event} */ (args[0]);
|
||||||
|
event.stopPropagation();
|
||||||
|
// @ts-ignore
|
||||||
|
return fn.apply(this, args);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {(event: Event, ...args: Array<unknown>) => void} fn
|
||||||
|
* @returns {(event: Event, ...args: unknown[]) => void}
|
||||||
|
*/
|
||||||
|
export function once(fn) {
|
||||||
|
var ran = false;
|
||||||
|
|
||||||
|
return function (...args) {
|
||||||
|
if (ran) return;
|
||||||
|
ran = true;
|
||||||
|
|
||||||
|
// @ts-ignore
|
||||||
|
return fn.apply(this, args);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {(event: Event, ...args: Array<unknown>) => void} fn
|
||||||
|
* @returns {(event: Event, ...args: unknown[]) => void}
|
||||||
|
*/
|
||||||
|
export function stopImmediatePropagation(fn) {
|
||||||
|
return function (...args) {
|
||||||
|
var event = /** @type {Event} */ (args[0]);
|
||||||
|
event.stopImmediatePropagation();
|
||||||
|
// @ts-ignore
|
||||||
|
return fn.apply(this, args);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {(event: Event, ...args: Array<unknown>) => void} fn
|
||||||
|
* @returns {(event: Event, ...args: unknown[]) => void}
|
||||||
|
*/
|
||||||
|
export function preventDefault(fn) {
|
||||||
|
return function (...args) {
|
||||||
|
var event = /** @type {Event} */ (args[0]);
|
||||||
|
event.preventDefault();
|
||||||
|
// @ts-ignore
|
||||||
|
return fn.apply(this, args);
|
||||||
|
};
|
||||||
|
}
|
@ -0,0 +1,54 @@
|
|||||||
|
import { run } from '../../../common.js';
|
||||||
|
import { pre_effect, user_effect } from '../../reactivity/effects.js';
|
||||||
|
import { current_component_context, deep_read_state, get, untrack } from '../../runtime.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Legacy-mode only: Call `onMount` callbacks and set up `beforeUpdate`/`afterUpdate` effects
|
||||||
|
*/
|
||||||
|
export function init() {
|
||||||
|
const context = /** @type {import('#client').ComponentContext} */ (current_component_context);
|
||||||
|
const callbacks = context.u;
|
||||||
|
|
||||||
|
if (!callbacks) return;
|
||||||
|
|
||||||
|
// beforeUpdate
|
||||||
|
if (callbacks.b.length) {
|
||||||
|
pre_effect(() => {
|
||||||
|
observe_all(context);
|
||||||
|
callbacks.b.forEach(run);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// onMount (must run before afterUpdate)
|
||||||
|
user_effect(() => {
|
||||||
|
const fns = untrack(() => callbacks.m.map(run));
|
||||||
|
return () => {
|
||||||
|
for (const fn of fns) {
|
||||||
|
if (typeof fn === 'function') {
|
||||||
|
fn();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
// afterUpdate
|
||||||
|
if (callbacks.a.length) {
|
||||||
|
user_effect(() => {
|
||||||
|
observe_all(context);
|
||||||
|
callbacks.a.forEach(run);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Invoke the getter of all signals associated with a component
|
||||||
|
* so they can be registered to the effect this function is called in.
|
||||||
|
* @param {import('#client').ComponentContext} context
|
||||||
|
*/
|
||||||
|
function observe_all(context) {
|
||||||
|
if (context.d) {
|
||||||
|
for (const signal of context.d) get(signal);
|
||||||
|
}
|
||||||
|
|
||||||
|
deep_read_state(context.s);
|
||||||
|
}
|
@ -0,0 +1,68 @@
|
|||||||
|
import { set, source } from '../../reactivity/sources.js';
|
||||||
|
import { get } from '../../runtime.js';
|
||||||
|
import { is_array } from '../../utils.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Under some circumstances, imports may be reactive in legacy mode. In that case,
|
||||||
|
* they should be using `reactive_import` as part of the transformation
|
||||||
|
* @param {() => any} fn
|
||||||
|
*/
|
||||||
|
export function reactive_import(fn) {
|
||||||
|
var s = source(0);
|
||||||
|
|
||||||
|
return function () {
|
||||||
|
if (arguments.length === 1) {
|
||||||
|
set(s, get(s) + 1);
|
||||||
|
return arguments[0];
|
||||||
|
} else {
|
||||||
|
get(s);
|
||||||
|
return fn();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @this {any}
|
||||||
|
* @param {Record<string, unknown>} $$props
|
||||||
|
* @param {Event} event
|
||||||
|
* @returns {void}
|
||||||
|
*/
|
||||||
|
export function bubble_event($$props, event) {
|
||||||
|
var events = /** @type {Record<string, Function[] | Function>} */ ($$props.$$events)?.[
|
||||||
|
event.type
|
||||||
|
];
|
||||||
|
|
||||||
|
var callbacks = is_array(events) ? events.slice() : events == null ? [] : [events];
|
||||||
|
|
||||||
|
for (var fn of callbacks) {
|
||||||
|
// Preserve "this" context
|
||||||
|
fn.call(this, event);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Used to simulate `$on` on a component instance when `legacy.componentApi` is `true`
|
||||||
|
* @param {Record<string, any>} $$props
|
||||||
|
* @param {string} event_name
|
||||||
|
* @param {Function} event_callback
|
||||||
|
*/
|
||||||
|
export function add_legacy_event_listener($$props, event_name, event_callback) {
|
||||||
|
$$props.$$events ||= {};
|
||||||
|
$$props.$$events[event_name] ||= [];
|
||||||
|
$$props.$$events[event_name].push(event_callback);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Used to simulate `$set` on a component instance when `legacy.componentApi` is `true`.
|
||||||
|
* Needs component accessors so that it can call the setter of the prop. Therefore doesn't
|
||||||
|
* work for updating props in `$$props` or `$$restProps`.
|
||||||
|
* @this {Record<string, any>}
|
||||||
|
* @param {Record<string, any>} $$new_props
|
||||||
|
*/
|
||||||
|
export function update_legacy_props($$new_props) {
|
||||||
|
for (var key in $$new_props) {
|
||||||
|
if (key in this) {
|
||||||
|
this[key] = $$new_props[key];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in new issue