From 50e72b5be7f6ae38ca9936c885df479f461730da Mon Sep 17 00:00:00 2001 From: Mikael Sand Date: Mon, 9 Sep 2019 23:21:13 +0300 Subject: [PATCH] fix: refine types --- src/index.d.ts | 64 ++++++++++++++++++----------- src/lib/extract/extractText.tsx | 14 +++---- src/lib/extract/extractTransform.ts | 11 ++++- src/lib/extract/types.ts | 12 +++--- 4 files changed, 64 insertions(+), 37 deletions(-) diff --git a/src/index.d.ts b/src/index.d.ts index 8ebc665f..818470aa 100644 --- a/src/index.d.ts +++ b/src/index.d.ts @@ -3,7 +3,8 @@ import * as ReactNative from 'react-native'; import { GestureResponderEvent } from 'react-native'; // Common props -type NumberProp = string | number; +export type NumberProp = string | number; +export type NumberArray = (NumberProp)[] | NumberProp; export type FillRule = 'evenodd' | 'nonzero'; export type Units = 'userSpaceOnUse' | 'objectBoundingBox'; @@ -12,6 +13,7 @@ export type TextAnchor = 'start' | 'middle' | 'end'; export type FontStyle = 'normal' | 'italic' | 'oblique'; export type FontVariant = 'normal' | 'small-caps'; export type FontWeight = + | NumberProp | 'normal' | 'bold' | 'bolder' @@ -93,11 +95,11 @@ export interface ResponderProps extends ReactNative.GestureResponderHandlers { // rgba values inside range 0 to 1 inclusive // rgbaArray = [r, g, b, a] -type rgbaArray = ReadonlyArray; +export type rgbaArray = ReadonlyArray; // argb values inside range 0x00 to 0xff inclusive // int32ARGBColor = 0xaarrggbb -type int32ARGBColor = number; +export type int32ARGBColor = number; export interface FillProps { fill?: int32ARGBColor | rgbaArray | string; @@ -110,7 +112,7 @@ export interface ClipProps { clipPath?: string; } -interface VectorEffectProps { +export interface VectorEffectProps { vectorEffect?: | 'none' | 'non-scaling-stroke' @@ -147,7 +149,9 @@ export interface FontObject { letterSpacing?: NumberProp; wordSpacing?: NumberProp; kerning?: NumberProp; - fontVariantLigatures?: FontVariantLigatures; + fontFeatureSettings?: string; + fontVariantLigatures?: string; + fontVariationSettings?: string; } export interface FontProps extends FontObject { @@ -155,22 +159,21 @@ export interface FontProps extends FontObject { } export interface TransformObject { - scale?: NumberProp; - scaleX?: NumberProp; - scaleY?: NumberProp; - rotate?: NumberProp; - rotation?: NumberProp; - translate?: NumberProp; + translate?: NumberArray; translateX?: NumberProp; translateY?: NumberProp; - x?: NumberProp; - y?: NumberProp; - origin?: NumberProp; + origin?: NumberArray; originX?: NumberProp; originY?: NumberProp; - skew?: NumberProp; + scale?: NumberArray; + scaleX?: NumberProp; + scaleY?: NumberProp; + skew?: NumberArray; skewX?: NumberProp; skewY?: NumberProp; + rotation?: NumberProp; + x?: NumberArray; + y?: NumberArray; } /* @@ -188,7 +191,14 @@ export interface TransformObject { ╚═ ═╝ */ -type ColumnMajorTransformMatrix = ReadonlyArray; +export type ColumnMajorTransformMatrix = [ + number, + number, + number, + number, + number, + number, +]; export interface TransformProps extends TransformObject { transform?: ColumnMajorTransformMatrix | string | TransformObject; @@ -360,8 +370,12 @@ export interface SymbolProps { export const Symbol: React.ComponentClass; export interface TSpanProps extends CommonPathProps, FontProps { - dx?: NumberProp; - dy?: NumberProp; + x?: NumberArray; + y?: NumberArray; + dx?: NumberArray; + dy?: NumberArray; + rotate?: NumberArray; + inlineSize?: NumberProp; } export const TSpan: React.ComponentClass; @@ -376,9 +390,13 @@ export interface TextSpecificProps extends CommonPathProps, FontProps { } export interface TextProps extends TextSpecificProps { - dx?: NumberProp; - dy?: NumberProp; + x?: NumberArray; + y?: NumberArray; + dx?: NumberArray; + dy?: NumberArray; + rotate?: NumberArray; opacity?: NumberProp; + inlineSize?: NumberProp; } export const Text: React.ComponentClass; @@ -431,19 +449,19 @@ export interface AST { Tag: React.ComponentType; } -interface UriProps extends SvgProps { +export interface UriProps extends SvgProps { uri: string | null; override?: SvgProps; } export type UriState = { xml: string | null }; -interface XmlProps extends SvgProps { +export interface XmlProps extends SvgProps { xml: string | null; override?: SvgProps; } export type XmlState = { ast: AST | null }; -interface AstProps extends SvgProps { +export interface AstProps extends SvgProps { ast: AST | null; override?: SvgProps; } diff --git a/src/lib/extract/extractText.tsx b/src/lib/extract/extractText.tsx index 51777313..e29bb9d3 100644 --- a/src/lib/extract/extractText.tsx +++ b/src/lib/extract/extractText.tsx @@ -1,7 +1,7 @@ import React, { Children, ComponentType } from 'react'; import extractLengthList from './extractLengthList'; import { pickNotNil } from '../util'; -import { NumberProp } from './types'; +import { NumberArray, NumberProp } from './types'; const fontRegExp = /^\s*((?:(?:normal|bold|italic)\s+)*)(?:(\d+(?:\.\d+)?(?:%|px|em|pt|pc|mm|cm|in]))*(?:\s*\/.*?)?\s+)?\s*"?([^"]*)/i; const fontFamilyPrefix = /^[\s"']*/; @@ -126,15 +126,15 @@ function getChild(child: undefined | string | number | ComponentType) { } export type TextProps = { - x?: NumberProp; - y?: NumberProp; - dx?: NumberProp; - dy?: NumberProp; - rotate?: NumberProp; + x?: NumberArray; + y?: NumberArray; + dx?: NumberArray; + dy?: NumberArray; + rotate?: NumberArray; children?: string | number | (string | number | ComponentType)[]; inlineSize?: NumberProp; baselineShift?: NumberProp; - verticalAlign?: string; + verticalAlign?: NumberProp; alignmentBaseline?: string; } & fontProps; diff --git a/src/lib/extract/extractTransform.ts b/src/lib/extract/extractTransform.ts index 3a2ccfbc..ab6ccdc9 100644 --- a/src/lib/extract/extractTransform.ts +++ b/src/lib/extract/extractTransform.ts @@ -87,7 +87,16 @@ export function props2transform(props: TransformProps): TransformedProps { y, } = props; - const tr = universal2axis(translate, translateX || x, translateY || y); + if (Array.isArray(x) || Array.isArray(y)) { + console.warn( + 'Passing SvgLengthList to x or y attribute where SvgLength expected', + ); + } + const tr = universal2axis( + translate, + translateX || (Array.isArray(x) ? x[0] : x), + translateY || (Array.isArray(y) ? y[0] : y), + ); const or = universal2axis(origin, originX, originY); const sc = universal2axis(scale, scaleX, scaleY, 1); const sk = universal2axis(skew, skewX, skewY); diff --git a/src/lib/extract/types.ts b/src/lib/extract/types.ts index 87e54761..97e69992 100644 --- a/src/lib/extract/types.ts +++ b/src/lib/extract/types.ts @@ -20,21 +20,21 @@ export type VectorEffect = | 'uri'; export interface TransformProps { - translate?: NumberProp; + translate?: NumberArray; translateX?: NumberProp; translateY?: NumberProp; - origin?: NumberProp; + origin?: NumberArray; originX?: NumberProp; originY?: NumberProp; - scale?: NumberProp; + scale?: NumberArray; scaleX?: NumberProp; scaleY?: NumberProp; - skew?: NumberProp; + skew?: NumberArray; skewX?: NumberProp; skewY?: NumberProp; rotation?: NumberProp; - x?: NumberProp; - y?: NumberProp; + x?: NumberArray; + y?: NumberArray; transform?: number[] | string | TransformProps | void | undefined; }