Fixes #108

Author: alex-kinokon

CHANGELOG.md

@@ -1,3 +1,9 @@
+# 8.1.5
+- Fixes #108: Class components are now differentiated from functional components by `.isComponent` instead of `.prototype.isReactComponent`, fixing an issue with terser.
+
+# 8.1.4
+- Fixes #104: Class Components do not populate their ref attribute.
+
 # 8.1.3
 - Merged #101.
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "jsx-dom",
-  "version": "8.1.4",
+  "version": "8.1.5",
   "description": "JSX to document.createElement.",
   "main": "index.js",
   "module": "index.js",
@@ -25,7 +25,7 @@
     "build"
   ],
   "resolutions": {
-    "@babel/types": "^7.21.0"
+    "@babel/types": "^7.25.4"
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",

pnpm-lock.yaml

@@ -118,19 +118,15 @@ export function Fragment(attr: { children: (JSX.Element | JSX.Element)[] }) {
 }
 
 export class Component {
+  static isComponent = true
+
   constructor(readonly props: any) {}
 
   render() {
     return null
   }
 }
 
-/* @__PURE__ */ Object.defineProperties(Component.prototype, {
-  isReactComponent: {
-    value: true,
-  },
-})
-
 function initComponentClass(Class: ComponentClass, attr, children) {
   attr = { ...attr, children }
   const instance = new Class(attr)
@@ -208,7 +204,7 @@ export function attachRef<T = Node>(ref: any | undefined, node: T) {
 }
 
 function appendChild(
-  child: any[] | string | number | ShadowRootContainer | null | Element,
+  child: any[] | string | number | ShadowRootContainer | null | Element | DocumentFragment,
   node: Node
 ) {
   if (isArrayLike(child)) {

src/jsx-dom.ts

@@ -30,9 +30,10 @@ export function isFunction(val: any): val is Function {
   return typeof val === "function"
 }
 
-export function isComponentClass(Component: Function): Component is ComponentClass {
-  const { prototype } = Component
-  return !!(prototype && prototype.isReactComponent)
+export function isComponentClass(
+  Component: Function & { isComponent?: boolean }
+): Component is ComponentClass {
+  return !!(Component && Component.isComponent)
 }
 
 export function isArrayLike(obj: any): obj is ArrayLike<any> {