Skip to content
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

[react-jss] Add flow typings #818

Merged
merged 27 commits into from Aug 15, 2018
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
27 commits
Select commit Hold shift + click to select a range
b4b0523
First commit
gomesalexandre Aug 7, 2018
e008910
Fixes on createHOC and injectSheet
gomesalexandre Aug 8, 2018
bd5348a
More fixes on createHOC and injectSheet
gomesalexandre Aug 8, 2018
887652f
Better flow typings on createHOC
gomesalexandre Aug 10, 2018
3954fc5
Moved types/index.js just to types.js and added InnerProps and OuterP…
Aug 11, 2018
a7cca18
Simplified typings of injectSheet.js
Aug 11, 2018
b379272
Updated and fixed some typings in createHOC.js
Aug 11, 2018
b1fb062
Removed unnecessary types in ns.js
Aug 12, 2018
1d69fce
Added flow flag to some untyped files
Aug 12, 2018
0c07422
Exporting StyleSheetFactoryOptions now instead of StyleSheetOptions
Aug 12, 2018
386f2e5
Fix typing of getDisplayName
Aug 12, 2018
839e1ae
Added Context Type and updated Options to use StyleSheetFactoryOption…
Aug 12, 2018
fccbbf0
Moved types/index.js just to types.js and added
Aug 12, 2018
5f1c1e8
Improved Context Type
Aug 12, 2018
d867aa2
Updated createHoc to use Context type
Aug 12, 2018
539c3ed
Improved typing of the Theming option
Aug 12, 2018
bacb6bd
Formatted code with prettier
Aug 12, 2018
2b86b8d
Updated size snapshot and lockfile
Aug 12, 2018
ecdf147
Make options in injectSheet optional an default it to an empty object
Aug 12, 2018
4c16374
Fixed types of the JssProvider props
Aug 12, 2018
3ad6097
Remove semi eslint rule
Aug 12, 2018
1a803f9
Removed unnecessary types
Aug 14, 2018
44d7dd5
Remove unnecessary check
Aug 14, 2018
9da04d3
Updated a if statement and fixed removing dynamic sheet from global r…
Aug 14, 2018
3d7d984
Fixed naming of some type names to always start with an uppercase char
Aug 15, 2018
fcd4345
Renamed generic types of createHOC
Aug 15, 2018
629d9f5
Merge branch 'master' into react-jss-flow-typings
Aug 15, 2018
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
14,421 changes: 5,592 additions & 8,829 deletions package-lock.json

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions packages/jss/src/Jss.js
Expand Up @@ -18,7 +18,7 @@ import type {
JssOptions,
InternalJssOptions,
JssStyle,
generateClassName
GenerateClassName
} from './types'

let instanceCounter = 0
Expand All @@ -36,7 +36,7 @@ export default class Jss {
plugins: []
}

generateClassName: generateClassName = createGenerateClassNameDefault()
generateClassName: GenerateClassName = createGenerateClassNameDefault()

