From f949ddeacb3e3a1ffcef219a90398ecd254a9ecb Mon Sep 17 00:00:00 2001 From: Luke John Date: Mon, 10 Jul 2017 12:37:07 +0800 Subject: [PATCH] fix(typescript): Improved typings to prevent incorrect usage The usage of a union between Partials and Functions resulted in any functions passed to glamorous component factories being accepted by the type system. As part of fixing this I also renamed some types to align with the glamorous documentation. BREAKING CHANGE: Renamed types `HTMLGlamorousInterface` -> `HTMLComponentFactory`, `StyledFunction` -> `GlamorousComponentFactory`, `SVGGlamorousInterface` -> `SVGComponentFactory`. Also improved typesafety on them, so things that previously could have passed will now fail. 212 --- package.json | 3 +- .../__snapshots__/typescript.js.snap | 26 ++ src/__tests__/typescript.js | 18 ++ test/glamorous-exports.test.ts | 6 +- test/glamorous-should-fail.tsx | 92 ++++++ test/glamorous.test.tsx | 7 +- ...d.ts => built-in-component-factories.d.ts} | 62 ++-- typings/component-factory.d.ts | 160 +++++++++++ typings/glamorous-component.d.ts | 16 ++ typings/glamorous.d.ts | 32 ++- typings/styled-function.d.ts | 175 ----------- typings/svg-properties.d.ts | 271 ++++++++++++++++++ yarn.lock | 10 +- 13 files changed, 654 insertions(+), 224 deletions(-) create mode 100644 src/__tests__/__snapshots__/typescript.js.snap create mode 100644 src/__tests__/typescript.js create mode 100644 test/glamorous-should-fail.tsx rename typings/{element-interfaces.d.ts => built-in-component-factories.d.ts} (82%) create mode 100644 typings/component-factory.d.ts create mode 100644 typings/glamorous-component.d.ts delete mode 100644 typings/styled-function.d.ts create mode 100644 typings/svg-properties.d.ts diff --git a/package.json b/package.json index 9b5e628a..70f3269b 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,6 @@ "start": "nps", "doctoc": "doctoc --maxlevel 3 --title \"**Table of Contents**\"", "test": "nps test", - "test:ts": "(tsc -p ./tsconfig.json && rimraf test-ts) || rimraf test-ts", "commitmsg": "opt --in commit-msg --exec \"validate-commit-msg\"", "precommit": "lint-staged && opt --in pre-commit --exec \"npm start validate\"" }, @@ -83,7 +82,7 @@ "rollup-plugin-uglify": "^2.0.1", "tslint": "^5.4.3", "tslint-microsoft-contrib": "^5.0.0", - "typescript": "^2.3.4", + "typescript": "^2.4.1", "validate-commit-msg": "^2.12.2" }, "eslintConfig": { diff --git a/src/__tests__/__snapshots__/typescript.js.snap b/src/__tests__/__snapshots__/typescript.js.snap new file mode 100644 index 00000000..ca481377 --- /dev/null +++ b/src/__tests__/__snapshots__/typescript.js.snap @@ -0,0 +1,26 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Typescript expected failures 1`] = ` +"yarn test:ts v0.24.6 +$ (tsc -p ./tsconfig.json && rimraf test-ts) || rimraf test-ts +test/glamorous-should-fail.tsx(16,3): error TS2345: Argument of type '{ fillRule: \\"cat\\"; }' is not assignable to parameter of type 'Partial'. + Types of property 'fillRule' are incompatible. + Type '\\"cat\\"' is not assignable to type '\\"nonzero\\" | \\"evenodd\\" | \\"inherit\\" | undefined'. +test/glamorous-should-fail.tsx(29,3): error TS2345: Argument of type '() => { fillRule: \\"cat\\"; }' is not assignable to parameter of type 'Partial'. + Index signature is missing in type '() => { fillRule: \\"cat\\"; }'. +test/glamorous-should-fail.tsx(43,3): error TS2345: Argument of type '{ float: \\"cat\\"; }' is not assignable to parameter of type 'Partial'. + Types of property 'float' are incompatible. + Type '\\"cat\\"' is not assignable to type '\\"left\\" | \\"right\\" | \\"none\\" | \\"initial\\" | \\"inherit\\" | \\"unset\\" | \\"inline-start\\" | \\"inline-end\\" | und...'. +test/glamorous-should-fail.tsx(55,3): error TS2345: Argument of type '() => { float: \\"cat\\"; }' is not assignable to parameter of type 'Partial'. + Index signature is missing in type '() => { float: \\"cat\\"; }'. +test/glamorous-should-fail.tsx(71,3): error TS2345: Argument of type '{ fillRule: \\"cat\\"; }' is not assignable to parameter of type 'Partial'. + Types of property 'fillRule' are incompatible. + Type '\\"cat\\"' is not assignable to type '\\"nonzero\\" | \\"evenodd\\" | \\"initial\\" | \\"inherit\\" | \\"unset\\" | undefined'. +test/glamorous-should-fail.tsx(77,3): error TS2345: Argument of type '() => { fillRule: \\"cat\\"; }' is not assignable to parameter of type 'Partial'. + Index signature is missing in type '() => { fillRule: \\"cat\\"; }'. +test/glamorous-should-fail.tsx(83,3): error TS2345: Argument of type '{ float: \\"cat\\"; }' is not assignable to parameter of type 'Partial'. + Types of property 'float' are incompatible. + Type '\\"cat\\"' is not assignable to type '\\"left\\" | \\"right\\" | \\"none\\" | \\"initial\\" | \\"inherit\\" | \\"unset\\" | \\"inline-start\\" | \\"inline-end\\" | und...'. +test/glamorous-should-fail.tsx(89,3): error TS2345: Argument of type '() => { float: \\"cat\\"; }' is not assignable to parameter of type 'Partial'. + Index signature is missing in type '() => { float: \\"cat\\"; }'." +`; diff --git a/src/__tests__/typescript.js b/src/__tests__/typescript.js new file mode 100644 index 00000000..9747720c --- /dev/null +++ b/src/__tests__/typescript.js @@ -0,0 +1,18 @@ +var spawnSync = require('child_process').spawnSync + +test('Typescript', () => { + const testTypescriptCompilation = spawnSync('yarn', ['test:ts']) + + const typescriptCompilationOutput = testTypescriptCompilation.stdout + .toString() + .trimRight() + + const trimmedTypescriptCompilationOutput = typescriptCompilationOutput.substring( + 0, + typescriptCompilationOutput.lastIndexOf('\n'), + ) + + expect(trimmedTypescriptCompilationOutput).toMatchSnapshot( + 'Typescript expected failures', + ) +}) diff --git a/test/glamorous-exports.test.ts b/test/glamorous-exports.test.ts index 6b011760..36a35ab7 100644 --- a/test/glamorous-exports.test.ts +++ b/test/glamorous-exports.test.ts @@ -2,7 +2,7 @@ import { CSSProperties, ExtraGlamorousProps, GlamorousComponent, - HTMLGlamorousInterface, - StyledFunction, - SVGGlamorousInterface, + HTMLComponentFactory, + GlamorousComponentFactory, + SVGComponentFactory, } from '../' diff --git a/test/glamorous-should-fail.tsx b/test/glamorous-should-fail.tsx new file mode 100644 index 00000000..4f07de14 --- /dev/null +++ b/test/glamorous-should-fail.tsx @@ -0,0 +1,92 @@ +import * as React from "react"; + +import glamorous, { withTheme, ThemeProvider } from "../"; + +// built-in DOM component factories + +// ### SVG + +const BuiltInStrictSVGStyleObjectInvalidKey = glamorous.svg( + { + flying: 'cat', + }, +) + +const BuiltInStrictSVGStyleObjectInvalidProperty = glamorous.svg( + { + fillRule: 'cat', + }, +) + +// Known to fail currently due to typescripts partial handling +const BuiltInStrictSVGStyleFunctionInvalidKey = glamorous.svg( + () => ({ + flying: 'cat' + }) +) + +const BuiltInStrictSVGStyleFunctionInvalidProperty = glamorous.svg( + () => ({ + fillRule: 'cat', + }) +) + +// ### HTML + +const BuiltInStrictDIVtyleObjectInvlalidKey = glamorous.div( + { + flying: "cat", + }, +) + +const BuiltInStrictDIVtyleObjectInvlalidProperty = glamorous.div( + { + float: "cat", + }, +) + +const BuiltInStrictDIVStyleFunctionInvlalidKey = glamorous.div( + () => ({ + flying: "cat", + }) +) + +const BuiltInStrictDIVStyleFunctionInvlalidProperty = glamorous.div( + () => ({ + float: "cat", + }) +) + +// self provided glamorousComponentFactory + +interface TestComponentProps { + className: string +} + +const TestComponent: React.SFC = (props) => ( +
+) + +const StrictSVGStyleObject = glamorous(TestComponent)( + { + fillRule: 'cat', + }, +) + +const StrictSVGStyleFunction = glamorous(TestComponent)( + () => ({ + fillRule: 'cat', + }) +) + +const BuiltInStrictStyleFunction = glamorous(TestComponent)( + { + float: "cat", + }, +) + +const BuiltInStrictDivStyleFunction = glamorous(TestComponent)( + () => ({ + float: "cat", + }) +) \ No newline at end of file diff --git a/test/glamorous.test.tsx b/test/glamorous.test.tsx index 7361393d..bc2af8ef 100644 --- a/test/glamorous.test.tsx +++ b/test/glamorous.test.tsx @@ -64,12 +64,15 @@ interface DividerInsideDividerProps { color: string; }; +type DividerInsideDividerTheme = { main: { color: string; } } + + // component styles const DividerInsideDivider = glamorous(Divider)( { - "fontSize": "10px", + fontSize: "10px", }, - (props, theme: { main: { color: string; } }) => ({ + (props, theme: DividerInsideDividerTheme) => ({ "color": theme.main.color, }), ); diff --git a/typings/element-interfaces.d.ts b/typings/built-in-component-factories.d.ts similarity index 82% rename from typings/element-interfaces.d.ts rename to typings/built-in-component-factories.d.ts index ce8d7d10..e3b4a176 100644 --- a/typings/element-interfaces.d.ts +++ b/typings/built-in-component-factories.d.ts @@ -1,11 +1,24 @@ import { SVGAttributes } from 'react' + import { CSSProperties } from './css-properties' +import { SVGProperties } from './svg-properties' import { - HtmlStyledFunction, - SvgStyledFunction, -} from './styled-function' + GlamorousComponentFactory, +} from './component-factory' + +export type HtmlStyledFunction< + HTMLElement, + Properties +> = GlamorousComponentFactory, Properties> + -export interface HTMLGlamorousInterface { +export type SvgStyledFunction< + SVGElement, + Attributes +> = GlamorousComponentFactory, Attributes> + + +export interface HTMLComponentFactory { a: HtmlStyledFunction abbr: HtmlStyledFunction address: HtmlStyledFunction @@ -121,25 +134,24 @@ export interface HTMLGlamorousInterface { wbr: HtmlStyledFunction } - -export interface SVGGlamorousInterface { - circle: SvgStyledFunction> - clipPath: SvgStyledFunction> - defs: SvgStyledFunction> - ellipse: SvgStyledFunction> - g: SvgStyledFunction> - image: SvgStyledFunction> - line: SvgStyledFunction> - linearGradient: SvgStyledFunction> - mask: SvgStyledFunction> - path: SvgStyledFunction> - pattern: SvgStyledFunction> - polygon: SvgStyledFunction> - polyline: SvgStyledFunction> - radialGradient: SvgStyledFunction> - rect: SvgStyledFunction> - stop: SvgStyledFunction> - svg: SvgStyledFunction> - text: SvgStyledFunction> - tspan: SvgStyledFunction> +export interface SVGComponentFactory { + circle: SvgStyledFunction + clipPath: SvgStyledFunction + defs: SvgStyledFunction + ellipse: SvgStyledFunction + g: SvgStyledFunction + image: SvgStyledFunction + line: SvgStyledFunction + linearGradient: SvgStyledFunction + mask: SvgStyledFunction + path: SvgStyledFunction + pattern: SvgStyledFunction + polygon: SvgStyledFunction + polyline: SvgStyledFunction + radialGradient: SvgStyledFunction + rect: SvgStyledFunction + stop: SvgStyledFunction + svg: SvgStyledFunction + text: SvgStyledFunction + tspan: SvgStyledFunction } diff --git a/typings/component-factory.d.ts b/typings/component-factory.d.ts new file mode 100644 index 00000000..a1d2dae7 --- /dev/null +++ b/typings/component-factory.d.ts @@ -0,0 +1,160 @@ +import { GlamorousComponent } from './glamorous-component' +/** + * StyleObject is an objects of Style Properties. + * + * @see {@link https://github.com/paypal/glamorous/blob/master/src/create-glamorous.js#L28-L131} + */ +export type StyleObject = Partial + +/** + * StyleFunction generates styles based on props + * and themes. + * + * @see {@link https://github.com/paypal/glamorous/blob/master/src/create-glamorous.js#L28-L131} + */ +export type StyleFunction = ( + props: Props, + theme?: Theme +) => Partial + +type StyleArguments = Array< + | StyleFunction + | StyleObject +> + +// TODO: Using a union for a parameter kills autocomplete so we +// use overloading to give autocomplete on the first two styles +// and retain typesafety on additional styles +// o = StyleObject, f = StyleFunction +// o +// o,o +// o,f +// o,f,o +// o,f,f +// o,o,f +// o,o,o +// f +// f,o +// f,f +// f,o,f +// f,o,o +// f,f,o +// f,f,f + +export interface GlamorousComponentFactory { + ( + style1: StyleObject, + ...styles: StyleArguments + ): GlamorousComponent; +} + +export interface GlamorousComponentFactory { + ( + style1: StyleObject, + style2: StyleObject, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleObject, + style2: StyleFunction, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleObject, + style2: StyleFunction, + style3: StyleObject, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleObject, + style2: StyleFunction, + style3: StyleFunction, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleObject, + style2: StyleObject, + style3: StyleFunction, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleObject, + style2: StyleObject, + style3: StyleObject, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleFunction, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleFunction, + style2: StyleObject, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleFunction, + style2: StyleFunction, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleFunction, + style2: StyleObject, + style3: StyleFunction, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleFunction, + style2: StyleObject, + style3: StyleObject, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleFunction, + style2: StyleFunction, + style3: StyleObject, + ...styles: StyleArguments + ): GlamorousComponent +} + +export interface GlamorousComponentFactory { + ( + style1: StyleFunction, + style2: StyleFunction, + style3: StyleFunction, + ...styles: StyleArguments + ): GlamorousComponent +} diff --git a/typings/glamorous-component.d.ts b/typings/glamorous-component.d.ts new file mode 100644 index 00000000..79281ff6 --- /dev/null +++ b/typings/glamorous-component.d.ts @@ -0,0 +1,16 @@ +import { CSSProperties } from './css-properties' + +/** +* `glamorousComponentFactory` returns a ComponentClass +* +* @see {@link https://github.com/paypal/glamorous/blob/master/src/create-glamorous.js#L28-L131} +*/ + +export interface ExtraGlamorousProps { + innerRef?: (instance: any) => void; + css?: CSSProperties; +} + +export type GlamorousComponent = React.ComponentClass< + ElementProps & ExtraGlamorousProps +> diff --git a/typings/glamorous.d.ts b/typings/glamorous.d.ts index 1a504e3d..05ad6e08 100644 --- a/typings/glamorous.d.ts +++ b/typings/glamorous.d.ts @@ -3,24 +3,28 @@ // Definitions by: Kok Sam import * as React from 'react' + import { - HTMLGlamorousInterface, - SVGGlamorousInterface, -} from './element-interfaces' + HTMLComponentFactory, + SVGComponentFactory, +} from './built-in-component-factories' import { - StyledFunction, GlamorousComponent, ExtraGlamorousProps, -} from './styled-function' +} from './glamorous-component' +import { + GlamorousComponentFactory, +} from './component-factory' import { CSSProperties } from './css-properties' +import { SVGProperties } from './svg-properties' export { CSSProperties, ExtraGlamorousProps, GlamorousComponent, - HTMLGlamorousInterface, - StyledFunction, - SVGGlamorousInterface, + HTMLComponentFactory, + GlamorousComponentFactory, + SVGComponentFactory, } export interface GlamorousOptions { @@ -35,11 +39,15 @@ export interface Config { useDisplayNameInClassName: boolean } -export interface GlamorousInterface extends HTMLGlamorousInterface, SVGGlamorousInterface { -

( - component:Component

, +export interface GlamorousInterface extends HTMLComponentFactory, SVGComponentFactory { + ( + component:Component, + options?: GlamorousOptions, + ): GlamorousComponentFactory + ( + component:Component, options?: GlamorousOptions, - ): StyledFunction> + ): GlamorousComponentFactory Div: React.StatelessComponent Svg: React.StatelessComponent & ExtraGlamorousProps> diff --git a/typings/styled-function.d.ts b/typings/styled-function.d.ts deleted file mode 100644 index db9b41f4..00000000 --- a/typings/styled-function.d.ts +++ /dev/null @@ -1,175 +0,0 @@ -import { CSSProperties } from './css-properties' - -/** - * `glamorousComponentFactory` returns a ComponentClass - * - * @see {@link https://github.com/paypal/glamorous/blob/master/src/create-glamorous.js#L28-L131} - */ - -export type GlamorousComponent

= React.ComponentClass

- -/** - * StaticStyles are objects of CSS Properties. - * - * @see {@link https://github.com/paypal/glamorous/blob/master/src/create-glamorous.js#L28-L131} - */ -export type StaticStyles = Partial - -/** - * DynamicStyledFunction generates styles based on props - * and themes. - * - * @see {@link https://github.com/paypal/glamorous/blob/master/src/create-glamorous.js#L28-L131} - */ -export type DynamicStyledFunction = ( - props: CustomProps, - theme?: ThemeProps -) => Partial - -type Styles = Array | StaticStyles> - -// TODO: Using a union for a parameter kills autocomplete so we -// use overloading to give autocomplete on the first two styles -// and retain typesafety on additional styles -// s = StaticStyles, d = DynamicStyledFunction -// s -// s,s -// s,d -// s,d,s -// s,d,d -// s,s,d -// s,s,s -// d -// d,s -// d,d -// d,s,d -// d,s,s -// d,d,s -// d,d,d - -export interface ExtraGlamorousProps { - innerRef?: (instance: any) => void; - css?: CSSProperties; -} - -export interface StyledFunction { - ( - style1: StaticStyles, - ...styles: Styles - ): GlamorousComponent; -} - -export interface StyledFunction { - ( - style1: StaticStyles, - style2: StaticStyles, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: StaticStyles, - style2: DynamicStyledFunction, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: StaticStyles, - style2: DynamicStyledFunction, - style3: StaticStyles, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: StaticStyles, - style2: DynamicStyledFunction, - style3: DynamicStyledFunction, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: StaticStyles, - style2: StaticStyles, - style3: DynamicStyledFunction, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: StaticStyles, - style2: StaticStyles, - style3: StaticStyles, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: DynamicStyledFunction, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: DynamicStyledFunction, - style2: StaticStyles, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: DynamicStyledFunction, - style2: DynamicStyledFunction, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: DynamicStyledFunction, - style2: StaticStyles, - style3: DynamicStyledFunction, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: DynamicStyledFunction, - style2: StaticStyles, - style3: StaticStyles, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: DynamicStyledFunction, - style2: DynamicStyledFunction, - style3: StaticStyles, - ...styles: Styles - ): GlamorousComponent -} - -export interface StyledFunction { - ( - style1: DynamicStyledFunction, - style2: DynamicStyledFunction, - style3: DynamicStyledFunction, - ...styles: Styles - ): GlamorousComponent -} - -export type HtmlStyledFunction = StyledFunction, Properties> - -export type SvgStyledFunction = StyledFunction, Properties> diff --git a/typings/svg-properties.d.ts b/typings/svg-properties.d.ts new file mode 100644 index 00000000..2fb7b6a7 --- /dev/null +++ b/typings/svg-properties.d.ts @@ -0,0 +1,271 @@ +import { CSSProperties } from './css-properties.d' + +// Taken from React.SVGAttributes with the following added to work around Partial issue +// [propertyName: string]: string | number | SVGProperties | undefined + +export interface SVGProperties { + // Attributes which also defined in HTMLAttributes + // See comment in SVGDOMPropertyConfig.js + className?: string; + color?: string; + height?: number | string; + id?: string; + lang?: string; + max?: number | string; + media?: string; + method?: string; + min?: number | string; + name?: string; + + // style?: CSSProperties; + target?: string; + type?: string; + width?: number | string; + + // Other HTML properties supported by SVG elements in browsers + role?: string; + tabIndex?: number; + + // SVG Specific attributes + accentHeight?: number | string; + accumulate?: "none" | "sum"; + additive?: "replace" | "sum"; + alignmentBaseline?: "auto" | "baseline" | "before-edge" | "text-before-edge" | "middle" | "central" | "after-edge" | "text-after-edge" | "ideographic" | "alphabetic" | "hanging" | "mathematical" | "inherit"; + allowReorder?: "no" | "yes"; + alphabetic?: number | string; + amplitude?: number | string; + arabicForm?: "initial" | "medial" | "terminal" | "isolated"; + ascent?: number | string; + attributeName?: string; + attributeType?: string; + autoReverse?: number | string; + azimuth?: number | string; + baseFrequency?: number | string; + baselineShift?: number | string; + baseProfile?: number | string; + bbox?: number | string; + begin?: number | string; + bias?: number | string; + by?: number | string; + calcMode?: number | string; + capHeight?: number | string; + clip?: number | string; + clipPath?: string; + clipPathUnits?: number | string; + clipRule?: number | string; + colorInterpolation?: number | string; + colorInterpolationFilters?: "auto" | "sRGB" | "linearRGB" | "inherit"; + colorProfile?: number | string; + colorRendering?: number | string; + contentScriptType?: number | string; + contentStyleType?: number | string; + cursor?: number | string; + cx?: number | string; + cy?: number | string; + d?: string; + decelerate?: number | string; + descent?: number | string; + diffuseConstant?: number | string; + direction?: number | string; + display?: number | string; + divisor?: number | string; + dominantBaseline?: number | string; + dur?: number | string; + dx?: number | string; + dy?: number | string; + edgeMode?: number | string; + elevation?: number | string; + enableBackground?: number | string; + end?: number | string; + exponent?: number | string; + externalResourcesRequired?: number | string; + fill?: string; + fillOpacity?: number | string; + fillRule?: "nonzero" | "evenodd" | "inherit"; + filter?: string; + filterRes?: number | string; + filterUnits?: number | string; + floodColor?: number | string; + floodOpacity?: number | string; + focusable?: number | string; + fontFamily?: string; + fontSize?: number | string; + fontSizeAdjust?: number | string; + fontStretch?: number | string; + fontStyle?: number | string; + fontVariant?: number | string; + fontWeight?: number | string; + format?: number | string; + from?: number | string; + fx?: number | string; + fy?: number | string; + g1?: number | string; + g2?: number | string; + glyphName?: number | string; + glyphOrientationHorizontal?: number | string; + glyphOrientationVertical?: number | string; + glyphRef?: number | string; + gradientTransform?: string; + gradientUnits?: string; + hanging?: number | string; + horizAdvX?: number | string; + horizOriginX?: number | string; + ideographic?: number | string; + imageRendering?: number | string; + in2?: number | string; + in?: string; + intercept?: number | string; + k1?: number | string; + k2?: number | string; + k3?: number | string; + k4?: number | string; + k?: number | string; + kernelMatrix?: number | string; + kernelUnitLength?: number | string; + kerning?: number | string; + keyPoints?: number | string; + keySplines?: number | string; + keyTimes?: number | string; + lengthAdjust?: number | string; + letterSpacing?: number | string; + lightingColor?: number | string; + limitingConeAngle?: number | string; + local?: number | string; + markerEnd?: string; + markerHeight?: number | string; + markerMid?: string; + markerStart?: string; + markerUnits?: number | string; + markerWidth?: number | string; + mask?: string; + maskContentUnits?: number | string; + maskUnits?: number | string; + mathematical?: number | string; + mode?: number | string; + numOctaves?: number | string; + offset?: number | string; + opacity?: number | string; + operator?: number | string; + order?: number | string; + orient?: number | string; + orientation?: number | string; + origin?: number | string; + overflow?: number | string; + overlinePosition?: number | string; + overlineThickness?: number | string; + paintOrder?: number | string; + panose1?: number | string; + pathLength?: number | string; + patternContentUnits?: string; + patternTransform?: number | string; + patternUnits?: string; + pointerEvents?: number | string; + points?: string; + pointsAtX?: number | string; + pointsAtY?: number | string; + pointsAtZ?: number | string; + preserveAlpha?: number | string; + preserveAspectRatio?: string; + primitiveUnits?: number | string; + r?: number | string; + radius?: number | string; + refX?: number | string; + refY?: number | string; + renderingIntent?: number | string; + repeatCount?: number | string; + repeatDur?: number | string; + requiredExtensions?: number | string; + requiredFeatures?: number | string; + restart?: number | string; + result?: string; + rotate?: number | string; + rx?: number | string; + ry?: number | string; + scale?: number | string; + seed?: number | string; + shapeRendering?: number | string; + slope?: number | string; + spacing?: number | string; + specularConstant?: number | string; + specularExponent?: number | string; + speed?: number | string; + spreadMethod?: string; + startOffset?: number | string; + stdDeviation?: number | string; + stemh?: number | string; + stemv?: number | string; + stitchTiles?: number | string; + stopColor?: string; + stopOpacity?: number | string; + strikethroughPosition?: number | string; + strikethroughThickness?: number | string; + string?: number | string; + stroke?: string; + strokeDasharray?: string | number; + strokeDashoffset?: string | number; + strokeLinecap?: "butt" | "round" | "square" | "inherit"; + strokeLinejoin?: "miter" | "round" | "bevel" | "inherit"; + strokeMiterlimit?: string; + strokeOpacity?: number | string; + strokeWidth?: number | string; + surfaceScale?: number | string; + systemLanguage?: number | string; + tableValues?: number | string; + targetX?: number | string; + targetY?: number | string; + textAnchor?: string; + textDecoration?: number | string; + textLength?: number | string; + textRendering?: number | string; + to?: number | string; + transform?: string; + u1?: number | string; + u2?: number | string; + underlinePosition?: number | string; + underlineThickness?: number | string; + unicode?: number | string; + unicodeBidi?: number | string; + unicodeRange?: number | string; + unitsPerEm?: number | string; + vAlphabetic?: number | string; + values?: string; + vectorEffect?: number | string; + version?: string; + vertAdvY?: number | string; + vertOriginX?: number | string; + vertOriginY?: number | string; + vHanging?: number | string; + vIdeographic?: number | string; + viewBox?: string; + viewTarget?: number | string; + visibility?: number | string; + vMathematical?: number | string; + widths?: number | string; + wordSpacing?: number | string; + writingMode?: number | string; + x1?: number | string; + x2?: number | string; + x?: number | string; + xChannelSelector?: string; + xHeight?: number | string; + xlinkActuate?: string; + xlinkArcrole?: string; + xlinkHref?: string; + xlinkRole?: string; + xlinkShow?: string; + xlinkTitle?: string; + xlinkType?: string; + xmlBase?: string; + xmlLang?: string; + xmlns?: string; + xmlnsXlink?: string; + xmlSpace?: string; + y1?: number | string; + y2?: number | string; + y?: number | string; + yChannelSelector?: string; + z?: number | string; + zoomAndPan?: string; + + [propertyName: string]: string | number | SVGProperties | undefined +} \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index 06864fb4..a93d8ad7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2721,7 +2721,7 @@ glob-parent@^2.0.0: dependencies: is-glob "^2.0.0" -glob@7.1.1, glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@^7.1.1: +glob@7.1.1, glob@^7.0.0: version "7.1.1" resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.1.tgz#805211df04faaf1c63a3600306cdf5ade50b2ec8" dependencies: @@ -2732,7 +2732,7 @@ glob@7.1.1, glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@^7.1.1: once "^1.3.0" path-is-absolute "^1.0.0" -glob@7.1.2: +glob@7.1.2, glob@^7.0.3, glob@^7.0.5, glob@^7.1.1: version "7.1.2" resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.2.tgz#c19c9df9a028702d678612384a6552404c636d15" dependencies: @@ -5993,9 +5993,9 @@ typedarray@^0.0.6: version "0.0.6" resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" -typescript@^2.3.4: - version "2.3.4" - resolved "https://registry.yarnpkg.com/typescript/-/typescript-2.3.4.tgz#3d38321828231e434f287514959c37a82b629f42" +typescript@^2.4.1: + version "2.4.1" + resolved "https://registry.yarnpkg.com/typescript/-/typescript-2.4.1.tgz#c3ccb16ddaa0b2314de031e7e6fee89e5ba346bc" ua-parser-js@^0.7.9: version "0.7.12"