Skip to content

Post process flow default props #231

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 13 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 10 additions & 10 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -32,31 +32,31 @@
"author": "Felix Kling",
"license": "BSD-3-Clause",
"dependencies": {
"async": "^2.1.4",
"babel-runtime": "^6.9.2",
"async": "^2.6.0",
"babel-runtime": "^6.26.0",
"babylon": "7.0.0-beta.31",
"commander": "^2.9.0",
"commander": "^2.11.0",
"doctrine": "^2.0.0",
"node-dir": "^0.1.10",
"recast": "^0.12.6"
"node-dir": "^0.1.17",
"recast": "^0.12.9"
},
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-core": "^6.26.0",
"babel-eslint": "^8.0.1",
"babel-eslint": "^8.0.2",
"babel-jest": "^21.2.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.6.1",
"babel-preset-flow": "^6.23.0",
"cross-spawn": "^5.0.0",
"eslint": "^4.3.0",
"cross-spawn": "^5.1.0",
"eslint": "^4.11.0",
"flow-bin": "^0.59.0",
"jest": "^21.2.1",
"jest-diff": "^21.2.1",
"jest-matcher-utils": "^21.2.1",
"rimraf": "^2.3.2",
"temp": "^0.8.1"
"rimraf": "^2.6.2",
"temp": "^0.8.3"
},
"jest": {
"setupTestFrameworkScriptFile": "<rootDir>/tests/setupTestFramework.js",
Expand Down
200 changes: 200 additions & 0 deletions src/__tests__/__snapshots__/main-test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ Object {
"computed": false,
"value": "\\"primary\\"",
},
"required": false,
},
},
}
Expand Down Expand Up @@ -260,3 +261,202 @@ Object {
},
}
`;

exports[`main fixtures processes component "component_11.js" without errors 1`] = `
Object {
"description": "",
"displayName": "Paper",
"methods": Array [],
"props": Object {
"anchorOrigin": Object {
"defaultValue": Object {
"computed": false,
"value": "{
vertical: 'top',
horizontal: 'left'
}",
},
"description": "This is the point on the anchor where the popover's
\`anchorEl\` will attach to. This is not used when the
anchorReference is 'anchorPosition'.

Options:
vertical: [top, center, bottom];
horizontal: [left, center, right].",
"flowType": Object {
"name": "signature",
"raw": "{
horizontal: 'left' | 'center' | 'right' | number,
vertical: 'top' | 'center' | 'bottom' | number,
}",
"signature": Object {
"properties": Array [
Object {
"key": "horizontal",
"value": Object {
"elements": Array [
Object {
"name": "literal",
"value": "'left'",
},
Object {
"name": "literal",
"value": "'center'",
},
Object {
"name": "literal",
"value": "'right'",
},
Object {
"name": "number",
},
],
"name": "union",
"raw": "'left' | 'center' | 'right' | number",
"required": true,
},
},
Object {
"key": "vertical",
"value": Object {
"elements": Array [
Object {
"name": "literal",
"value": "'top'",
},
Object {
"name": "literal",
"value": "'center'",
},
Object {
"name": "literal",
"value": "'bottom'",
},
Object {
"name": "number",
},
],
"name": "union",
"raw": "'top' | 'center' | 'bottom' | number",
"required": true,
},
},
],
},
"type": "object",
},
"required": false,
},
"children": Object {
"description": "@ignore",
"flowType": Object {
"name": "Node",
},
"required": false,
},
"classes": Object {
"description": "Useful to extend the style applied to components.",
"flowType": Object {
"name": "Object",
},
"required": false,
},
"component": Object {
"defaultValue": Object {
"computed": false,
"value": "'div'",
},
"description": "The component used for the root node.
This currently has to be flow cast in defaultProps as of flow 0.59.0",
"flowType": Object {
"name": "ElementType",
},
"required": false,
},
"elevation": Object {
"defaultValue": Object {
"computed": false,
"value": "2",
},
"description": "Shadow depth, corresponds to \`dp\` in the spec.
It's accepting values between 0 and 24 inclusive.",
"flowType": Object {
"name": "number",
},
"required": false,
},
"labelRowsPerPage": Object {
"defaultValue": Object {
"computed": false,
"value": "'Rows per page:'",
},
"description": "Useful to customize the rows per page label. Invoked with a \`{ from, to, count, page }\`
object.",
"flowType": Object {
"name": "Node",
},
"required": false,
},
"timeout": Object {
"defaultValue": Object {
"computed": false,
"value": "duration.standard",
},
"description": "The duration for the transition, in milliseconds.
You may specify a single timeout for all transitions, or individually with an object.

Set to 'auto' to automatically calculate transition time based on height.",
"flowType": Object {
"elements": Array [
Object {
"name": "number",
},
Object {
"name": "signature",
"raw": "{ enter?: number, exit?: number }",
"signature": Object {
"properties": Array [
Object {
"key": "enter",
"value": Object {
"name": "number",
"required": false,
},
},
Object {
"key": "exit",
"value": Object {
"name": "number",
"required": false,
},
},
],
},
"type": "object",
},
Object {
"name": "literal",
"value": "'auto'",
},
],
"name": "union",
"raw": "number | { enter?: number, exit?: number } | 'auto'",
},
"required": false,
},
"transition": Object {
"description": "Transition component.",
"flowType": Object {
"elements": Array [
Object {
"name": "unknown",
},
],
"name": "ComponentType",
"raw": "ComponentType<*>",
},
"required": true,
},
},
}
`;
101 changes: 101 additions & 0 deletions src/__tests__/fixtures/component_11.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,101 @@
// @flow

/**
* Test for documentation of flow class
*/

import React from 'react';
import type { ComponentType, ElementType, Node } from 'react';

type ProvidedProps = {
classes: Object,
};

export type Origin = {
horizontal: 'left' | 'center' | 'right' | number,
vertical: 'top' | 'center' | 'bottom' | number,
};

export const duration = {
standard: 300,
};

export type TransitionDuration = number | { enter?: number, exit?: number } | 'auto';

export type Props = {
/**
* Other base element props.
*/
[otherProp: string]: any,
/**
* This is the point on the anchor where the popover's
* `anchorEl` will attach to. This is not used when the
* anchorReference is 'anchorPosition'.
*
* Options:
* vertical: [top, center, bottom];
* horizontal: [left, center, right].
*/
anchorOrigin?: Origin,
/**
* Useful to extend the style applied to components.
*/
classes?: Object,
/**
* @ignore
*/
children?: Node,
/**
* The component used for the root node.
* This currently has to be flow cast in defaultProps as of flow 0.59.0
*/
component: ElementType,
/**
* Shadow depth, corresponds to `dp` in the spec.
* It's accepting values between 0 and 24 inclusive.
*/
elevation: number,
/**
* Useful to customize the rows per page label. Invoked with a `{ from, to, count, page }`
* object.
*/
labelRowsPerPage: Node,
/**
* Transition component.
*/
transition: ComponentType<*>,
/**
* The duration for the transition, in milliseconds.
* You may specify a single timeout for all transitions, or individually with an object.
*
* Set to 'auto' to automatically calculate transition time based on height.
*/
timeout: TransitionDuration,
};

class Paper extends React.Component<ProvidedProps & Props> {
static defaultProps = {
anchorOrigin: ({
vertical: 'top',
horizontal: 'left',
}: Origin),
labelRowsPerPage: ('Rows per page:': Node),
component: ('div': ElementType),
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Out of curiosity: What is this doing?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Casting to ElementType to avoid other flow errors and avoid typing all default props. Just one alternative. BTW We have since removed flow from our codebase.

Copy link
Collaborator

@danez danez Jan 5, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see, thanks for explaining.

Yeah in my company we also dropped flow, because it was too hard to keep up and we had to add lots of workarounds and rewrite code just to make flow happy

component: 'div',
elevation: 2,
timeout: (duration.standard: TransitionDuration),
};

render() {
const {
classes,
component: ComponentProp,
transition,
...other
} = this.props;

return <ComponentProp className={classes.root} transition={transition} {...other} />;
}
}

export default Paper;
3 changes: 2 additions & 1 deletion src/parse.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,15 @@ import Documentation from './Documentation';

import babylon from './babylon';
import recast from 'recast';
import postProcessDocumentation from './utils/postProcessDocumentation';

var ERROR_MISSING_DEFINITION = 'No suitable component definition found.';

function executeHandlers(handlers, componentDefinitions) {
return componentDefinitions.map(componentDefinition => {
var documentation = new Documentation();
handlers.forEach(handler => handler(documentation, componentDefinition));
return documentation.toObject();
return postProcessDocumentation(documentation.toObject());
});
}

Expand Down
Loading