Skip to content
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/afraid-turtles-invent.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte': minor
---

feat: export mount() options as the MountOptions type
36 changes: 36 additions & 0 deletions packages/svelte/src/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -309,4 +309,40 @@ 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';
27 changes: 3 additions & 24 deletions packages/svelte/src/internal/client/render.js
Original file line number Diff line number Diff line change
@@ -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,
Expand Down Expand Up @@ -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) {
Expand Down Expand Up @@ -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 }) {
Expand Down
52 changes: 37 additions & 15 deletions packages/svelte/types/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -305,6 +305,42 @@ 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;
Expand Down Expand Up @@ -384,21 +420,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
*
Expand Down
Loading