diff --git a/packages/core/src/declarations/stencil-public-runtime.ts b/packages/core/src/declarations/stencil-public-runtime.ts index 0e398459fe9..1ac83590a07 100644 --- a/packages/core/src/declarations/stencil-public-runtime.ts +++ b/packages/core/src/declarations/stencil-public-runtime.ts @@ -847,7 +847,7 @@ export interface FunctionalUtilities { } export interface FunctionalComponent { - (props: T, children: VNode[], utils: FunctionalUtilities): VNode | VNode[] | null; + (props: T, children: VNode[], utils: FunctionalUtilities): VNode | null; } /** @@ -873,12 +873,12 @@ export interface ChildNode { * * For further information: https://stenciljs.com/docs/host-element */ -export declare const Host: FunctionalComponent; +export declare const Host: (props: HostAttributes) => VNode; /** * Fragment */ -export declare const Fragment: FunctionalComponent<{}>; +export declare const Fragment: (props: {}) => VNode; /* eslint-disable jsdoc/require-param, jsdoc/require-returns -- we don't want to JSDoc these overloads at this time */ /** @@ -905,6 +905,7 @@ export declare namespace h { ): VNode; export namespace JSX { + type Element = VNode; interface IntrinsicElements extends LocalJSX.IntrinsicElements, JSXBase.IntrinsicElements { [tagName: string]: any; } diff --git a/packages/core/src/runtime/_test_/jsx.spec.tsx b/packages/core/src/runtime/_test_/jsx.spec.tsx index 5dc95f60fbd..60291aa9395 100644 --- a/packages/core/src/runtime/_test_/jsx.spec.tsx +++ b/packages/core/src/runtime/_test_/jsx.spec.tsx @@ -1,5 +1,4 @@ import { Component, Fragment, h, Host, Prop, State } from '@stencil/core'; -import { FunctionalComponent } from '@stencil/core'; import { newSpecPage } from '@stencil/core/testing'; import { expect, describe, it } from '@stencil/vitest'; @@ -65,10 +64,7 @@ describe('jsx', () => { first?: string; last?: string; } - const FunctionalCmp: FunctionalComponent = ({ - first = 'Kim', - last = 'Doe', - }) => ( + const FunctionalCmp = ({ first = 'Kim', last = 'Doe' }: FunctionalCmpProps) => (
Hi, my name is {first} {last}.
@@ -77,7 +73,11 @@ describe('jsx', () => { @Component({ tag: 'cmp-a' }) class CmpA { render() { - return ; + return ( + <> + + + ); } } diff --git a/packages/core/src/runtime/_test_/render-vdom.spec.tsx b/packages/core/src/runtime/_test_/render-vdom.spec.tsx index b514834cef2..d0d5fbe3c39 100644 --- a/packages/core/src/runtime/_test_/render-vdom.spec.tsx +++ b/packages/core/src/runtime/_test_/render-vdom.spec.tsx @@ -262,7 +262,7 @@ describe('render-vdom', () => { class CmpA { render() { const H = () => { - return; + return null; }; return ; } @@ -288,7 +288,7 @@ describe('render-vdom', () => { render() { const Tunnel = { Provider: () => { - return; + return null; }, }; return ; diff --git a/packages/core/src/runtime/vdom/_test_/h.spec.ts b/packages/core/src/runtime/vdom/_test_/h.spec.ts index 672d8e4ef04..23fbac553f8 100644 --- a/packages/core/src/runtime/vdom/_test_/h.spec.ts +++ b/packages/core/src/runtime/vdom/_test_/h.spec.ts @@ -416,7 +416,7 @@ describe('h()', () => { }); it('replaceAttributes should return the attributes for the node', () => { - const FunctionalCmp: d.FunctionalComponent = (_nodeData, children, util) => { + const FunctionalCmp = (_nodeData: any, children: d.VNode[], util: d.FunctionalUtilities) => { return util.map(children, (child) => { return { ...child, @@ -461,7 +461,7 @@ describe('h()', () => { const ReplacementCmp: d.FunctionalComponent = (nodeData, children) => { return h('article', nodeData, h('p', null, ...children)); }; - const FunctionalCmp: d.FunctionalComponent = (_nodeData, children, util) => { + const FunctionalCmp = (_nodeData, children, util) => { return util.map(children, (child) => { return { ...child,