Flipboard / Flipboard/react-canvas

TypeScript definitions file

Open
#26 2 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
13.2k
Forks
909
PR merge metrics
No merged PRs in 30d

Description

I created a little typescript def file, it's based on https://github.com/fdecampredon/jsx-typescript/blob/jsx/typings/react.d.ts if anybody is interested.

``` typescript
declare module 'react-canvas' {
import React = require('react');

type Style = {
//Text Related props
color?: string;
fontFace?: FontFace;
fontSize?: number;
lineHeight?: number;
textAlign?: string

// Layer style
backgroundColor?: string;
borderColor?: string;
borderRedius?: number;
clipRect?: string;
zIndex?: number;
alpha?: number;
scale?: number;
translateX?: number;
translateY?: number;

///CSS Layout style

top?: number;
left?: number;
right?: number;
bottom?: number;

width?: number | string;
height?: number | string;

margin?: number;
marginLeft?: number;
marginRight?: number;
marginTop?: number;
marginBottom?: number;

padding?: number;
paddingLeft?: number;
paddingRight?: number;
paddingTop?: number;
paddingBottom?: number;

borderWidth?: number;
borderLeftWidth?: number;
borderRightWidth?: number;
borderTopWidth?: number;
borderBottomWidth?: number;

flexDirection?: string;
justifyContent?: string;
alignItems?: string;
alignSelf?: string;

flex?: number;
position?: string
}

type SurfaceProps = {
width: number;
height: number;
top: number;
left: number;

scale?: number;
enableCSSLayout?: boolean;
}

class Surface extends React.Component {}

type ComponentProps = {
style?:Style;

onTouchStart?: React.TouchEventHandler;
onTouchMove?: React.TouchEventHandler;
onTouchEnd?: React.TouchEventHandler;
onTouchCancel?: React.TouchEventHandler;
onClick?: React.MouseEventHandler
}

class Layer extends React.Component {}

class Group extends React.Component {}

class Text extends React.Component { }

type ImageProps = {
src: string;
style?:Style;
useBackingStore?: boolean;
fadeIn?: boolean;
fadeInDuration?: boolean;
}

class Image extends React.Component {}

class FontFace {
constructor(family: string, url?: string, attributes?: { style: string; weight: number});
static Default: FontFace;

private _fontFaceBrand: any;

public id: string;
public family: string;
public url: string;
public attributes: string;
}

type Measure = {
width: number;
height: number;
}

function measureText(text: string, width: number, fontFace: FontFace, fontSize: number, lineHeight: number): Measure;

type ListViewProps = {
style?: {};
numberOfItemsGetter: () => number;
itemHeightGetter: () => number;
itemGetter: () => Layer;
snapping?: boolean;
scrollingDeceleration?: number;
scrollingPenetrationAcceleration?: number;
onScroll?: React.EventHandler;
}

class ListView extends React.Component {

}
}
```

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.