Skip to content
This repository was archived by the owner on Dec 13, 2018. It is now read-only.

Commit ce401a8

Browse files
quicksnapKent C. Dodds
authored and
Kent C. Dodds
committed
fix(TypeScript): add CSSFunctions to CSSProperties typings (#392)
* Add CSSFunctions to CSSProperties typings * TypeScript tests for nested css function prop
1 parent 8a21d8b commit ce401a8

File tree

2 files changed

+22
-2
lines changed

2 files changed

+22
-2
lines changed

test/glamorous.test.tsx

+13-1
Original file line numberDiff line numberDiff line change
@@ -617,7 +617,7 @@ const BuiltinStyledWithFragment: JSX.Element = (
617617
const cssProps = {
618618
":active": {
619619
color: "purple"
620-
}
620+
},
621621
};
622622

623623
const BuiltinStyledWithCSSPseudoProps = (
@@ -626,3 +626,15 @@ const BuiltinStyledWithCSSPseudoProps = (
626626
<glamorous.A css={cssProps} />
627627
</div>
628628
);
629+
630+
const nestedCssProps = [
631+
{ color: 'red', },
632+
() => ({ fontSize: 123 }),
633+
() => () => () => [{ border: '1px solid black'}],
634+
];
635+
636+
const NestedStyleFunctions = (
637+
<div>
638+
<glamorous.Div css={nestedCssProps} />
639+
</div>
640+
)

typings/css-properties.d.ts

+9-1
Original file line numberDiff line numberDiff line change
@@ -1933,6 +1933,14 @@ export interface CSSProperties
19331933
CSSPropertiesPseudo,
19341934
CSSPropertiesLossy {}
19351935

1936-
export type CSSPropertiesRecursive = CSSProperties | CSSPropertiesArray
1936+
export type CSSPropertiesRecursive =
1937+
| CSSProperties
1938+
| CSSPropertiesArray
1939+
| CSSFunction
1940+
1941+
// TODO: This could be made generic. Issue PR if you're so inclined!
1942+
export interface CSSFunction {
1943+
(props: {}): CSSPropertiesRecursive
1944+
}
19371945

19381946
export interface CSSPropertiesArray extends Array<CSSPropertiesRecursive> {}

0 commit comments

Comments
 (0)