Handle React.ReactChild correctly

packages/uxpin-merge-cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxpin/merge-cli",
-  "version": "3.3.0",
+  "version": "3.3.0-atlas",
   "description": "The Command-line tool integrates the Design System repository with: https://www.uxpin.com/merge",
   "repository": {
     "type": "git",
@@ -133,7 +133,7 @@
     "sortobject": "^1.1.1",
     "source-map-support": "^0.4.18",
     "tslib": "^1.9.0",
-    "typescript": "4.4.2",
+    "typescript": "4.8.4",
     "uuid": "^3.3.2",
     "webpack-merge": "^4.1.2",
     "webpack-virtual-modules": "^0.5.0"

packages/uxpin-merge-cli/src/steps/serialization/component/implementation/typescript/property/type/checker.ts

@@ -0,0 +1,57 @@
+import * as ts from 'typescript';
+
+import { KNOWN_TYPES_MAP } from './node/serializeKnownPropertyType';
+
+export function isAny(type: ts.Type): boolean {
+  return Boolean(type.flags & ts.TypeFlags.Any);
+}
+
+export function isBooleanLike(type: ts.Type): boolean {
+  return Boolean(type.flags & ts.TypeFlags.BooleanLike);
+}
+
+export function isCallable(type: ts.Type): boolean {
+  return isObjectLike(type) && !!type.getCallSignatures().length;
+}
+
+export function isEnum(type: ts.Type): type is ts.LiteralType {
+  if (type.symbol?.valueDeclaration) {
+    return ts.isEnumMember(type.symbol.valueDeclaration);
+  }
+
+  return false;
+}
+
+export function isKnownPropertyType(type: ts.Type): boolean {
+  const typeSymbol: ts.Symbol = type.symbol || type.aliasSymbol;
+
+  return (
+    (isAny(type) || isObjectLike(type) || isUnion(type)) &&
+    typeSymbol &&
+    typeSymbol.escapedName.toString() in KNOWN_TYPES_MAP
+  );
+}
+
+export function isIntersection(type: ts.Type): type is ts.IntersectionType {
+  return type.isIntersection();
+}
+
+export function isIntersectionOfObjects(type: ts.Type): boolean {
+  return isIntersection(type) && type.types.every(isObjectLike);
+}
+
+export function isLiteral(type: ts.Type): type is ts.LiteralType {
+  return type.isLiteral();
+}
+
+export function isObject(type: ts.Type): boolean {
+  return Boolean(type.flags & ts.TypeFlags.Object || type.flags & ts.TypeFlags.NonPrimitive);
+}
+
+export function isObjectLike(type: ts.Type): boolean {
+  return isObject(type) || isIntersectionOfObjects(type);
+}
+
+export function isUnion(type: ts.Type): type is ts.UnionType {
+  return type.isUnion();
+}

packages/uxpin-merge-cli/src/steps/serialization/component/implementation/typescript/property/type/node/convertTypeToPropertyType.ts

@@ -1,13 +1,16 @@
 import * as ts from 'typescript';
 import { PropertyType } from '../../../../ComponentPropertyDefinition';
 import { TSSerializationContext } from '../../../context/getSerializationContext';
-import { isBooleanLike } from '../checker/isBooleanLike';
-import { isCallable } from '../checker/isCallable';
-import { isEnum } from '../checker/isEnum';
-import { isKnownPropertyType } from '../checker/isKnownPropertyType';
-import { isLiteral } from '../checker/isLiteral';
-import { isObjectLike } from '../checker/isObjectLike';
-import { isUnion } from '../checker/isUnion';
+import {
+  isAny,
+  isBooleanLike,
+  isCallable,
+  isEnum,
+  isKnownPropertyType,
+  isLiteral,
+  isObjectLike,
+  isUnion,
+} from '../checker';
 import { serializeAsUnsupportedType } from './serializeAsUnsupportedType';
 import { serializeEnumType } from './serializeEnumType';
 import { serializeKnownPropertyType } from './serializeKnownPropertyType';
@@ -28,12 +31,12 @@ export function convertTypeToPropertyType(
   if (isBooleanLike(type)) {
     return { name: 'boolean', structure: {} };
   }
-  if (type.flags & ts.TypeFlags.Any) {
-    return { name: 'any', structure: {} };
-  }
   if (isKnownPropertyType(type)) {
     return serializeKnownPropertyType(type);
   }
+  if (isAny(type)) {
+    return { name: 'any', structure: {} };
+  }
   if (isCallable(type)) {
     return { name: 'func', structure: {} };
   }

packages/uxpin-merge-cli/src/steps/serialization/component/implementation/typescript/property/type/node/serializeKnownPropertyType.ts

@@ -6,6 +6,12 @@ export const KNOWN_TYPES_MAP: { [typeName: string]: PropertyType } = {
   Date: { name: 'date', structure: {} },
   ReactElement: { name: 'element', structure: {} },
   ReactNode: { name: 'node', structure: {} },
+  ReactChild: { name: 'node', structure: {} },
+  ReactNodeArray: { name: 'node', structure: {} },
+  // TODO Following types are very specific and should be handled in a different way
+  // Maybe defaulting unknown types to `string` instead of `any` would be better?
+  AnchorHTMLAttributes: { name: 'string', structure: {} },
+  ButtonHTMLAttributes: { name: 'string', structure: {} },
 };
 
 export function serializeKnownPropertyType(type: ts.Type): PropertyType {

packages/uxpin-merge-cli/yarn.lock

@@ -7290,10 +7290,10 @@ typedarray@^0.0.6:
   version "0.0.6"
   resolved "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
 
-typescript@4.4.2:
-  version "4.4.2"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.4.2.tgz#6d618640d430e3569a1dfb44f7d7e600ced3ee86"
-  integrity sha512-gzP+t5W4hdy4c+68bfcv0t400HVJMMd2+H9B7gae1nQlBzCqvrXX+6GL/b3GAgyTH966pzrZ70/fRjwAtZksSQ==
+typescript@4.8.4:
+  version "4.8.4"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.8.4.tgz#c464abca159669597be5f96b8943500b238e60e6"
+  integrity sha512-QCh+85mCy+h0IGff8r5XWzOVSbBO+KfeYrMQh7NJ58QujwcE22u+NUSmUxqF+un70P9GXKxa2HCNiTTMJknyjQ==
 
 typescript@>=5.0.2:
   version "5.0.4"