feat: export dedicated children aliases for DOM and React.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knighted/jsx",
-  "version": "1.13.0",
+  "version": "1.13.1",
   "description": "Runtime JSX tagged template that renders DOM or React trees anywhere with or without a build step.",
   "keywords": [
     "jsx runtime",

src/debug/index.ts

@@ -3,4 +3,4 @@ import { enableJsxDebugDiagnostics } from './diagnostics.js'
 enableJsxDebugDiagnostics({ mode: 'always' })
 
 export { jsx } from '../jsx.js'
-export type { JsxRenderable, JsxComponent } from '../jsx.js'
+export type { JsxRenderable, JsxChildren, JsxComponent } from '../jsx.js'

src/index.ts

@@ -1,2 +1,2 @@
 export { jsx } from './jsx.js'
-export type { JsxRenderable, JsxComponent } from './jsx.js'
+export type { JsxRenderable, JsxChildren, JsxComponent } from './jsx.js'

src/internal/jsx-types.ts

@@ -9,7 +9,9 @@ export type JsxRenderable =
   | undefined
   | Iterable<JsxRenderable>
 
+export type JsxChildren = JsxRenderable | JsxRenderable[]
+
 export type JsxComponent<Props = Record<string, unknown>> = {
-  (props: Props & { children?: JsxRenderable | JsxRenderable[] }): JsxRenderable
+  (props: Props & { children?: JsxChildren }): JsxRenderable
   displayName?: string
 }

src/jsx.ts

@@ -42,7 +42,7 @@ import type { JsxComponent, JsxRenderable } from './internal/jsx-types.js'
 
 type JsxContext = TemplateContext<JsxComponent>
 type ElementWithIndex = Element & Record<string, unknown>
-export type { JsxRenderable, JsxComponent } from './internal/jsx-types.js'
+export type { JsxRenderable, JsxChildren, JsxComponent } from './internal/jsx-types.js'
 
 const ensureDomAvailable = () => {
   if (typeof document === 'undefined' || typeof document.createElement !== 'function') {

src/node/debug/index.ts

@@ -6,4 +6,4 @@ enableJsxDebugDiagnostics({ mode: 'always' })
 ensureNodeDom()
 
 export const jsx = baseJsx
-export type { JsxRenderable, JsxComponent } from '../../jsx.js'
+export type { JsxRenderable, JsxChildren, JsxComponent } from '../../jsx.js'

src/node/index.ts

@@ -4,4 +4,4 @@ import { jsx as baseJsx } from '../jsx.js'
 ensureNodeDom()
 
 export const jsx = baseJsx
-export type { JsxRenderable, JsxComponent } from '../jsx.js'
+export type { JsxRenderable, JsxChildren, JsxComponent } from '../jsx.js'

src/react/index.ts

@@ -1,5 +1,6 @@
 export { reactJsx } from './react-jsx.js'
 export type {
+  ReactJsxChildren,
   ReactJsxComponent,
   ReactJsxDomAttributes,
   ReactJsxEventHandler,

src/react/react-jsx.ts

@@ -36,6 +36,7 @@ export type ReactJsxComponent<Props = Record<string, unknown>> = ComponentType<
 >
 
 export type ReactJsxRenderable = ReactNode
+export type ReactJsxChildren = ReactJsxRenderable | ReactJsxRenderable[]
 export type ReactJsxRef<T> = Ref<T>
 export type ReactJsxEventHandler<E extends SyntheticEvent> = EventHandler<E>
 export type ReactJsxDomAttributes<T = unknown> = DOMAttributes<T>

test/jsx.types.test-d.ts

@@ -0,0 +1,23 @@
+/*
+ * This file is a type-only test suite: declarations are intentionally "unused"
+ * so TypeScript will fail the build if the jsx typings drift. Linting is
+ * secondary here, so we disable unused-var checks.
+ */
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import type { JsxChildren, JsxComponent, JsxRenderable } from '../src/index.js'
+
+type Equal<A, B> =
+  (<T>() => T extends A ? 1 : 2) extends <T>() => T extends B ? 1 : 2 ? true : false
+
+type Expect<T extends true> = T
+
+type ChildrenAliasMatchesRenderableUnion = Expect<
+  Equal<JsxChildren, JsxRenderable | JsxRenderable[]>
+>
+
+type DemoProps = { label: string }
+type DemoComponent = JsxComponent<DemoProps>
+type DemoComponentProps = Parameters<DemoComponent>[0]
+type ComponentChildrenUsesAlias = Expect<
+  Equal<DemoComponentProps['children'], JsxChildren | undefined>
+>

test/react-jsx.types.test-d.ts

@@ -6,6 +6,7 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 import type * as React from 'react'
 import type {
+  ReactJsxChildren,
   ReactJsxComponent,
   ReactJsxDomAttributes,
   ReactJsxEventHandler,
@@ -52,3 +53,6 @@ type DemoPropsArePropsWithChildren = Expect<
 >
 
 type RenderableAllowsNull = Expect<null extends ReactJsxRenderable ? true : false>
+type ReactChildrenAliasMatchesRenderableUnion = Expect<
+  Equal<ReactJsxChildren, ReactJsxRenderable | ReactJsxRenderable[]>
+>