constructor(options?: JssOptions) {
// eslint-disable-next-line prefer-spread
Expand Down
4 changes: 2 additions & 2 deletions packages/jss/src/index.js
Expand Up @@ -20,12 +20,12 @@ import type {JssOptions} from './types'
* Export types for better typing inside plugins and integrations.
*/
export type {
StyleSheetOptions,
StyleSheetFactoryOptions,
JssValue,
JssOptions,
JssStyle,
Plugin,
generateClassName,
GenerateClassName,
RuleListOptions,
Rule,
Renderer,
Expand Down
20 changes: 10 additions & 10 deletions packages/jss/src/types/jss.js
Expand Up @@ -25,7 +25,7 @@ export type Rule =
| SimpleRule
| ViewportRule

export type generateClassName = (rule: Rule, sheet?: StyleSheet) => string
export type GenerateClassName = (rule: Rule, sheet?: StyleSheet) => string

// TODO
// Find a way to declare all types: Object|string|Array<Object>
Expand Down Expand Up @@ -61,7 +61,7 @@ export type RuleFactoryOptions = {
sheet?: StyleSheet,
index?: number,
jss?: Jss,
generateClassName?: generateClassName,
generateClassName?: GenerateClassName,
Renderer?: Class<Renderer>
}

Expand All @@ -85,13 +85,13 @@ export type RuleOptions = {
parent?: ContainerRule | StyleSheet,
classes: Classes,
jss: Jss,
generateClassName: generateClassName,
generateClassName: GenerateClassName,
Renderer: Class<Renderer>
}

export type RuleListOptions = {
classes: Classes,
generateClassName: generateClassName,
generateClassName: GenerateClassName,
Renderer: Class<Renderer>,
jss: Jss,
sheet: StyleSheet,
Expand All @@ -109,18 +109,18 @@ export type Plugin = {

export type InsertionPoint = string | HTMLElement

type createGenerateClassName = () => generateClassName
type CreateGenerateClassName = () => GenerateClassName

export type JssOptions = {
createGenerateClassName?: createGenerateClassName,
createGenerateClassName?: CreateGenerateClassName,
plugins?: Array<Plugin>,
insertionPoint?: InsertionPoint,
Renderer?: Class<Renderer>,
virtual?: Boolean
}

export type InternalJssOptions = {
createGenerateClassName: createGenerateClassName,
createGenerateClassName: CreateGenerateClassName,
plugins: Array<Plugin>,
insertionPoint?: InsertionPoint,
Renderer: Class<Renderer>
Expand All @@ -132,7 +132,7 @@ export type StyleSheetFactoryOptions = {
index?: number,
link?: boolean,
element?: HTMLStyleElement,
generateClassName?: generateClassName,
generateClassName?: GenerateClassName,
classNamePrefix?: string
}

Expand All @@ -142,7 +142,7 @@ export type StyleSheetOptions = {
link?: boolean,
element?: HTMLStyleElement,
index: number,
generateClassName: generateClassName,
generateClassName: GenerateClassName,
classNamePrefix?: string,
Renderer: Class<Renderer>,
insertionPoint?: InsertionPoint,
Expand All @@ -157,7 +157,7 @@ export type InternalStyleSheetOptions = {
index: number,
insertionPoint?: InsertionPoint,
Renderer: Class<Renderer>,
generateClassName: generateClassName,
generateClassName: GenerateClassName,
classNamePrefix?: string,
jss: Jss,
sheet: StyleSheet,
Expand Down
4 changes: 2 additions & 2 deletions packages/jss/src/utils/createGenerateClassName.js
@@ -1,6 +1,6 @@
/* @flow */
import warning from 'warning'
import type {Rule, generateClassName} from '../types'
import type {Rule, GenerateClassName} from '../types'
import StyleSheet from '../StyleSheet'
import moduleId from './moduleId'

Expand All @@ -13,7 +13,7 @@ const env = process.env.NODE_ENV
* When new generator function is created, rule counter is reseted.
* We need to reset the rule counter for SSR for each request.
*/
export default (): generateClassName => {
export default (): GenerateClassName => {
let ruleCounter = 0
const defaultPrefix = env === 'production' ? 'c' : ''

Expand Down
28 changes: 14 additions & 14 deletions packages/react-jss/.size-snapshot.json
@@ -1,30 +1,30 @@
{
"dist/react-jss.js": {
"bundled": 237212,
"minified": 65434,
"gzipped": 17994
"bundled": 237652,
"minified": 65587,
"gzipped": 18039
},
"dist/react-jss.min.js": {
"bundled": 201910,
"minified": 56081,
"gzipped": 15810
"bundled": 202343,
"minified": 56230,
"gzipped": 15853
},
"dist/react-jss.cjs.js": {
"bundled": 17646,
"minified": 7319,
"gzipped": 2579
"bundled": 18359,
"minified": 7518,
"gzipped": 2649
},
"dist/react-jss.esm.js": {
"bundled": 17160,
"minified": 6889,
"gzipped": 2485,
"bundled": 17873,
"minified": 7088,
"gzipped": 2552,
"treeshaked": {
"rollup": {
"code": 1908,
"code": 2057,
"import_statements": 214
},
"webpack": {
"code": 3079
"code": 3228
}
}
}
Expand Down
16 changes: 8 additions & 8 deletions packages/react-jss/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

26 changes: 22 additions & 4 deletions packages/react-jss/src/JssProvider.js
@@ -1,11 +1,23 @@
import {Component, Children} from 'react'
// @flow
import {Component, Children, type Element, type ElementType} from 'react'
import PropTypes from 'prop-types'
import type {Jss, GenerateClassName, SheetsRegistry} from 'jss'
import {createGenerateClassNameDefault} from './jss'
import * as ns from './ns'
import contextTypes from './contextTypes'
import propTypes from './propTypes'
import type {Context} from './types'

export default class JssProvider extends Component {
type Props = {
jss?: Jss,
registry?: SheetsRegistry,
generateClassName?: GenerateClassName,
classNamePrefix?: string,
disableStylesGeneration?: boolean,
children: Element<ElementType>
}

export default class JssProvider extends Component<Props> {
static propTypes = {
...propTypes,
generateClassName: PropTypes.func,
Expand All @@ -22,7 +34,7 @@ export default class JssProvider extends Component {
// 1. Check if there is a value passed over props.
// 2. If value was passed, we set it on the child context.
// 3. If value was not passed, we proxy parent context (default context behaviour).
getChildContext() {
getChildContext(): Context {
const {
registry,
classNamePrefix,
Expand All @@ -31,7 +43,7 @@ export default class JssProvider extends Component {
disableStylesGeneration
} = this.props
const sheetOptions = this.context[ns.sheetOptions] || {}
const context = {[ns.sheetOptions]: sheetOptions}
const context: Context = {[ns.sheetOptions]: sheetOptions}

if (registry) {
context[ns.sheetsRegistry] = registry
Expand Down Expand Up @@ -73,6 +85,12 @@ export default class JssProvider extends Component {
return context
}

registry: SheetsRegistry

managers: {}

generateClassName: GenerateClassName

render() {
return Children.only(this.props.children)
}
Expand Down
4 changes: 3 additions & 1 deletion packages/react-jss/src/compose.js
@@ -1,3 +1,5 @@
// @flow
import type {Classes} from 'jss'
/**
* Adds `composes` property to each top level rule
* in order to have a composed class name for dynamic style sheets.
Expand All @@ -21,7 +23,7 @@
* @param {Object} styles dynamic styles object without static properties
* @return {Object|null}
*/
export default (staticClasses, dynamicClasses) => {
export default (staticClasses: Classes, dynamicClasses: Classes) => {
const combinedClasses = {...staticClasses}

for (const name in dynamicClasses) {
Expand Down
1 change: 1 addition & 0 deletions packages/react-jss/src/contextTypes.js
@@ -1,3 +1,4 @@
// @flow
import PropTypes from 'prop-types'
import * as ns from './ns'
import propTypes from './propTypes'
Expand Down