Remove: flag allowSyntheticDefaultImports from ts config

README.md

@@ -33,7 +33,7 @@ document.body.appendChild(label.dom);
 If you'd like to include PCUI in your React project, you can import the individual components as follows:
 
 ```javascript
-import React from 'react';
+import * as React from 'react';
 import ReactDOM from 'react-dom';
 import { TextInput } from '@playcanvas/pcui/react';
 import '@playcanvas/pcui/styles';

docs/pages/2-react.markdown

@@ -8,7 +8,7 @@ nav_order: 3
 If you are more familiar with React, you can import React elements into your own `.jsx` files and use them as follows:
 
 ```jsx
-import React from 'react';
+import * as React from 'react';
 import ReactDOM from 'react-dom';
 import { TextInput } from '@playcanvas/pcui/react';
 import '@playcanvas/pcui/styles';

react/tsconfig.json

@@ -8,7 +8,6 @@
             "es2019",
             "dom"
         ],
-        "allowSyntheticDefaultImports" : true,
         "esModuleInterop" : true,
         "sourceMap": true,
         "moduleResolution": "node"

src/components/ArrayInput/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/BooleanInput/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/Button/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { ButtonArgs } from './index';
 import BaseComponent from '../Element/component';
 

src/components/Button/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Component from './component';
 import '../../scss/index.js';
 import { action } from '@storybook/addon-actions';

src/components/Canvas/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { CanvasArgs } from './index';
 import BaseComponent from '../Element/component';
 

src/components/Canvas/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import CanvasComponent from './component';
 

src/components/Code/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/ColorPicker/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { ColorPickerArgs } from './index';
 import BaseComponent from '../Element/component';
 

src/components/ColorPicker/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import ColorPickerComponent from './component';
 

src/components/Container/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { ContainerArgs } from './index';
 import BaseComponent from '../Element/component';
 

src/components/Container/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Container from './component';
 import Label from '../Label/component';

src/components/Divider/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/Element/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { ElementArgs } from './index';
 
 /**

src/components/Element/index.ts

@@ -1,5 +1,5 @@
 import { EventHandle, Events, Observer } from '@playcanvas/observer';
-import React from 'react';
+import * as React from 'react';
 import * as pcuiClass from '../../class';
 
 import { BindingBase } from '../../binding';

src/components/GradientPicker/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { GradientPickerArgs } from './index';
 import BaseComponent from '../Element/component';
 

src/components/GradientPicker/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import GradientPickerComponent from './component';
 

src/components/GridView/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import GridViewElement, { GridViewArgs } from './index';
 import GridViewItemElement from '../GridViewItem/index';
 import BaseComponent from '../Element/component';

src/components/GridView/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import GridView from './component';
 import GridViewItem from '../GridViewItem/component';

src/components/InfoBox/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { InfoBoxArgs } from './index';
 import BaseComponent from '../Element/component';
 

src/components/InfoBox/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/Label/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { LabelArgs } from './index';
 import BaseComponent from '../Element/component';
 

src/components/Label/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/LabelGroup/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/Menu/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { MenuArgs } from './index';
 import BaseComponent from '../Element/component';
 

src/components/Menu/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/NumericInput/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/Overlay/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Component from './component';
 import '../../scss/index.js';
 

src/components/Panel/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { PanelArgs } from './index';
 import BaseComponent from '../Element/component';
 

src/components/Panel/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/Progress/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/RadioButton/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/SelectInput/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/SliderInput/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/Spinner/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Element, { SpinnerArgs } from './index';
 import BaseComponent from '../Element/component';
 

src/components/Spinner/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import SpinnerComponent from './component';
 export default {

src/components/TextAreaInput/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/TextInput/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/components/TreeView/component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import TreeViewElement, { TreeViewArgs } from './index';
 import TreeViewItemElement from '../TreeViewItem/index';
 import BaseComponent from '../Element/component';

src/components/TreeView/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import TreeView from './component';
 import TreeViewItem from '../TreeViewItem/component';

src/components/VectorInput/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import Component from './component';
 import '../../scss/index.js';

src/examples/BidirectionalBinding/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import { Observer } from '@playcanvas/observer';
 import Container from '../../components/Container/component';

src/examples/Observer/index.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 
 import { Observer } from '@playcanvas/observer';
 import Container from '../../components/Container/component';

tsconfig.json

@@ -8,7 +8,6 @@
             "es2019",
             "dom"
         ],
-        "allowSyntheticDefaultImports" : true,
         "esModuleInterop" : true,
         "sourceMap": true,
         "moduleResolution": "node"