feat: Define the MountOptions type (#13674)

* feat: Define the MountOptions type

* Revert "feat: Define the MountOptions type"

This reverts commit bd3596fcba.

* feat: Define the MountOptions type

* chore: Add changeset

* lint

* lint

---------

Co-authored-by: Dominic Gannaway <dg@domgan.com>
pull/13818/head
José Pablo Ramírez Vargas 11 months ago committed by GitHub
parent d16a9da153
commit 95980d1f08
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -0,0 +1,5 @@
---
'svelte': minor
---
feat: export mount() options as the MountOptions type

@ -309,4 +309,42 @@ export interface EventDispatcher<EventMap extends Record<string, any>> {
): boolean;
}
/**
* Defines the options accepted by the `mount()` function.
*/
export type MountOptions<Props extends Record<string, any> = Record<string, any>> = {
/**
* Target element where the component will be mounted.
*/
target: Document | Element | ShadowRoot;
/**
* Optional node inside `target` and when specified, it is used to render the component immediately before it.
*/
anchor?: Node;
/**
* Allows the specification of events.
*/
events?: Record<string, (e: any) => any>;
/**
* Used to define context at the component level.
*/
context?: Map<any, any>;
/**
* Used to control transition playback on initial render. The default value is `true` to run transitions.
*/
intro?: boolean;
} & ({} extends Props
? {
/**
* Component properties.
*/
props?: Props;
}
: {
/**
* Component properties.
*/
props: Props;
});
export * from './index-client.js';

@ -1,5 +1,5 @@
/** @import { ComponentContext, Effect, TemplateNode } from '#client' */
/** @import { Component, ComponentType, SvelteComponent } from '../../index.js' */
/** @import { Component, ComponentType, SvelteComponent, MountOptions } from '../../index.js' */
import { DEV } from 'esm-env';
import {
clear_text_content,
@ -65,21 +65,7 @@ export function set_text(text, value) {
* @template {Record<string, any>} Props
* @template {Record<string, any>} Exports
* @param {ComponentType<SvelteComponent<Props>> | Component<Props, Exports, any>} component
* @param {{} extends Props ? {
* target: Document | Element | ShadowRoot;
* anchor?: Node;
* props?: Props;
* events?: Record<string, (e: any) => any>;
* context?: Map<any, any>;
* intro?: boolean;
* }: {
* target: Document | Element | ShadowRoot;
* props: Props;
* anchor?: Node;
* events?: Record<string, (e: any) => any>;
* context?: Map<any, any>;
* intro?: boolean;
* }} options
* @param {MountOptions<Props>} options
* @returns {Exports}
*/
export function mount(component, options) {
@ -175,14 +161,7 @@ const document_listeners = new Map();
/**
* @template {Record<string, any>} Exports
* @param {ComponentType<SvelteComponent<any>> | Component<any>} Component
* @param {{
* target: Document | Element | ShadowRoot;
* anchor?: Node;
* props?: any;
* events?: any;
* context?: Map<any, any>;
* intro?: boolean;
* }} options
* @param {MountOptions} options
* @returns {Exports}
*/
function _mount(Component, { target, anchor, props = {}, events, context, intro = true }) {

@ -305,6 +305,44 @@ declare module 'svelte' {
: [type: Type, parameter: EventMap[Type], options?: DispatchOptions]
): boolean;
}
/**
* Defines the options accepted by the `mount()` function.
*/
export type MountOptions<Props extends Record<string, any> = Record<string, any>> = {
/**
* Target element where the component will be mounted.
*/
target: Document | Element | ShadowRoot;
/**
* Optional node inside `target` and when specified, it is used to render the component immediately before it.
*/
anchor?: Node;
/**
* Allows the specification of events.
*/
events?: Record<string, (e: any) => any>;
/**
* Used to define context at the component level.
*/
context?: Map<any, any>;
/**
* Used to control transition playback on initial render. The default value is `true` to run transitions.
*/
intro?: boolean;
} & ({} extends Props
? {
/**
* Component properties.
*/
props?: Props;
}
: {
/**
* Component properties.
*/
props: Props;
});
/**
* The `onMount` function schedules a callback to run as soon as the component has been mounted to the DOM.
* It must be called during the component's initialisation (but doesn't need to live *inside* the component;
@ -384,21 +422,7 @@ declare module 'svelte' {
* Transitions will play during the initial render unless the `intro` option is set to `false`.
*
* */
export function mount<Props extends Record<string, any>, Exports extends Record<string, any>>(component: ComponentType<SvelteComponent<Props>> | Component<Props, Exports, any>, options: {} extends Props ? {
target: Document | Element | ShadowRoot;
anchor?: Node;
props?: Props;
events?: Record<string, (e: any) => any>;
context?: Map<any, any>;
intro?: boolean;
} : {
target: Document | Element | ShadowRoot;
props: Props;
anchor?: Node;
events?: Record<string, (e: any) => any>;
context?: Map<any, any>;
intro?: boolean;
}): Exports;
export function mount<Props extends Record<string, any>, Exports extends Record<string, any>>(component: ComponentType<SvelteComponent<Props>> | Component<Props, Exports, any>, options: MountOptions<Props>): Exports;
/**
* Hydrates a component on the given target and returns the exports and potentially the props (if compiled with `accessors: true`) of the component
*

Loading…
Cancel
Save