vhad/DefinitelyTyped
1
0
Fork 0
mirror of https://github.com/gosticks/DefinitelyTyped.git synced 2026-10-07 08:17:05 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix DebugEngine and add test (#38556)

Browse Source 
```
'DebugEngine' only refers to a type, but is being used as a value here.ts(2693)
```

```ts
const debug = process.env.NODE_ENV === "production" ? undefined : new DebugEngine();
```
This commit is contained in:
Cho, Yongjoon
2019-09-25 13:28:46 -07:00
committed by Michael Crane
parent 81f974c1a9
commit 78d635d39a
2 changed files with 55 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files
types/styletron-react/index.d.ts
Vendored
+27 -67
View File
@@ -27,9 +27,7 @@ export interface NonAssignmentCommutativeReducerContainer {
reducer: Reducer;
}
export type ReducerContainer =
| AssignmentCommutativeReducerContainer
| NonAssignmentCommutativeReducerContainer;
export type ReducerContainer = AssignmentCommutativeReducerContainer | NonAssignmentCommutativeReducerContainer;
export type StackIndex = number;
@@ -71,52 +69,37 @@ export type StyletronComponent<P extends object> = React.FC<P & StyletronCompone
};
export interface StyledFn {
<
C extends keyof JSX.IntrinsicElements | React.ComponentType<any>,
P extends object
>(
<C extends keyof JSX.IntrinsicElements | React.ComponentType<any>, P extends object>(
component: C,
style: (props: P) => StyleObject
style: (props: P) => StyleObject,
): StyletronComponent<
Pick<
React.ComponentProps<C>,
Exclude<keyof React.ComponentProps<C>, { className: string }>
> &
P
Pick<React.ComponentProps<C>, Exclude<keyof React.ComponentProps<C>, { className: string }>> & P
>;
<C extends keyof JSX.IntrinsicElements | React.ComponentType<any>>(
component: C,
style: StyleObject
): StyletronComponent<
Pick<
React.ComponentProps<C>,
Exclude<keyof React.ComponentProps<C>, { className: string }>
>
>;
style: StyleObject,
): StyletronComponent<Pick<React.ComponentProps<C>, Exclude<keyof React.ComponentProps<C>, { className: string }>>>;
}
export interface WithStyleFn {
<C extends StyletronComponent<any>, P extends object>(
component: C,
style: (props: P) => StyleObject
style: (props: P) => StyleObject,
): StyletronComponent<React.ComponentProps<C> & P>;
<C extends StyletronComponent<any>>(
component: C,
style: StyleObject
): StyletronComponent<React.ComponentProps<C>>;
<C extends StyletronComponent<any>>(component: C, style: StyleObject): StyletronComponent<React.ComponentProps<C>>;
}
export interface WithTransformFn {
<C extends StyletronComponent<any>, P extends object>(
component: C,
style: (style: StyleObject, props: P) => StyleObject
style: (style: StyleObject, props: P) => StyleObject,
): StyletronComponent<React.ComponentProps<C> & P>;
}
export interface WithWrapperFn {
<C extends StyletronComponent<any>, P extends object>(
component: C,
wrapper: (component: C) => React.ComponentType<P>
wrapper: (component: C) => React.ComponentType<P>,
): StyletronComponent<React.ComponentProps<C> & P>;
}
@@ -131,6 +114,8 @@ export class NoopDebugEngine {
debug(): void;
}
export const DebugEngine: typeof BrowserDebugEngine | typeof NoopDebugEngine;
export type DebugEngine = BrowserDebugEngine | NoopDebugEngine;
export interface DevProviderProps {
@@ -141,19 +126,12 @@ export interface DevProviderProps {
debug?: DebugEngine;
}
export class DevProvider extends React.Component<
DevProviderProps,
{ hydrating: boolean }
> {}
export class DevProvider extends React.Component<DevProviderProps, { hydrating: boolean }> {}
export const Provider: typeof DevProvider | React.Provider<StandardEngine>;
export function DevConsumer(props: {
children: (
styletronEngine: StandardEngine,
debugEngine: DebugEngine,
hydrating: boolean
) => React.ReactNode;
children: (styletronEngine: StandardEngine, debugEngine: DebugEngine, hydrating: boolean) => React.ReactNode;
}): JSX.Element;
/**
@@ -174,9 +152,7 @@ export function createStyled(options: CreateStyledOptions): StyledFn;
export const styled: ReturnType<typeof createStyled>;
export function createStyledElementComponent(
styletron: Styletron
): StyletronComponent<any>;
export function createStyledElementComponent(styletron: Styletron): StyletronComponent<any>;
export const withTransform: WithTransformFn;
@@ -190,61 +166,45 @@ export const withStyle: typeof withStyleDeep;
export const withWrapper: WithWrapperFn;
export function composeStatic(
styletron: Styletron,
reducerContainer: ReducerContainer
): Styletron;
export function composeStatic(styletron: Styletron, reducerContainer: ReducerContainer): Styletron;
export function composeDynamic(
styletron: Styletron,
reducer: (style: StyleObject, props: object) => StyleObject
reducer: (style: StyleObject, props: object) => StyleObject,
): Styletron;
export function staticComposeShallow(
styletron: Styletron,
style: StyleObject
): ReturnType<typeof composeStatic>;
export function staticComposeShallow(styletron: Styletron, style: StyleObject): ReturnType<typeof composeStatic>;
export function staticComposeDeep(
styletron: Styletron,
style: StyleObject
): ReturnType<typeof composeStatic>;
export function staticComposeDeep(styletron: Styletron, style: StyleObject): ReturnType<typeof composeStatic>;
export function dynamicComposeShallow(
styletron: Styletron,
styleArg: (props: object) => StyleObject
styleArg: (props: object) => StyleObject,
): ReturnType<typeof composeDynamic>;
export function dynamicComposeDeep(
styletron: Styletron,
styleArg: (props: object) => StyleObject
styleArg: (props: object) => StyleObject,
): ReturnType<typeof composeDynamic>;
export function autoComposeShallow(
styletron: Styletron,
styleArg: StyleObject | ((props: object) => StyleObject)
styleArg: StyleObject | ((props: object) => StyleObject),
): ReturnType<typeof staticComposeShallow>;
export function autoComposeDeep(styletron: Styletron, styleArg: StyleObject): ReturnType<typeof staticComposeDeep>;
export function autoComposeDeep(
styletron: Styletron,
styleArg: StyleObject
): ReturnType<typeof staticComposeDeep>;
export function autoComposeDeep(
styletron: Styletron,
styleArg: (props: object) => StyleObject
styleArg: (props: object) => StyleObject,
): ReturnType<typeof dynamicComposeDeep>;
export function createShallowMergeReducer(
style: StyleObject
): AssignmentCommutativeReducerContainer;
export function createShallowMergeReducer(style: StyleObject): AssignmentCommutativeReducerContainer;
export function createDeepMergeReducer(
style: StyleObject
): AssignmentCommutativeReducerContainer;
export function createDeepMergeReducer(style: StyleObject): AssignmentCommutativeReducerContainer;
// Utility functions
export function resolveStyle(
getInitialStyle: () => StyleObject,
reducers: ReadonlyArray<ReducerContainer>,
props: object
props: object,
): StyleObject;
types/styletron-react/styletron-react-tests.tsx
+28 -30
View File
@@ -1,5 +1,6 @@
import * as React from 'react';
import {
DebugEngine,
styled,
StandardEngine,
withStyle,
@@ -8,6 +9,7 @@ import {
withWrapper,
Provider,
useStyletron,
DevProvider,
} from 'styletron-react';
// styled()
@@ -47,12 +49,9 @@ const StyledComplexButton = styled(ComplexButton, { color: 'blue' });
<StyledComplexButton isDisabled />;
const DynamicStyledComplexButton = styled(
ComplexButton,
(props: DynamicStyledProps) => {
return { color: props.$fraction < 0.5 ? 'red' : 'green' };
}
);
const DynamicStyledComplexButton = styled(ComplexButton, (props: DynamicStyledProps) => {
return { color: props.$fraction < 0.5 ? 'red' : 'green' };
});
<DynamicStyledComplexButton $fraction={Math.random()} isDisabled />;
@@ -79,12 +78,9 @@ interface WithStyledDynamicProps {
$crushed: boolean;
}
const WithStyledDynamic = withStyle(
BasicStyled,
(props: WithStyledDynamicProps) => ({
letterSpacing: props.$crushed ? '-5px' : '0',
})
);
const WithStyledDynamic = withStyle(BasicStyled, (props: WithStyledDynamicProps) => ({
letterSpacing: props.$crushed ? '-5px' : '0',
}));
<WithStyledDynamic $crushed />;
@@ -101,12 +97,9 @@ interface WithStyledDeepDynamicProps {
$crushed: boolean;
}
const WithStyledDeepDynamic = withStyleDeep(
BasicStyled,
(props: WithStyledDeepDynamicProps) => ({
letterSpacing: props.$crushed ? '-5px' : '0',
})
);
const WithStyledDeepDynamic = withStyleDeep(BasicStyled, (props: WithStyledDeepDynamicProps) => ({
letterSpacing: props.$crushed ? '-5px' : '0',
}));
<WithStyledDeepDynamic $crushed />;
@@ -117,18 +110,10 @@ interface WithTransformTestProps {
$inline: boolean;
}
const WithTransformTest = withTransform(
BasicStyled,
(style, props: WithTransformTestProps) => {
const display =
style.display === 'none'
? 'none'
: props.$inline
? 'inline-flex'
: 'flex';
return { ...styled, display };
}
);
const WithTransformTest = withTransform(BasicStyled, (style, props: WithTransformTestProps) => {
const display = style.display === 'none' ? 'none' : props.$inline ? 'inline-flex' : 'flex';
return { ...styled, display };
});
<WithTransformTest $inline />;
@@ -169,6 +154,19 @@ const App = () => (
<App />;
// <DevProvider />
// --------------------------
const debug = new DebugEngine();
const DevApp = () => (
<DevProvider value={engine} debug={debug}>
<PrettyButton />
</DevProvider>
);
<DevApp />;
// useStyletron()
// --------------------------