diff --git a/radium/radium-tests.tsx b/radium/radium-tests.tsx index d7ec26ef83..c8379b39b2 100644 --- a/radium/radium-tests.tsx +++ b/radium/radium-tests.tsx @@ -2,16 +2,52 @@ /// import * as React from "react"; +import { StyleRoot, Style } from "radium"; import * as Radium from 'radium'; @Radium -export default class TestComponent extends React.Component { +class TestComponent extends React.Component<{ a: number }, any> { - render() { - return ( -
- Test with Radium -
- ); - } + render() { + return ( +
+ Test with Radium +
+ ); + } } + +let TestStatelessComponent = (props: { a: number }) =>
; +TestStatelessComponent = Radium(TestStatelessComponent); + + + + +@Radium({ + userAgent: "test", + matchMedia: window.matchMedia +}) +class TestComponentWithConfig extends React.Component<{ a?: number }, {}> { + render() { + return ( +
+ + + +
+ ) + } +} + + +Radium.TestMode.enable(); diff --git a/radium/radium.d.ts b/radium/radium.d.ts index 438d07aee4..1989156877 100644 --- a/radium/radium.d.ts +++ b/radium/radium.d.ts @@ -1,20 +1,118 @@ // Type definitions for radium 0.17.1 // Project: https://github.com/formidablelabs/radium -// Definitions by: Alex Gorbatchev , Philipp Holzer +// Definitions by: Alex Gorbatchev , Philipp Holzer , Alexey Svetliakov // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped /// declare module 'radium' { - import React = require('react'); + import * as React from 'react'; + + + namespace Radium { + interface StyleRules { + [index: string]: React.CSSProperties; + } + + /** + * Style component properties + */ + export interface StyleProps { + /** + * An object of CSS rules to render. Each key of the rules object is a CSS selector and the value is an object + * of styles. If rules is empty, the component will render nothing. + */ + rules: StyleRules; + /** + * A string that any included selectors in rules will be appended to. + * Use to scope styles in the component to a particular element. A good use case might be to generate a unique + * ID for a component to scope any styles to the particular component that owns the