@server/next 0.44.1 → 0.45.1

package/src/jsx/jsx-runtime.d.ts

@@ -1,12 +1,31 @@
-export declare function jsx(type: any, props: any, key?: any): any;
-export declare function jsxs(type: any, props: any, key?: any): any;
-export declare function jsxDEV(type: any, props: any, key?: any): any;
-export declare const Fragment: unique symbol;
+// What a JSX tag can be: an intrinsic name, a Fragment, a function component,
+// or an object exposing `render` (the shape forwardRef-style components take)
+type Tag =
+  | string
+  | symbol
+  | ((props: any) => unknown)
+  | { render: (props: any, ref: unknown) => unknown };
+
+export declare function jsx(
+  type: Tag,
+  props?: any,
+  key?: string | number,
+): JSX.Element;
+export declare function jsxs(
+  type: Tag,
+  props?: any,
+  key?: string | number,
+): JSX.Element;
+export declare function jsxDEV(
+  type: Tag,
+  props?: any,
+  key?: string | number,
+): JSX.Element;
+export declare const Fragment: symbol;
 
 export declare namespace JSX {
   interface Element {
-    type: any;
-    props: any;
+    (): string;
   }
   interface IntrinsicElements {
     [elem: string]: any;
@@ -16,8 +35,7 @@ export declare namespace JSX {
 declare global {
   namespace JSX {
     interface Element {
-      type: any;
-      props: any;
+      (): string;
     }
     interface IntrinsicElements {
       [elem: string]: any;

package/src/jsx/jsx-runtime.js

@@ -21,8 +21,6 @@ const SVG_TAGS = new Set([
   "defs",
 ]);
 
-const REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
-
 const ALT_NAMES = {
   classname: "class",
   htmlfor: "for",
@@ -100,8 +98,9 @@ const renderChild = (child) => {
 };
 
 const jsx = (tag, { children, ...props } = {}) => {
-  // Fragment (Symbol-safe)
-  if (tag === REACT_FRAGMENT_TYPE || tag === Fragment) {
+  // Fragment. It is the registered React symbol, so a compiled React library
+  // matches whether it imports Fragment or inlines Symbol.for("react.fragment")
+  if (tag === Fragment) {
     return () => renderChild(children);
   }
 
@@ -158,7 +157,9 @@ const jsx = (tag, { children, ...props } = {}) => {
     // `minify` drives <style>, it isn't an HTML attribute
     .filter(([k]) => !(tag === "style" && k === "minify"))
     .filter(([k, v]) => !/on[A-Z]/.test(k) && typeof v !== "function")
-    .filter(([, v]) => v !== false)
+    // `false`, `null` and `undefined` drop the attribute (as React does),
+    // rather than rendering it empty
+    .filter(([, v]) => v !== false && v != null)
     .map(([k, v]) => {
       const preserveSvg = k === "viewBox" || k === "preserveAspectRatio";
 
@@ -180,6 +181,7 @@ const jsx = (tag, { children, ...props } = {}) => {
             return `${cssKey}:${val}`;
           })
           .join(";");
+        if (!v) return null; // an empty style object adds nothing
       }
 
       const value =
@@ -187,6 +189,7 @@ const jsx = (tag, { children, ...props } = {}) => {
 
       return `${key}="${value}"`;
     })
+    .filter((attr) => attr !== null)
     .join(" ");
 
   if (attrStr) attrStr = ` ${attrStr}`;