diff --git a/redux-ui/redux-ui-tests.ts b/redux-ui/redux-ui-tests.ts new file mode 100644 index 0000000000..5576a19b9d --- /dev/null +++ b/redux-ui/redux-ui-tests.ts @@ -0,0 +1,35 @@ +/// +/// + +import * as React from 'react' +import ui, { ReduxUIProps, reducer } from 'redux-ui' + +type UIShape = { + s: string; +}; + +@ui({ + key: 'Root', + persist: true, + state: { + s: '', + }, + mergeProps: () => ({}), + options: {} +}) +class Root extends React.Component, {}> { + componentWillMount() { + console.info( + this.props.ui.s, + this.props.uiKey + ); + this.props.updateUI('s', 'a'); + this.props.updateUI({s: 'a'}); + this.props.resetUI(); + } +} + +Redux.combineReducers({ + ui: reducer, +}); + diff --git a/redux-ui/redux-ui.d.ts b/redux-ui/redux-ui.d.ts new file mode 100644 index 0000000000..7ba61a3f8a --- /dev/null +++ b/redux-ui/redux-ui.d.ts @@ -0,0 +1,55 @@ +// Type definitions for redux-ui 0.0.15 +// Project: https://github.com/tonyhb/redux-ui +// Definitions by: Andy Shu Xin +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped + +/// + +declare module "redux-ui" { + + import * as Redux from 'redux'; + + export interface uiParams { + // optional key which is used to determine the UI path in which state will + // be stored. if omitted this is randomly generated. + key?: string; + + // optional persist, defaults to false. if set to true persist will keep UI + // state for this component after it unmounts. if set to false the UI state + // will be deleted and recreated when the component remounts + persist?: boolean; + + // **required**: UI state for the component + state: UIStateShape; + + // optional mergeProps passed to react-redux' @connect + mergeProps?: (stateProps: any, dispatchProps: any, ownProps: any) => any; + + // optional `options` passed to react-redux @connect + options?: { + pure?: boolean; + withRef?: boolean; + }; + } + + export interface ReduxUIProps { + // The key passed to the decorator from the decorator + // (eg. 'some-decorator' with `@ui('some-decorator')` + uiKey: string; + + // The UI state for the component's `uiKey` + ui: UIStateShape; + + // A function accepting either a name/value pair or object which updates + // state within `uiKey` + updateUI(obj: UIStateShape): void; + updateUI(key: string, value: any): void; + + // A function which resets the state within `uiKey` to its default + resetUI(): void; + } + + export const reducer: Redux.Reducer; + + export default function ui(params: uiParams): (component: T) => T; +}