typescript: Allow setting ref to null and ran prettier on source files

packages/inferno-compat/src/index.ts

@@ -294,7 +294,7 @@ abstract class PureComponent<P, S> extends Component<P, S> {
 }
 
 interface ContextProps {
-  children?: Inferno.InfernoChild | undefined
+  children?: Inferno.InfernoChild | undefined;
   context: any;
 }
 

packages/inferno-create-class/src/index.ts

@@ -1,4 +1,4 @@
-import {Component, Inferno} from 'inferno';
+import { Component, Inferno } from 'inferno';
 import { isFunction, throwError } from 'inferno-shared';
 
 export interface Mixin<P, S> extends Component<P, S> {

packages/inferno-extras/src/findDOMNode.ts

@@ -1,4 +1,4 @@
-import {Component, VNode, findDOMFromVNode} from 'inferno';
+import { Component, VNode, findDOMFromVNode } from 'inferno';
 
 export function findDOMNode(ref: VNode | Component | Node): Node | null {
   if (ref && (ref as Node).nodeType) {
@@ -14,7 +14,7 @@ export function findDOMNode(ref: VNode | Component | Node): Node | null {
   }
 
   if ((ref as VNode).flags) {
-    return findDOMFromVNode((ref as VNode), true);
+    return findDOMFromVNode(ref as VNode, true);
   }
 
   return null;

packages/inferno/__tests__/types.spec.tsx

@@ -1,5 +1,5 @@
-import {Component, createRef, Inferno, linkEvent, render} from 'inferno';
-import {emptyFn} from "inferno-shared";
+import { Component, createRef, Inferno, linkEvent, Ref, render } from 'inferno';
+import { emptyFn } from 'inferno-shared';
 
 describe('top level context', () => {
   let container;
@@ -167,9 +167,12 @@ describe('top level context', () => {
   describe('ChildFlags', function () {
     it('Should allow special flags on all elements', function () {
       const refObj = createRef<HTMLDivElement>();
-      const text = "foobar";
-      const row = <div className="floating-row-number" $HasTextChildren onClick={emptyFn}>{text}</div>;
-
+      const text = 'foobar';
+      const row = (
+        <div className="floating-row-number" $HasTextChildren onClick={emptyFn}>
+          {text}
+        </div>
+      );
 
       render(
         <div className="floating-row-numbers" ref={refObj} $HasVNodeChildren>
@@ -181,9 +184,12 @@ describe('top level context', () => {
 
     it('Should allow special flags on SVG', function () {
       const refObj = createRef<SVGSVGElement>();
-      const text = "foobar";
-      const row = <div className="floating-row-number" $HasTextChildren onClick={emptyFn}>{text}</div>;
-
+      const text = 'foobar';
+      const row = (
+        <div className="floating-row-number" $HasTextChildren onClick={emptyFn}>
+          {text}
+        </div>
+      );
 
       render(
         <svg className="floating-row-numbers" ref={refObj} $HasVNodeChildren>
@@ -200,5 +206,15 @@ describe('top level context', () => {
       expect(row).not.toBeNull();
       expect(aria).not.toBeNull();
     });
-  })
+
+    it('Should allow null for ref attribute', function () {
+      const obj: {
+        refWrap: Ref<HTMLDivElement> | null;
+      } = {
+        refWrap: null
+      };
+
+      render(<div ref={obj.refWrap}></div>, container);
+    });
+  });
 });

packages/inferno/src/core/component.ts

@@ -145,7 +145,7 @@ export abstract class Component<P = {}, S = {}> implements IComponent<P, S> {
   public $F: boolean = false; // Force update flag
 
   constructor(props?: P, context?: any) {
-    this.props = (props || (EMPTY_OBJ)) as Readonly<{ children?: Inferno.InfernoNode | undefined }> & Readonly<P>;
+    this.props = (props || EMPTY_OBJ) as Readonly<{ children?: Inferno.InfernoNode | undefined }> & Readonly<P>;
     this.context = context || EMPTY_OBJ; // context should not be mutable
   }
 

packages/inferno/src/core/types.ts

@@ -11,9 +11,11 @@ export interface LinkedEvent<T, E extends Event> {
 export interface IComponent<P, S> {
   // Public
   state: S | null;
-  props: Readonly<{
-    children?: Inferno.InfernoNode;
-  } & P>;
+  props: Readonly<
+    {
+      children?: Inferno.InfernoNode;
+    } & P
+  >;
   context?: any;
   displayName?: string;
   refs?: any;
@@ -171,7 +173,7 @@ export declare namespace Inferno {
     $ChildFlag?: number;
   }
   interface ClassAttributes<T> extends Attributes {
-    ref?: Ref<T> | RefObject<T> | undefined;
+    ref?: Ref<T> | RefObject<T> | null | undefined;
   }
 
   interface InfernoElement<P = any> {
@@ -1881,7 +1883,7 @@ declare global {
 
     type LibraryManagedAttributes<C, P> = InfernoManagedAttributes<C, P>;
 
-    interface IntrinsicAttributes extends Inferno.Attributes { }
+    interface IntrinsicAttributes extends Inferno.Attributes {}
     interface IntrinsicAttributes extends Inferno.Attributes, Refs<any> {}
     interface IntrinsicClassAttributes<T> extends Inferno.ClassAttributes<T> {}
 

scripts/rollup/plugins/index.js

@@ -3,7 +3,7 @@ import nodeResolve from 'rollup-plugin-node-resolve';
 import replacePlugin from 'rollup-plugin-replace';
 import { terser } from 'rollup-plugin-terser';
 import { aliasPlugin } from './alias.js';
-import babel from "@rollup/plugin-babel";
+import babel from '@rollup/plugin-babel';
 
 export function createPlugins(version, options) {
   const plugins = [
@@ -18,17 +18,17 @@ export function createPlugins(version, options) {
     })
   ];
 
-  plugins.push(babel({
-    exclude: 'node_modules/**',
-    sourceMaps: false,
-    babelrc: false,
-    presets: !options.esnext ? [['@babel/env', {loose: true, modules: false}]] : null,
-    babelHelpers: 'runtime',
-    skipPreflightCheck: true,
-    plugins: [
-      ["@babel/plugin-proposal-class-properties", {"loose": true}]
-    ]
-  }));
+  plugins.push(
+    babel({
+      exclude: 'node_modules/**',
+      sourceMaps: false,
+      babelrc: false,
+      presets: !options.esnext ? [['@babel/env', { loose: true, modules: false }]] : null,
+      babelHelpers: 'runtime',
+      skipPreflightCheck: true,
+      plugins: [['@babel/plugin-proposal-class-properties', { loose: true }]]
+    })
+  );
 
   const replaceValues = {
     'process.env.INFERNO_VERSION': JSON.stringify(options.version)