diff --git a/packages/devui/package.json b/packages/devui/package.json index ad161345..e1322af3 100755 --- a/packages/devui/package.json +++ b/packages/devui/package.json @@ -47,7 +47,6 @@ "base16": "^1.0.0", "codemirror": "^5.56.0", "color": "^3.1.2", - "hoist-non-react-statics": "^3.3.2", "prop-types": "^15.7.2", "react-icons": "^3.10.0", "react-jsonschema-form": "^1.8.1", diff --git a/packages/devui/src/utils/createThemedComponent.tsx b/packages/devui/src/utils/createThemedComponent.tsx index 82205f62..2ec64b42 100644 --- a/packages/devui/src/utils/createThemedComponent.tsx +++ b/packages/devui/src/utils/createThemedComponent.tsx @@ -1,5 +1,4 @@ -import React, { ComponentType } from 'react'; -import hoistNonReactStatics from 'hoist-non-react-statics'; +import React from 'react'; import getDefaultTheme, { Theme } from '../themes/default'; import { withTheme } from 'styled-components'; import { Base16Theme } from 'base16'; @@ -9,33 +8,16 @@ export default >( ? C : never ) => { - const ThemedComponent = React.forwardRef>( - (props, ref) => { - // eslint-disable-next-line react/prop-types - if (props.theme && props.theme.type) { - const ThemedComponent = withTheme( - UnthemedComponent as ComponentType<{ theme?: Theme }> - ); - return ; - } - const UnthemedComponentAny = UnthemedComponent as any; - return ( - - ); - } - ); - - hoistNonReactStatics(ThemedComponent, UnthemedComponent); - - ThemedComponent.displayName = `ThemedComponent(${ - UnthemedComponent.displayName ?? 'Component' - })`; - - return ThemedComponent; + return withTheme((props) => { + return props.theme && props.theme.type ? ( + + ) : ( + + ); + }); }; // TODO: memoize it? diff --git a/packages/redux-devtools-test-generator/src/TestGenerator.tsx b/packages/redux-devtools-test-generator/src/TestGenerator.tsx index d8b240f4..24b4b84c 100644 --- a/packages/redux-devtools-test-generator/src/TestGenerator.tsx +++ b/packages/redux-devtools-test-generator/src/TestGenerator.tsx @@ -1,5 +1,4 @@ import React, { PureComponent, Component, ReactNode } from 'react'; -import PropTypes from 'prop-types'; import { stringify } from 'javascript-stringify'; import objectPath from 'object-path'; import jsan from 'jsan'; diff --git a/packages/redux-devtools-test-generator/src/index.tsx b/packages/redux-devtools-test-generator/src/index.tsx index 011946df..64cc5f50 100644 --- a/packages/redux-devtools-test-generator/src/index.tsx +++ b/packages/redux-devtools-test-generator/src/index.tsx @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { Component, CSSProperties } from 'react'; import PropTypes from 'prop-types'; import { Toolbar, @@ -130,14 +130,15 @@ export default class TestTab> extends Component< return ( - template.name} + getOptionLabel={(template: Template) => template.name} + value={templates.filter((template) => template.name == name)} + onChange={this.handleSelectTemplate} + /> +