From ead55442e04c60b9dc08c314d333b3c9a826046b Mon Sep 17 00:00:00 2001 From: Tom Moor Date: Sat, 8 Aug 2020 23:41:02 -0700 Subject: [PATCH] flow: Restore lesser flowtype for styled-components The current flow-typed def requires an insane amount of manual typing that just doesnt make any sense. Restoring the old definition for now: https://github.com/flow-typed/flow-typed/issues/3766 --- flow-typed/npm/styled-components_v5.x.x.js | 525 --------------------- flow-typed/npm/styled-components_vx.x.x.js | 143 ++++++ 2 files changed, 143 insertions(+), 525 deletions(-) delete mode 100644 flow-typed/npm/styled-components_v5.x.x.js create mode 100644 flow-typed/npm/styled-components_vx.x.x.js diff --git a/flow-typed/npm/styled-components_v5.x.x.js b/flow-typed/npm/styled-components_v5.x.x.js deleted file mode 100644 index e568703fb..000000000 --- a/flow-typed/npm/styled-components_v5.x.x.js +++ /dev/null @@ -1,525 +0,0 @@ -// flow-typed signature: 1f5de1a8acfb1cef787a7062bb304212 -// flow-typed version: 207fb32765/styled-components_v5.x.x/flow_>=v0.104.x - -// @flow - -declare module 'styled-components' { - declare class InterpolatableComponent

extends React$Component

