mirror of
https://github.com/zoriya/react-native-svg.git
synced 2026-06-07 08:45:00 +00:00
Add exports for prop types, additional type fixes.
Also: - Extracts and exports the string enum types - Adds or renames prop types such that every `Foo` component export also has a `FooProps` - Adds non-default export of `Svg`, so `import * as Svg ...` is usable. - Makes `RadialGradientProps.gradientUnits` optional, like for `LinearGradientProps.gradientUnits`. - Adds stronger type for `TransformProps.transform` based on code in `extractTranform.js` (please double-check!) - Fixes typo in `DefinationProps` name. - A handful of minor formatting normalizations.
This commit is contained in:
Vendored
+63
-47
@@ -4,7 +4,13 @@ import * as ReactNative from 'react-native';
|
|||||||
// Common props
|
// Common props
|
||||||
type NumberProp = string | number;
|
type NumberProp = string | number;
|
||||||
|
|
||||||
interface TouchableProps {
|
export type FillRule = 'evenodd' | 'nonzero';
|
||||||
|
export type Units = 'userSpaceOnUse' | 'objectBoundingBox';
|
||||||
|
export type TextAnchor = 'start' | 'middle' | 'end';
|
||||||
|
export type Linecap = 'butt' | 'square' | 'round';
|
||||||
|
export type Linejoin = 'miter' | 'bevel' | 'round';
|
||||||
|
|
||||||
|
export interface TouchableProps {
|
||||||
disabled?: boolean,
|
disabled?: boolean,
|
||||||
onPress?: (event: any) => any,
|
onPress?: (event: any) => any,
|
||||||
onPressIn?: (event: any) => any,
|
onPressIn?: (event: any) => any,
|
||||||
@@ -15,37 +21,37 @@ interface TouchableProps {
|
|||||||
delayLongPress?: number
|
delayLongPress?: number
|
||||||
}
|
}
|
||||||
|
|
||||||
interface ResponderProps extends ReactNative.GestureResponderHandlers {
|
export interface ResponderProps extends ReactNative.GestureResponderHandlers {
|
||||||
pointerEvents?: (event: any) => any,
|
pointerEvents?: (event: any) => any,
|
||||||
}
|
}
|
||||||
|
|
||||||
interface FillProps {
|
export interface FillProps {
|
||||||
fill?: string,
|
fill?: string,
|
||||||
fillOpacity?: NumberProp,
|
fillOpacity?: NumberProp,
|
||||||
fillRule?: 'evenodd' | 'nonzero',
|
fillRule?: FillRule,
|
||||||
}
|
}
|
||||||
|
|
||||||
interface ClipProps {
|
export interface ClipProps {
|
||||||
clipRule?: 'evenodd' | 'nonzero',
|
clipRule?: FillRule,
|
||||||
clipPath?: string
|
clipPath?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
interface DefinationProps {
|
export interface DefinitionProps {
|
||||||
name?: string,
|
name?: string,
|
||||||
}
|
}
|
||||||
|
|
||||||
interface StrokeProps {
|
export interface StrokeProps {
|
||||||
stroke?: string,
|
stroke?: string,
|
||||||
strokeWidth?: NumberProp,
|
strokeWidth?: NumberProp,
|
||||||
strokeOpacity?: NumberProp,
|
strokeOpacity?: NumberProp,
|
||||||
strokeDasharray?: number[] | string,
|
strokeDasharray?: number[] | string,
|
||||||
strokeDashoffset?: NumberProp,
|
strokeDashoffset?: NumberProp,
|
||||||
strokeLinecap?: 'butt' | 'square' | 'round',
|
strokeLinecap?: Linecap,
|
||||||
strokeLinejoin?: 'miter' | 'bevel' | 'round',
|
strokeLinejoin?: Linejoin,
|
||||||
strokeMiterlimit?: NumberProp,
|
strokeMiterlimit?: NumberProp,
|
||||||
}
|
}
|
||||||
|
|
||||||
interface FontProps {
|
export interface FontProps {
|
||||||
fontFamily?: string,
|
fontFamily?: string,
|
||||||
fontSize?: NumberProp,
|
fontSize?: NumberProp,
|
||||||
fontWeight?: NumberProp,
|
fontWeight?: NumberProp,
|
||||||
@@ -53,7 +59,7 @@ interface FontProps {
|
|||||||
font?: object
|
font?: object
|
||||||
}
|
}
|
||||||
|
|
||||||
interface TransformProps {
|
export interface TransformObject {
|
||||||
scale?: NumberProp,
|
scale?: NumberProp,
|
||||||
scaleX?: NumberProp,
|
scaleX?: NumberProp,
|
||||||
scaleY?: NumberProp,
|
scaleY?: NumberProp,
|
||||||
@@ -70,28 +76,31 @@ interface TransformProps {
|
|||||||
skew?: NumberProp,
|
skew?: NumberProp,
|
||||||
skewX?: NumberProp,
|
skewX?: NumberProp,
|
||||||
skewY?: NumberProp,
|
skewY?: NumberProp,
|
||||||
transform?: object,
|
|
||||||
}
|
}
|
||||||
|
|
||||||
interface PathProps extends FillProps, StrokeProps, ClipProps, TransformProps, ResponderProps, TouchableProps, DefinationProps {}
|
export interface TransformProps extends TransformObject {
|
||||||
|
transform?: string | TransformObject,
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface CommonPathProps extends FillProps, StrokeProps, ClipProps, TransformProps, ResponderProps, TouchableProps, DefinitionProps {}
|
||||||
|
|
||||||
|
|
||||||
// Element props
|
// Element props
|
||||||
interface CircleProps extends PathProps {
|
export interface CircleProps extends CommonPathProps {
|
||||||
cx?: NumberProp,
|
cx?: NumberProp,
|
||||||
cy?: NumberProp,
|
cy?: NumberProp,
|
||||||
r?: NumberProp,
|
r?: NumberProp,
|
||||||
}
|
}
|
||||||
export const Circle: React.ComponentClass<CircleProps>;
|
export const Circle: React.ComponentClass<CircleProps>;
|
||||||
|
|
||||||
interface ClipPathProps {
|
export interface ClipPathProps {
|
||||||
id: string,
|
id: string,
|
||||||
}
|
}
|
||||||
export const ClipPath: React.ComponentClass<ClipPathProps>;
|
export const ClipPath: React.ComponentClass<ClipPathProps>;
|
||||||
|
|
||||||
export const Defs: React.ComponentClass<{}>;
|
export const Defs: React.ComponentClass<{}>;
|
||||||
|
|
||||||
interface EllipseProps extends PathProps {
|
export interface EllipseProps extends CommonPathProps {
|
||||||
cx?: NumberProp,
|
cx?: NumberProp,
|
||||||
cy?: NumberProp,
|
cy?: NumberProp,
|
||||||
rx?: NumberProp,
|
rx?: NumberProp,
|
||||||
@@ -99,19 +108,23 @@ interface EllipseProps extends PathProps {
|
|||||||
}
|
}
|
||||||
export const Ellipse: React.ComponentClass<EllipseProps>;
|
export const Ellipse: React.ComponentClass<EllipseProps>;
|
||||||
|
|
||||||
export const G: React.ComponentClass<PathProps>;
|
export interface GProps extends CommonPathProps {
|
||||||
|
}
|
||||||
|
export const G: React.ComponentClass<GProps>;
|
||||||
|
|
||||||
interface ImageProps extends ResponderProps, TouchableProps {
|
export type ImageHref = ReactNative.ImageURISource | ReactNative.ImageURISource[] | ReactNative.ImageRequireSource;
|
||||||
|
|
||||||
|
export interface ImageProps extends ResponderProps, TouchableProps {
|
||||||
x?: NumberProp,
|
x?: NumberProp,
|
||||||
y?: NumberProp,
|
y?: NumberProp,
|
||||||
width?: NumberProp,
|
width?: NumberProp,
|
||||||
height?: NumberProp,
|
height?: NumberProp,
|
||||||
href: ReactNative.ImageURISource | ReactNative.ImageURISource[] | ReactNative.ImageRequireSource,
|
href: ImageHref,
|
||||||
preserveAspectRatio?: string,
|
preserveAspectRatio?: string,
|
||||||
}
|
}
|
||||||
export const Image: React.ComponentClass<ImageProps>;
|
export const Image: React.ComponentClass<ImageProps>;
|
||||||
|
|
||||||
interface LineProps extends PathProps {
|
export interface LineProps extends CommonPathProps {
|
||||||
x1?: NumberProp,
|
x1?: NumberProp,
|
||||||
x2?: NumberProp,
|
x2?: NumberProp,
|
||||||
y1?: NumberProp,
|
y1?: NumberProp,
|
||||||
@@ -119,43 +132,43 @@ interface LineProps extends PathProps {
|
|||||||
}
|
}
|
||||||
export const Line: React.ComponentClass<LineProps>;
|
export const Line: React.ComponentClass<LineProps>;
|
||||||
|
|
||||||
interface LinearGradientProps {
|
export interface LinearGradientProps {
|
||||||
x1?: NumberProp,
|
x1?: NumberProp,
|
||||||
x2?: NumberProp,
|
x2?: NumberProp,
|
||||||
y1?: NumberProp,
|
y1?: NumberProp,
|
||||||
y2?: NumberProp,
|
y2?: NumberProp,
|
||||||
gradientUnits?: 'objectBoundingBox' | 'userSpaceOnUse',
|
gradientUnits?: Units,
|
||||||
id: string,
|
id: string,
|
||||||
}
|
}
|
||||||
export const LinearGradient: React.ComponentClass<LinearGradientProps>;
|
export const LinearGradient: React.ComponentClass<LinearGradientProps>;
|
||||||
|
|
||||||
interface PathElementProps extends PathProps {
|
export interface PathProps extends CommonPathProps {
|
||||||
d: string,
|
d: string,
|
||||||
}
|
}
|
||||||
export const Path: React.ComponentClass<PathElementProps>;
|
export const Path: React.ComponentClass<PathProps>;
|
||||||
|
|
||||||
interface PatternProps {
|
export interface PatternProps {
|
||||||
x1?: NumberProp,
|
x1?: NumberProp,
|
||||||
x2?: NumberProp,
|
x2?: NumberProp,
|
||||||
y1?: NumberProp,
|
y1?: NumberProp,
|
||||||
y2?: NumberProp,
|
y2?: NumberProp,
|
||||||
patternTransform?: string,
|
patternTransform?: string,
|
||||||
patternUnits?: 'userSpaceOnUse' | 'objectBoundingBox',
|
patternUnits?: Units,
|
||||||
patternContentUnits?: 'userSpaceOnUse' | 'objectBoundingBox',
|
patternContentUnits?: Units,
|
||||||
}
|
}
|
||||||
export const Pattern: React.ComponentClass<PatternProps>;
|
export const Pattern: React.ComponentClass<PatternProps>;
|
||||||
|
|
||||||
interface PolygonProps extends PathProps {
|
export interface PolygonProps extends CommonPathProps {
|
||||||
points: string | any[],
|
points: string | any[],
|
||||||
}
|
}
|
||||||
export const Polygon: React.ComponentClass<PolygonProps>;
|
export const Polygon: React.ComponentClass<PolygonProps>;
|
||||||
|
|
||||||
interface PolylineProps extends PathProps {
|
export interface PolylineProps extends CommonPathProps {
|
||||||
points: string | any[],
|
points: string | any[],
|
||||||
}
|
}
|
||||||
export const Polyline: React.ComponentClass<PolylineProps>;
|
export const Polyline: React.ComponentClass<PolylineProps>;
|
||||||
|
|
||||||
interface RadialGradientProps {
|
export interface RadialGradientProps {
|
||||||
fx?: NumberProp,
|
fx?: NumberProp,
|
||||||
fy?: NumberProp,
|
fy?: NumberProp,
|
||||||
rx?: NumberProp,
|
rx?: NumberProp,
|
||||||
@@ -163,70 +176,73 @@ interface RadialGradientProps {
|
|||||||
cx?: NumberProp,
|
cx?: NumberProp,
|
||||||
cy?: NumberProp,
|
cy?: NumberProp,
|
||||||
r?: NumberProp,
|
r?: NumberProp,
|
||||||
gradientUnits: 'objectBoundingBox' | 'userSpaceOnUse',
|
gradientUnits?: Units,
|
||||||
id: string,
|
id: string,
|
||||||
}
|
}
|
||||||
export const RadialGradient: React.ComponentClass<RadialGradientProps>;
|
export const RadialGradient: React.ComponentClass<RadialGradientProps>;
|
||||||
|
|
||||||
interface RectProps extends PathProps {
|
export interface RectProps extends CommonPathProps {
|
||||||
x?: NumberProp,
|
x?: NumberProp,
|
||||||
y?: NumberProp,
|
y?: NumberProp,
|
||||||
width?: NumberProp,
|
width?: NumberProp,
|
||||||
height?: NumberProp,
|
height?: NumberProp,
|
||||||
rx?: NumberProp,
|
rx?: NumberProp,
|
||||||
ry?: NumberProp,
|
ry?: NumberProp,
|
||||||
class? : string
|
class?: string,
|
||||||
}
|
}
|
||||||
export const Rect: React.ComponentClass<RectProps>;
|
export const Rect: React.ComponentClass<RectProps>;
|
||||||
|
|
||||||
export const Shape: React.ComponentClass<{}>;
|
export interface ShapeProps {
|
||||||
|
}
|
||||||
|
export const Shape: React.ComponentClass<ShapeProps>;
|
||||||
|
|
||||||
interface StopProps {
|
export interface StopProps {
|
||||||
stopColor?: string,
|
stopColor?: string,
|
||||||
stopOpacity?: NumberProp,
|
stopOpacity?: NumberProp,
|
||||||
offset?: string
|
offset?: string,
|
||||||
}
|
}
|
||||||
export const Stop: React.ComponentClass<StopProps>;
|
export const Stop: React.ComponentClass<StopProps>;
|
||||||
|
|
||||||
interface SvgProps extends ReactNative.ViewProperties {
|
export interface SvgProps extends ReactNative.ViewProperties {
|
||||||
opacity?: NumberProp,
|
opacity?: NumberProp,
|
||||||
width?: NumberProp,
|
width?: NumberProp,
|
||||||
height?: NumberProp,
|
height?: NumberProp,
|
||||||
viewBox?: string,
|
viewBox?: string,
|
||||||
preserveAspectRatio?: string
|
preserveAspectRatio?: string,
|
||||||
}
|
}
|
||||||
|
|
||||||
declare const Svg: React.ComponentClass<SvgProps>;
|
// Svg is both regular and default exported
|
||||||
|
export const Svg: React.ComponentClass<SvgProps>;
|
||||||
export default Svg;
|
export default Svg;
|
||||||
|
|
||||||
interface SymbolsProps {
|
export interface SymbolsProps {
|
||||||
id: string,
|
id: string,
|
||||||
viewBox?: string,
|
viewBox?: string,
|
||||||
preserveAspectRatio?: string,
|
preserveAspectRatio?: string,
|
||||||
}
|
}
|
||||||
export const Symbols: React.ComponentClass<SymbolsProps>;
|
export const Symbols: React.ComponentClass<SymbolsProps>;
|
||||||
|
|
||||||
interface TSpanProps extends PathProps, FontProps {
|
export interface TSpanProps extends CommonPathProps, FontProps {
|
||||||
dx?: NumberProp,
|
dx?: NumberProp,
|
||||||
dy?: NumberProp,
|
dy?: NumberProp,
|
||||||
textAnchor?: 'start' | 'middle' | 'end',
|
textAnchor?: TextAnchor,
|
||||||
}
|
}
|
||||||
export const TSpan: React.ComponentClass<TSpanProps>;
|
export const TSpan: React.ComponentClass<TSpanProps>;
|
||||||
|
|
||||||
interface TextProps extends PathProps, FontProps {
|
export interface TextProps extends CommonPathProps, FontProps {
|
||||||
dx?: NumberProp,
|
dx?: NumberProp,
|
||||||
dy?: NumberProp,
|
dy?: NumberProp,
|
||||||
textAnchor?: 'start' | 'middle' | 'end',
|
textAnchor?: TextAnchor,
|
||||||
}
|
}
|
||||||
export const Text: React.ComponentClass<TextProps>;
|
export const Text: React.ComponentClass<TextProps>;
|
||||||
|
|
||||||
interface TextPathProps extends PathProps, FontProps {
|
export interface TextPathProps extends CommonPathProps, FontProps {
|
||||||
href: string,
|
href: string,
|
||||||
startOffset?: NumberProp,
|
startOffset?: NumberProp,
|
||||||
}
|
}
|
||||||
export const TextPath: React.ComponentClass<TextPathProps>;
|
export const TextPath: React.ComponentClass<TextPathProps>;
|
||||||
|
|
||||||
interface UseProps extends PathProps {
|
export interface UseProps extends CommonPathProps {
|
||||||
href: string,
|
href: string,
|
||||||
width?: NumberProp,
|
width?: NumberProp,
|
||||||
height?: NumberProp,
|
height?: NumberProp,
|
||||||
|
|||||||
Reference in New Issue
Block a user