Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Interactivity API: Migrate everything to TypeScript, add missing comments and remove the use of "we" #58718

Closed
Prev Previous commit
Next Next commit
Typing portals
  • Loading branch information
cbravobernal committed Feb 9, 2024
commit 91999597952387c2a9d341e76187fefe023b23e2
13 changes: 7 additions & 6 deletions packages/interactivity/src/hooks.tsx
Original file line number Diff line number Diff line change
@@ -90,21 +90,22 @@ export const getElement = () => {
} );
};

export const getScope = () => scopeStack.slice( -1 )[ 0 ];
export const getScope = (): Scope | undefined => scopeStack.slice( -1 )[ 0 ];

export const setScope = ( scope: Scope ) => {
export const setScope = ( scope: Scope ): void => {
scopeStack.push( scope );
};
export const resetScope = () => {
export const resetScope = (): void => {
scopeStack.pop();
};

export const getNamespace = () => namespaceStack.slice( -1 )[ 0 ];
export const getNamespace = (): string | undefined =>
namespaceStack.slice( -1 )[ 0 ];

export const setNamespace = ( namespace: string ) => {
export const setNamespace = ( namespace: string ): void => {
namespaceStack.push( namespace );
};
export const resetNamespace = () => {
export const resetNamespace = (): void => {
namespaceStack.pop();
};

Original file line number Diff line number Diff line change
@@ -1,25 +1,44 @@
/**
* External dependencies
*/
import type { ContainerNode, VNode } from 'preact';
import { createElement, render } from 'preact';
/**
* Internal dependencies
*/
import type {
ContextProviderProps,
PortalInterface,
PortalProps,
} from '../types';

/**
* @param {import('../../src/index').RenderableProps<{ context: any }>} props
* `ContextProvider` is a function component that provides context to its child components.
*
* @param props - The properties passed to the component.
* It includes a `context` property which is the context to be provided to the child components,
* and a `children` property which are the child components that will receive the context.
*
* @return The child components passed in through `props.children`.
*
* @example
* <ContextProvider context={myContext}>
* <MyChildComponent />
* </ContextProvider>
*/
function ContextProvider( props ) {
function ContextProvider( props: ContextProviderProps ): any {
this.getChildContext = () => props.context;
return props.children;
}

/**
* Portal component
*
* @this {import('./internal').Component}
* @param {object | null | undefined} props
* @param props - The properties passed to the component.
*
* TODO: use createRoot() instead of fake root
* TODO: use createRoot() instead of fake root
*/
function Portal( props ) {
function Portal( props: PortalProps | null | undefined ): any {
const _this = this;
const container = props._container;

@@ -91,14 +110,17 @@ function Portal( props ) {
/**
* Create a `Portal` to continue rendering the vnode tree at a different DOM node
*
* @param {import('./internal').VNode} vnode The vnode to render
* @param {import('./internal').PreactElement} container The DOM node to continue rendering in to.
* @param vnode The vnode to render
* @param container The DOM node to continue rendering in to.
*/
export function createPortal( vnode, container ) {
export function createPortal(
vnode: VNode,
container: ContainerNode
): PortalInterface {
const el = createElement( Portal, {
_vnode: vnode,
_container: container,
} );
} ) as PortalInterface;
el.containerInfo = container;
return el;
}
24 changes: 23 additions & 1 deletion packages/interactivity/types/index.d.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,15 @@
/**
* External dependencies
*/
import type { VNode, Context, RefObject, h as createElement } from 'preact';
import type {
VNode,
Context,
RefObject,
h as createElement,
ContainerNode,
ComponentChild,
ComponentChildren,
} from 'preact';

interface DirectiveEntry {
value: string | Object;
@@ -110,3 +118,17 @@ interface StoreOptions {
*/
lock?: boolean | string;
}

interface PortalInterface extends VNode {
containerInfo?: ContainerNode;
}

interface PortalProps {
_container: ContainerNode;
_vnode: VNode;
}

interface ContextProviderProps {
context: any;
children?: ComponentChildren;
}