{ - static +styledComponentId: string; - } - - declare export type Styles = { - [ruleOrSelector: string]: string | number, // | Styles, - ..., - }; - - declare export type Interpolation

= - | (( - executionContext: P - ) => ((executionContext: P) => InterpolationBase) | InterpolationBase) - | InterpolationBase; - - declare export type InterpolationBase = - | CSSRules - | KeyFrames - | string - | number - | false // falsy values are OK, true is the only one not allowed, because it renders as "true" - | null - | void - | Styles - | Class>; // eslint-disable-line flowtype/no-weak-types - - declare export type TaggedTemplateLiteral = ( - strings: string[], - ...interpolations: Interpolation[] - ) => R; - - // Should this be `mixed` perhaps? - declare export type CSSRules = Interpolation[]; // eslint-disable-line flowtype/no-weak-types - - declare export type CSSConstructor = TaggedTemplateLiteral; // eslint-disable-line flowtype/no-weak-types - declare export type KeyFramesConstructor = TaggedTemplateLiteral< - any, // eslint-disable-line flowtype/no-weak-types - KeyFrames - >; - declare export type CreateGlobalStyleConstructor = TaggedTemplateLiteral< - any, // eslint-disable-line flowtype/no-weak-types - React$ComponentType<*> - >; - - declare interface Tag { - styleTag: HTMLStyleElement | null; - getIds(): string[]; - hasNameForId(id: string, name: string): boolean; - insertMarker(id: string): T; - insertRules(id: string, cssRules: string[], name: ?string): void; - removeRules(id: string): void; - css(): string; - toHTML(additionalAttrs: ?string): string; - toElement(): React$Element<*>; - clone(): Tag; - sealed: boolean; - } - - // The `any`/weak types in here all come from `styled-components` directly, since those definitions were just copied over - declare export class StyleSheet { - static get master(): StyleSheet; - static get instance(): StyleSheet; - static reset(forceServer?: boolean): void; - - id: number; - forceServer: boolean; - target: ?HTMLElement; - tagMap: { [string]: Tag, ... }; // eslint-disable-line flowtype/no-weak-types - deferred: { [string]: string[] | void, ... }; - rehydratedNames: { [string]: boolean, ... }; - ignoreRehydratedNames: { [string]: boolean, ... }; - tags: Tag[]; // eslint-disable-line flowtype/no-weak-types - importRuleTag: Tag; // eslint-disable-line flowtype/no-weak-types - capacity: number; - clones: StyleSheet[]; - - constructor(?HTMLElement): this; - rehydrate(): this; - clone(): StyleSheet; - sealAllTags(): void; - makeTag(tag: ?Tag): Tag; // eslint-disable-line flowtype/no-weak-types - getImportRuleTag(): Tag; // eslint-disable-line flowtype/no-weak-types - getTagForId(id: string): Tag; // eslint-disable-line flowtype/no-weak-types - hasId(id: string): boolean; - hasNameForId(id: string, name: string): boolean; - deferredInject(id: string, cssRules: string[]): void; - inject(id: string, cssRules: string[], name?: string): void; - remove(id: string): void; - toHtml(): string; - toReactElements(): React$ElementType[]; - } - - declare export function isStyledComponent(target: mixed): boolean; - - declare type SCMProps = { - children?: React.Node, - sheet?: StyleSheet, - target?: HTMLElement, - ... - }; - - declare export var StyleSheetContext: React$Context; - declare export var StyleSheetConsumer: React$ComponentType<{| - children: (value: StyleSheet) => ?React$Node, - |}>; - declare var StyleSheetProvider: React$ComponentType<{| - children?: React$Node, - value: StyleSheet, - |}>; - - /** - * plugin - * - * @param {number} context - * @param {Array} selector - * @param {Array} parent - * @param {string} content - * @param {number} line - * @param {number} column - * @param {number} length - * @return {(string|void)?} - */ - - declare type StylisPluginSignature = ( - context: number, - selector: string[], - parent: string[], - content: string, - line: number, - column: number, - length: number - ) => string | void; - - declare export class StyleSheetManager extends React$Component { - getContext(sheet: ?StyleSheet, target: ?HTMLElement): StyleSheet; - render(): React$Element; - stylisPlugins?: StylisPluginSignature[]; - disableVendorPrefixes?: boolean; - disableCSSOMInjection?: boolean; - } - - declare export class ServerStyleSheet { - instance: StyleSheet; - masterSheet: StyleSheet; - sealed: boolean; - - seal(): void; - collectStyles(children: any): React$Element; // eslint-disable-line flowtype/no-weak-types - getStyleTags(): string; - toReactElements(): React$ElementType[]; - // This seems to be use a port of node streams in the Browsers. Not gonna type this for now - // eslint-disable-next-line flowtype/no-weak-types - interleaveWithNodeStream(stream: any): any; - } - - declare export class KeyFrames { - id: string; - name: string; - rules: string[]; - - constructor(name: string, rules: string[]): this; - inject(StyleSheet): void; - toString(): string; - getName(): string; - } - - // I think any is appropriate here? - // eslint-disable-next-line flowtype/no-weak-types - declare export var css: CSSConstructor; - declare export var keyframes: KeyFramesConstructor; - declare export var createGlobalStyle: CreateGlobalStyleConstructor; - declare export var ThemeConsumer: React$ComponentType<{| - children: (value: mixed) => ?React$Node, - |}>; - declare export var ThemeProvider: React$ComponentType<{| - children?: ?React$Node, - theme: mixed | (mixed => mixed), - |}>; - - /** - Any because the intended use-case is for users to do: - - import {ThemeContext} from 'styled-components'; - ... - const theme = React.useContext(ThemeContext); - - If they want DRY-er code, they could declare their own version of this via something like - - import { ThemeContext as SCThemeContext } from 'styled-components'; - export const ThemeContext: React$Context = SCThemeContext; - - and then - - import {ThemeContext} from './theme'; - */ - // eslint-disable-next-line flowtype/no-weak-types - declare export var ThemeContext: React$Context; - - declare export type ThemeProps = {| - theme: T, - |}; - - declare type CommonSCProps = {| - children?: React$Node, - className?: ?string, - style?: { [string]: string | number, ... }, - ref?: React$Ref, // eslint-disable-line flowtype/no-weak-types - |}; - - declare export type PropsWithTheme = {| - ...ThemeProps, - ...CommonSCProps, // Not sure how useful this is here, but it's technically correct to have it - ...$Exact, - |}; - - declare export function withTheme( - Component: React$AbstractComponent - ): React$AbstractComponent<$Diff>, Instance>; - - declare export function useTheme(): Theme; - - declare export type StyledComponent< - Props, - Theme, - Instance, - MergedProps = { ...$Exact, ...CommonSCProps, ... } - > = React$AbstractComponent & - Class>; - - declare export type StyledFactory = {| - [[call]]: TaggedTemplateLiteral< - PropsWithTheme, - StyledComponent - >, - +attrs: ( - (StyleProps => A) | A - ) => TaggedTemplateLiteral< - PropsWithTheme<{| ...$Exact, ...$Exact |}, Theme>, - StyledComponent< - React$Config<{| ...$Exact, ...$Exact |}, $Exact>, - Theme, - Instance - > - >, - |}; - - declare export type StyledShorthandFactory = {| - [[call]]: ( - string[], - ...Interpolation>[] - ) => StyledComponent, - [[call]]: ( - (props: PropsWithTheme) => Interpolation // eslint-disable-line flowtype/no-weak-types - ) => StyledComponent, - +attrs: ( - (StyleProps => A) | A - ) => TaggedTemplateLiteral< - PropsWithTheme<{| ...$Exact, ...$Exact |}, Theme>, - StyledComponent< - React$Config<{| ...$Exact, ...$Exact |}, $Exact>, - Theme, - V - > - >, - |}; - - declare type BuiltinElementInstances = { - a: React$ElementRef<'a'>, - abbr: React$ElementRef<'abbr'>, - address: React$ElementRef<'address'>, - area: React$ElementRef<'area'>, - article: React$ElementRef<'article'>, - aside: React$ElementRef<'aside'>, - audio: React$ElementRef<'audio'>, - b: React$ElementRef<'b'>, - base: React$ElementRef<'base'>, - bdi: React$ElementRef<'bdi'>, - bdo: React$ElementRef<'bdo'>, - big: React$ElementRef<'big'>, - blockquote: React$ElementRef<'blockquote'>, - body: React$ElementRef<'body'>, - br: React$ElementRef<'br'>, - button: React$ElementRef<'button'>, - canvas: React$ElementRef<'canvas'>, - caption: React$ElementRef<'caption'>, - cite: React$ElementRef<'cite'>, - code: React$ElementRef<'code'>, - col: React$ElementRef<'col'>, - colgroup: React$ElementRef<'colgroup'>, - data: React$ElementRef<'data'>, - datalist: React$ElementRef<'datalist'>, - dd: React$ElementRef<'dd'>, - del: React$ElementRef<'del'>, - details: React$ElementRef<'details'>, - dfn: React$ElementRef<'dfn'>, - dialog: React$ElementRef<'dialog'>, - div: React$ElementRef<'div'>, - dl: React$ElementRef<'dl'>, - dt: React$ElementRef<'dt'>, - em: React$ElementRef<'em'>, - embed: React$ElementRef<'embed'>, - fieldset: React$ElementRef<'fieldset'>, - figcaption: React$ElementRef<'figcaption'>, - figure: React$ElementRef<'figure'>, - footer: React$ElementRef<'footer'>, - form: React$ElementRef<'form'>, - h1: React$ElementRef<'h1'>, - h2: React$ElementRef<'h2'>, - h3: React$ElementRef<'h3'>, - h4: React$ElementRef<'h4'>, - h5: React$ElementRef<'h5'>, - h6: React$ElementRef<'h6'>, - head: React$ElementRef<'head'>, - header: React$ElementRef<'header'>, - hgroup: React$ElementRef<'hgroup'>, - hr: React$ElementRef<'hr'>, - html: React$ElementRef<'html'>, - i: React$ElementRef<'i'>, - iframe: React$ElementRef<'iframe'>, - img: React$ElementRef<'img'>, - input: React$ElementRef<'input'>, - ins: React$ElementRef<'ins'>, - kbd: React$ElementRef<'kbd'>, - label: React$ElementRef<'label'>, - legend: React$ElementRef<'legend'>, - li: React$ElementRef<'li'>, - link: React$ElementRef<'link'>, - main: React$ElementRef<'main'>, - map: React$ElementRef<'map'>, - mark: React$ElementRef<'mark'>, - menu: React$ElementRef<'menu'>, - meta: React$ElementRef<'meta'>, - meter: React$ElementRef<'meter'>, - nav: React$ElementRef<'nav'>, - noscript: React$ElementRef<'noscript'>, - object: React$ElementRef<'object'>, - ol: React$ElementRef<'ol'>, - optgroup: React$ElementRef<'optgroup'>, - option: React$ElementRef<'option'>, - output: React$ElementRef<'output'>, - p: React$ElementRef<'p'>, - param: React$ElementRef<'param'>, - picture: React$ElementRef<'picture'>, - pre: React$ElementRef<'pre'>, - progress: React$ElementRef<'progress'>, - q: React$ElementRef<'q'>, - rp: React$ElementRef<'rp'>, - rt: React$ElementRef<'rt'>, - ruby: React$ElementRef<'ruby'>, - s: React$ElementRef<'s'>, - samp: React$ElementRef<'samp'>, - script: React$ElementRef<'script'>, - section: React$ElementRef<'section'>, - select: React$ElementRef<'select'>, - small: React$ElementRef<'small'>, - source: React$ElementRef<'source'>, - span: React$ElementRef<'span'>, - strong: React$ElementRef<'strong'>, - style: React$ElementRef<'style'>, - sub: React$ElementRef<'sub'>, - summary: React$ElementRef<'summary'>, - sup: React$ElementRef<'sup'>, - table: React$ElementRef<'table'>, - tbody: React$ElementRef<'tbody'>, - td: React$ElementRef<'td'>, - textarea: React$ElementRef<'textarea'>, - tfoot: React$ElementRef<'tfoot'>, - th: React$ElementRef<'th'>, - thead: React$ElementRef<'thead'>, - time: React$ElementRef<'time'>, - title: React$ElementRef<'title'>, - tr: React$ElementRef<'tr'>, - track: React$ElementRef<'track'>, - u: React$ElementRef<'u'>, - ul: React$ElementRef<'ul'>, - var: React$ElementRef<'var'>, - video: React$ElementRef<'video'>, - wbr: React$ElementRef<'wbr'>, - // SVG - circle: React$ElementRef<'circle'>, - clipPath: React$ElementRef<'clipPath'>, - defs: React$ElementRef<'defs'>, - ellipse: React$ElementRef<'ellipse'>, - g: React$ElementRef<'g'>, - image: React$ElementRef<'image'>, - line: React$ElementRef<'line'>, - linearGradient: React$ElementRef<'linearGradient'>, - mask: React$ElementRef<'mask'>, - path: React$ElementRef<'path'>, - pattern: React$ElementRef<'pattern'>, - polygon: React$ElementRef<'polygon'>, - polyline: React$ElementRef<'polyline'>, - radialGradient: React$ElementRef<'radialGradient'>, - rect: React$ElementRef<'rect'>, - stop: React$ElementRef<'stop'>, - svg: React$ElementRef<'svg'>, - text: React$ElementRef<'text'>, - tspan: React$ElementRef<'tspan'>, - // Deprecated, should be HTMLUnknownElement, but Flow doesn't support it - keygen: React$ElementRef<'keygen'>, - menuitem: React$ElementRef<'menuitem'>, - ... - }; - - declare type BuiltinElementType = $ElementType< - BuiltinElementInstances, - ElementName - >; - - declare interface Styled { - , Theme, OwnProps = React$ElementConfig>( - Comp - ): StyledFactory<{| ...$Exact |}, Theme, Comp>; - >( - ElementName - ): StyledFactory>; - } - - declare export default Styled & ConvenientShorthands; -} - -declare module 'styled-components/native' { - import type { - CSSRules, - CSSConstructor, - KeyFramesConstructor, - CreateGlobalStyleConstructor, - StyledComponent, - Interpolation, - - // "private" types - TaggedTemplateLiteral, - StyledFactory, - StyledShorthandFactory, - ThemeProps, - PropsWithTheme, - } from 'styled-components'; - - declare type BuiltinElementInstances = { - ActivityIndicator: React$ComponentType<{ ... }>, - ActivityIndicatorIOS: React$ComponentType<{ ... }>, - ART: React$ComponentType<{ ... }>, - Button: React$ComponentType<{ ... }>, - DatePickerIOS: React$ComponentType<{ ... }>, - DrawerLayoutAndroid: React$ComponentType<{ ... }>, - Image: React$ComponentType<{ ... }>, - ImageBackground: React$ComponentType<{ ... }>, - ImageEditor: React$ComponentType<{ ... }>, - ImageStore: React$ComponentType<{ ... }>, - KeyboardAvoidingView: React$ComponentType<{ ... }>, - ListView: React$ComponentType<{ ... }>, - MapView: React$ComponentType<{ ... }>, - Modal: React$ComponentType<{ ... }>, - NavigatorIOS: React$ComponentType<{ ... }>, - Picker: React$ComponentType<{ ... }>, - PickerIOS: React$ComponentType<{ ... }>, - ProgressBarAndroid: React$ComponentType<{ ... }>, - ProgressViewIOS: React$ComponentType<{ ... }>, - ScrollView: React$ComponentType<{ ... }>, - SegmentedControlIOS: React$ComponentType<{ ... }>, - Slider: React$ComponentType<{ ... }>, - SliderIOS: React$ComponentType<{ ... }>, - SnapshotViewIOS: React$ComponentType<{ ... }>, - Switch: React$ComponentType<{ ... }>, - RecyclerViewBackedScrollView: React$ComponentType<{ ... }>, - RefreshControl: React$ComponentType<{ ... }>, - SafeAreaView: React$ComponentType<{ ... }>, - StatusBar: React$ComponentType<{ ... }>, - SwipeableListView: React$ComponentType<{ ... }>, - SwitchAndroid: React$ComponentType<{ ... }>, - SwitchIOS: React$ComponentType<{ ... }>, - TabBarIOS: React$ComponentType<{ ... }>, - Text: React$ComponentType<{ ... }>, - TextInput: React$ComponentType<{ ... }>, - ToastAndroid: React$ComponentType<{ ... }>, - ToolbarAndroid: React$ComponentType<{ ... }>, - Touchable: React$ComponentType<{ ... }>, - TouchableHighlight: React$ComponentType<{ ... }>, - TouchableNativeFeedback: React$ComponentType<{ ... }>, - TouchableOpacity: React$ComponentType<{ ... }>, - TouchableWithoutFeedback: React$ComponentType<{ ... }>, - View: React$ComponentType<{ ... }>, - ViewPagerAndroid: React$ComponentType<{ ... }>, - WebView: React$ComponentType<{ ... }>, - FlatList: React$ComponentType<{ ... }>, - SectionList: React$ComponentType<{ ... }>, - VirtualizedList: React$ComponentType<{ ... }>, - ... - }; - - declare type BuiltinElementType = $ElementType< - BuiltinElementInstances, - ElementName - >; - - declare type ConvenientShorthands = $ObjMap< - BuiltinElementInstances, - (V) => StyledShorthandFactory - >; - - declare interface Styled { - >( - ElementName - ): StyledFactory>; - < - Comp: React$ComponentType, - Theme, - OwnProps = React$ElementConfig - >( - Comp - ): StyledFactory<{| ...$Exact |}, Theme, Comp>; - } - - declare export default Styled & ConvenientShorthands; -} - -declare module 'styled-components/macro' { - declare export * from 'styled-components'; -} diff --git a/flow-typed/npm/styled-components_vx.x.x.js b/flow-typed/npm/styled-components_vx.x.x.js new file mode 100644 index 000000000..17011fa17 --- /dev/null +++ b/flow-typed/npm/styled-components_vx.x.x.js @@ -0,0 +1,143 @@ +// flow-typed signature: 8072a5267b376c8aaecd28d2087d012e +// flow-typed version: <>/styled-components_v4.0.3/flow_v0.86.0 + +/** + * This is an autogenerated libdef stub for: + * + * 'styled-components' + * + * Fill this stub out by replacing all the `any` types. + * + * Once filled out, we encourage you to share your work with the + * community by sending a pull request to: + * https://github.com/flowtype/flow-typed + */ + +// @flow +declare module "styled-components" { + declare module.exports: any; +} + +/** + * We include stubs for each file inside this npm package in case you need to + * require those files directly. Feel free to delete any files that aren't + * needed. + */ +declare module "styled-components/dist/styled-components-macro.cjs" { + declare module.exports: any; +} + +declare module "styled-components/dist/styled-components-macro.esm" { + declare module.exports: any; +} + +declare module "styled-components/dist/styled-components.browser.cjs" { + declare module.exports: any; +} + +declare module "styled-components/dist/styled-components.browser.esm" { + declare module.exports: any; +} + +declare module "styled-components/dist/styled-components.cjs" { + declare module.exports: any; +} + +declare module "styled-components/dist/styled-components.esm" { + declare module.exports: any; +} + +declare module "styled-components/dist/styled-components" { + declare module.exports: any; +} + +declare module "styled-components/dist/styled-components.min" { + declare module.exports: any; +} + +declare module "styled-components/native/dist/styled-components.native.cjs" { + declare module.exports: any; +} + +declare module "styled-components/native/dist/styled-components.native.esm" { + declare module.exports: any; +} + +declare module "styled-components/primitives/dist/styled-components-primitives.cjs" { + declare module.exports: any; +} + +declare module "styled-components/primitives/dist/styled-components-primitives.esm" { + declare module.exports: any; +} + +declare module "styled-components/scripts/postinstall" { + declare module.exports: any; +} + +declare module "styled-components/test-utils/index" { + declare module.exports: any; +} + +declare module "styled-components/test-utils/setupTestFramework" { + declare module.exports: any; +} + +// Filename aliases +declare module "styled-components/dist/styled-components-macro.cjs.js" { + declare module.exports: $Exports< + "styled-components/dist/styled-components-macro.cjs">; +} +declare module "styled-components/dist/styled-components-macro.esm.js" { + declare module.exports: $Exports< + "styled-components/dist/styled-components-macro.esm">; +} +declare module "styled-components/dist/styled-components.browser.cjs.js" { + declare module.exports: $Exports< + "styled-components/dist/styled-components.browser.cjs">; +} +declare module "styled-components/dist/styled-components.browser.esm.js" { + declare module.exports: $Exports< + "styled-components/dist/styled-components.browser.esm">; +} +declare module "styled-components/dist/styled-components.cjs.js" { + declare module.exports: $Exports< + "styled-components/dist/styled-components.cjs">; +} +declare module "styled-components/dist/styled-components.esm.js" { + declare module.exports: $Exports< + "styled-components/dist/styled-components.esm">; +} +declare module "styled-components/dist/styled-components.js" { + declare module.exports: $Exports<"styled-components/dist/styled-components">; +} +declare module "styled-components/dist/styled-components.min.js" { + declare module.exports: $Exports< + "styled-components/dist/styled-components.min">; +} +declare module "styled-components/native/dist/styled-components.native.cjs.js" { + declare module.exports: $Exports< + "styled-components/native/dist/styled-components.native.cjs">; +} +declare module "styled-components/native/dist/styled-components.native.esm.js" { + declare module.exports: $Exports< + "styled-components/native/dist/styled-components.native.esm">; +} +declare module "styled-components/primitives/dist/styled-components-primitives.cjs.js" { + declare module.exports: $Exports< + "styled-components/primitives/dist/styled-components-primitives.cjs">; +} +declare module "styled-components/primitives/dist/styled-components-primitives.esm.js" { + declare module.exports: $Exports< + "styled-components/primitives/dist/styled-components-primitives.esm">; +} +declare module "styled-components/scripts/postinstall.js" { + declare module.exports: $Exports<"styled-components/scripts/postinstall">; +} +declare module "styled-components/test-utils/index.js" { + declare module.exports: $Exports<"styled-components/test-utils/index">; +} +declare module "styled-components/test-utils/setupTestFramework.js" { + declare module.exports: $Exports< + "styled-components/test-utils/setupTestFramework">; +}