reduxjs/redux-devtools
1
1
Fork 0
mirror of https://github.com/reduxjs/redux-devtools.git synced 2025-07-24 15:09:49 +03:00
Code Issues Packages Projects Releases Wiki Activity

Stash

Browse Source
This commit is contained in:
Nathan Bierema 2020-09-19 16:43:11 -04:00
parent d49535da03
commit 725a94de1c
4 changed files with 21 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/devui/package.json
View File

@ -47,7 +47,6 @@
"base16": "^1.0.0", "base16": "^1.0.0",
"codemirror": "^5.56.0", "codemirror": "^5.56.0",
"color": "^3.1.2", "color": "^3.1.2",
"hoist-non-react-statics": "^3.3.2",
"prop-types": "^15.7.2", "prop-types": "^15.7.2",
"react-icons": "^3.10.0", "react-icons": "^3.10.0",
"react-jsonschema-form": "^1.8.1", "react-jsonschema-form": "^1.8.1",

40
packages/devui/src/utils/createThemedComponent.tsx
View File

@ -1,5 +1,4 @@
import React, { ComponentType } from 'react'; import React from 'react';
import hoistNonReactStatics from 'hoist-non-react-statics';
import getDefaultTheme, { Theme } from '../themes/default'; import getDefaultTheme, { Theme } from '../themes/default';
import { withTheme } from 'styled-components'; import { withTheme } from 'styled-components';
import { Base16Theme } from 'base16'; import { Base16Theme } from 'base16';
@ -9,33 +8,16 @@ export default <C extends React.ComponentType<any>>(
? C ? C
: never : never
) => { ) => {
const ThemedComponent = React.forwardRef<C, React.ComponentProps<C>>( return withTheme((props) => {
(props, ref) => { return props.theme && props.theme.type ? (
// eslint-disable-next-line react/prop-types <UnthemedComponent {...props} />
if (props.theme && props.theme.type) { ) : (
const ThemedComponent = withTheme( <UnthemedComponent
UnthemedComponent as ComponentType<{ theme?: Theme }> {...props}
); theme={getDefaultTheme({} as Base16Theme)}
return <ThemedComponent {...props} ref={ref} />; />
} );
const UnthemedComponentAny = UnthemedComponent as any; });
return (
<UnthemedComponentAny
{...props}
ref={ref}
theme={getDefaultTheme({} as Base16Theme)}
/>
);
}
);
hoistNonReactStatics(ThemedComponent, UnthemedComponent);
ThemedComponent.displayName = `ThemedComponent(${
UnthemedComponent.displayName ?? 'Component'
})`;
return ThemedComponent;
}; };
// TODO: memoize it? // TODO: memoize it?

1
packages/redux-devtools-test-generator/src/TestGenerator.tsx
View File

@ -1,5 +1,4 @@
import React, { PureComponent, Component, ReactNode } from 'react'; import React, { PureComponent, Component, ReactNode } from 'react';
import PropTypes from 'prop-types';
import { stringify } from 'javascript-stringify'; import { stringify } from 'javascript-stringify';
import objectPath from 'object-path'; import objectPath from 'object-path';
import jsan from 'jsan'; import jsan from 'jsan';

19
packages/redux-devtools-test-generator/src/index.tsx
View File

@ -1,4 +1,4 @@
import React, { Component } from 'react'; import React, { Component, CSSProperties } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { import {
Toolbar, Toolbar,
@ -130,14 +130,15 @@ export default class TestTab<S, A extends Action<unknown>> extends Component<
return ( return (
<Container> <Container>
<Toolbar> <Toolbar>
<Select <div style={{ flexGrow: 1, zIndex: 100 }}>
options={templates} <Select
valueKey="name" options={templates}
labelKey="name" getValueLabel={(template: Template) => template.name}
value={name} getOptionLabel={(template: Template) => template.name}
simpleValue={false} value={templates.filter((template) => template.name == name)}
onChange={this.handleSelectTemplate} onChange={this.handleSelectTemplate}
/> />
</div>
<Button onClick={this.editTemplate}> <Button onClick={this.editTemplate}>
<MdEdit /> <MdEdit />
</Button> </Button>