API

Index

Enumerations

• DimensionType

• ImageScaleType

• MouseButton

• PointerAction

• RequiredViewChanges

• TextAlign

• TextBaseline

• Visibility

Classes

• AreaSelectGestureDetector

• CanvasPointerEvent

• Context

• DragGestureDetector

• GestureDetector

• ImageView

• LayoutParams

• Line

• NoContext

• Paint

• Point

• Rect

• RootCanvasView

• ScaleGestureDetector

• TextView

• View

• ViewCanvas

Interfaces

• AreaSelectEvent

• AreaSelectGestureDetectorOptions

• Canvas

• CanvasCreatorOptions

• CanvasPointer

• Color

• ContextLike

• ContextOptions

• Dependency

• Dimension

• DragEvent

• DragGestureDetectorOptions

• Font

• ImageViewProps

• LayoutAbsolutePositionProps

• LayoutProps

• LayoutRelativePositionProps

• LayoutSizeProps

• LayoutStandardProps

• Offset

• OrderedChildren

• PaintOverrides

• PointerPosition

• Radius

• RectObjectInput

• ScaleEvent

• ScaleGestureDetectorOptions

• ScaleGestureProps

• TextViewProps

• ViewLike

• ViewProps

Type aliases

• CanvasCreator

• DeepReadonly

• DeepReadonlyObject

• DimensionInput

• FontStyle

• FontVariant

• FontWeight

• Id

• ImageClass

• OnAreaSelectListener

• OnDragListener

• OnScaleListener

• Primitive

• RadiusInput

• RectInput

• RectLike

• SupportedDomPointerEvent

Variables

• DEBUG_POINTER_EVENTS

• DEFAULT_POINTER_COUNT

• MATCH_PARENT

• PARENT_ID

• WHEEL_SCROLL_SPAN

• WRAP_CONTENT

• colorRegex

• defaultImageClass

• defaultLayoutProps

• isBrowser

• supportedDomPointerEvents

Functions

• calcDimension

• createEventDispatcher

• createLayoutMap

• deepFreeze

• defaultCanvasCreator

• domEventToPointerAction

• existingNonParentDependency

• fillPointerEventData

• getBox

• getElementOffset

• horizontalLayoutDependencies

• isBright

• isChrome

• isMouseEvent

• isSafari

• isTouchEvent

• isWheelEvent

• logPointerEvent

• logScreenshot

• luminance

• mouseToPointer

• noContextError

• normalizeRadius

• parseColor

• parseDimension

• parseFont

• registerEventDispatcher

• removeDefaultProps

• removeEqualProps

• removeUndefinedProps

• resolveDimensionDependencies

• resolveLayoutParamsIds

• rgba

• roundCoordinate

• scaleImage

• touchToPointer

• verticalLayoutDependencies

• xor

Object literals

• DefaultProps

• defaultFont

• defaultPaintOptions

• zeroRadius

Type aliases

CanvasCreator

Ƭ CanvasCreator: function

Type declaration:

▸ (options: CanvasCreatorOptions): Canvas

Parameters:

Name	Type
options	CanvasCreatorOptions

---

DeepReadonly

Ƭ DeepReadonly: T extends Primitive ? T : DeepReadonlyObject‹T›

---

DeepReadonlyObject

Ƭ DeepReadonlyObject: object

Type declaration:

---

DimensionInput

Ƭ DimensionInput: string | number | undefined | null

---

FontStyle

Ƭ FontStyle: "normal" | "italic" | "oblique"

---

FontVariant

Ƭ FontVariant: "normal" | "small-caps"

---

FontWeight

Ƭ FontWeight: "normal" | "bold" | "bolder" | "lighter" | 100 | "100" | 200 | "200" | 300 | "300" | 400 | "400" | 500 | "500" | 600 | "600" | 700 | "700" | 800 | "800" | 900 | "900"

---

Id

Ƭ Id: number | string

---

ImageClass

Ƭ ImageClass: object

Type declaration:

---

OnAreaSelectListener

Ƭ OnAreaSelectListener: function

Type declaration:

▸ (areaSelectEvent: AreaSelectEvent): boolean

Parameters:

Name	Type
areaSelectEvent	AreaSelectEvent

---

OnDragListener

Ƭ OnDragListener: function

Type declaration:

▸ (dragEvent: DragEvent): boolean

Parameters:

Name	Type
dragEvent	DragEvent

---

OnScaleListener

Ƭ OnScaleListener: function

Type declaration:

▸ (scaleEvent: ScaleEvent): boolean

Parameters:

Name	Type
scaleEvent	ScaleEvent

---

Primitive

Ƭ Primitive: string | number | boolean | undefined | null

---

RadiusInput

Ƭ RadiusInput: number | Partial‹Radius› | null | undefined

---

RectInput

Ƭ RectInput: RectObjectInput | number

---

RectLike

Ƭ RectLike: Rect | RectInput

---

SupportedDomPointerEvent

Ƭ SupportedDomPointerEvent: MouseEvent | WheelEvent | TouchEvent

Variables

Const DEBUG_POINTER_EVENTS

• DEBUG_POINTER_EVENTS: false = false

---

Const DEFAULT_POINTER_COUNT

• DEFAULT_POINTER_COUNT: 1 = 1

---

Const MATCH_PARENT

• MATCH_PARENT: -1 = -1

---

Const PARENT_ID

• PARENT_ID: -1 = -1

---

Const WHEEL_SCROLL_SPAN

• WHEEL_SCROLL_SPAN: 100 = 100

---

Const WRAP_CONTENT

• WRAP_CONTENT: -2 = -2

---

Const colorRegex

• colorRegex: RegExp‹› = /^(?:#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2}))|(?:#([0-9a-f])([0-9a-f])([0-9a-f]))|(?:rgb((\d+),\s*(\d+),\s*(\d+)))|(?:rgba((\d+),\s*(\d+),\s*(\d+),\s*(\d*.?\d+)))$/i

---

Const defaultImageClass

• defaultImageClass: undefined | object = (() => { try { // Browsers default return Image; } catch { return undefined; } })()

---

Const defaultLayoutProps

• defaultLayoutProps: LayoutProps = new LayoutParams().asProps()

---

Const isBrowser

• isBrowser: false | requestAnimationFrame & requestAnimationFrame = typeof window !== 'undefined' && window.requestAnimationFrame

---

Const supportedDomPointerEvents

• supportedDomPointerEvents: ("touchmove" | "mousemove" | "mousedown" | "touchstart" | "mouseover" | "mouseenter" | "touchcancel" | "mouseout" | "mouseup" | "touchend" | "wheel")[] = [ 'touchmove', 'mousemove', 'mousedown', 'touchstart', 'mouseover', 'mouseenter', 'touchcancel', 'mouseout', 'mouseup', 'touchend', 'wheel', ]

Functions

Const calcDimension

▸ calcDimension(dimension: Dimension, parentDimension: number): undefined | number

Parameters:

Name	Type
dimension	Dimension
parentDimension	number

Returns: undefined | number

---

Const createEventDispatcher

▸ createEventDispatcher(view: View): EventListener

Parameters:

Name	Type
view	View

Returns: EventListener

---

createLayoutMap

▸ createLayoutMap‹K›(t: Record‹K, LayoutProps›): object

Type parameters:

▪ K: string

Parameters:

Name	Type
t	Record‹K, LayoutProps›

Returns: object

---

Const deepFreeze

▸ deepFreeze‹T›(object: T): DeepReadonly‹T›

Type parameters:

▪ T

Parameters:

Name	Type
object	T

Returns: DeepReadonly‹T›

---

Const defaultCanvasCreator

▸ defaultCanvasCreator(__namedParameters: object): HTMLCanvasElement

Parameters:

▪ __namedParameters: object

Name	Type
height	number
width	number

Returns: HTMLCanvasElement

---

Const domEventToPointerAction

▸ domEventToPointerAction(event: Event): PointerAction | undefined

Parameters:

Name	Type
event	Event

Returns: PointerAction | undefined

---

Const existingNonParentDependency

▸ existingNonParentDependency(id: undefined | Id): id is number

Parameters:

Name	Type
id	undefined | Id

Returns: id is number

---

Const fillPointerEventData

▸ fillPointerEventData(pointerEvent: CanvasPointerEvent, view: View, event: Event): void

Parameters:

Name	Type
pointerEvent	CanvasPointerEvent
view	View
event	Event

Returns: void

---

Const getBox

▸ getBox(width: number, height: number, scale: number): object

Parameters:

Name	Type
width	number
height	number
scale	number

Returns: object

• str: string = +

• style: string = font-size: 1px; padding: ${isSafari() ? height * scale / 2 : 0}px ${Math.floor(width * scale / 2)}px; color: transparent; line-height: ${height * scale}px;

---

Const getElementOffset

▸ getElementOffset(element: HTMLElement, offset: Offset): Offset

Parameters:

Name	Type
element	HTMLElement
offset	Offset

Returns: Offset

---

Const horizontalLayoutDependencies

▸ horizontalLayoutDependencies(lp: LayoutParams): number[]

Parameters:

Name	Type
lp	LayoutParams

Returns: number[]

---

Const isBright

▸ isBright(color: Color): boolean

Parameters:

Name	Type
color	Color

Returns: boolean

---

Const isChrome

▸ isChrome(): boolean

Returns: boolean

---

Const isMouseEvent

▸ isMouseEvent(event: Event): event is MouseEvent

Parameters:

Name	Type
event	Event

Returns: event is MouseEvent

---

Const isSafari

▸ isSafari(): boolean

Returns: boolean

---

Const isTouchEvent

▸ isTouchEvent(event: Event): event is TouchEvent

Parameters:

Name	Type
event	Event

Returns: event is TouchEvent

---

Const isWheelEvent

▸ isWheelEvent(event: Event): event is WheelEvent

Parameters:

Name	Type
event	Event

Returns: event is WheelEvent

---

Const logPointerEvent

▸ logPointerEvent(pointerEvent: CanvasPointerEvent): void

Parameters:

Name	Type
pointerEvent	CanvasPointerEvent

Returns: void

---

Const logScreenshot

▸ logScreenshot(view: View, scale: number): void

Parameters:

Name	Type	Default
view	View	-
scale	number	1

Returns: void

---

Const luminance

▸ luminance(c: Color): number

Parameters:

Name	Type
c	Color

Returns: number

---

Const mouseToPointer

▸ mouseToPointer(event: MouseEvent, offset: Offset, canvasPointer: CanvasPointer): void

Parameters:

Name	Type
event	MouseEvent
offset	Offset
canvasPointer	CanvasPointer

Returns: void

---

Const noContextError

▸ noContextError(): Error

Returns: Error

---

Const normalizeRadius

▸ normalizeRadius(radius: RadiusInput): Radius

Parameters:

Name	Type
radius	RadiusInput

Returns: Radius

---

Const parseColor

▸ parseColor(colorString: string | undefined): typeof colorString extends undefined ? undefined : Color | undefined

Parameters:

Name	Type
colorString	string | undefined

Returns: typeof colorString extends undefined ? undefined : Color | undefined

---

Const parseDimension

▸ parseDimension(value: DimensionInput): Dimension

Parameters:

Name	Type
value	DimensionInput

Returns: Dimension

---

Const parseFont

▸ parseFont(__namedParameters: object): string

Parameters:

▪ __namedParameters: object

Name	Type
fontFamily	string
fontSize	number
fontStyle	undefined | "normal" | "italic" | "oblique"
fontVariant	undefined | "normal" | "small-caps"
fontWeight	undefined | "normal" | "bold" | "bolder" | "lighter" | 100 | "100" | 200 | "200" | 300 | "300" | 400 | "400" | 500 | "500" | 600 | "600" | 700 | "700" | 800 | "800" | 900 | "900"

Returns: string

---

Const registerEventDispatcher

▸ registerEventDispatcher(element: Element, dispatcher: EventListener): (Anonymous function)

Parameters:

Name	Type
element	Element
dispatcher	EventListener

Returns: (Anonymous function)

---

Const removeDefaultProps

▸ removeDefaultProps(props: LayoutProps): any

Parameters:

Name	Type
props	LayoutProps

Returns: any

---

Const removeEqualProps

▸ removeEqualProps(object: any, defaultObject: any): any

Parameters:

Name	Type
object	any
defaultObject	any

Returns: any

---

Const removeUndefinedProps

▸ removeUndefinedProps(object: any): any

Parameters:

Name	Type
object	any

Returns: any

---

Const resolveDimensionDependencies

▸ resolveDimensionDependencies‹T›(children: T[], dependencySelector: function, context: Context): T[]

Type parameters:

▪ T: ViewLike

Parameters:

▪ children: T[]

▪ dependencySelector: function

▸ (lp: LayoutParams): number[]

Parameters:

Name	Type
lp	LayoutParams

▪ context: Context

Returns: T[]

---

Const resolveLayoutParamsIds

▸ resolveLayoutParamsIds(layoutParams: LayoutParams, context: Context): void

Parameters:

Name	Type
layoutParams	LayoutParams
context	Context

Returns: void

---

Const rgba

▸ rgba(color: string, alpha: number): string

Parameters:

Name	Type
color	string
alpha	number

Returns: string

---

Const roundCoordinate

▸ roundCoordinate(coordinate: number): number

Parameters:

Name	Type
coordinate	number

Returns: number

---

Const scaleImage

▸ scaleImage(scaleType: ImageScaleType, imageWidth: number, imageHeight: number, innerWidth: number, innerHeight: number, rect: Rect): Rect

Parameters:

Name	Type
scaleType	ImageScaleType
imageWidth	number
imageHeight	number
innerWidth	number
innerHeight	number
rect	Rect

Returns: Rect

---

Const touchToPointer

▸ touchToPointer(touch: Touch | null, offset: Offset, canvasPointer: CanvasPointer): void

Parameters:

Name	Type
touch	Touch | null
offset	Offset
canvasPointer	CanvasPointer

Returns: void

---

Const verticalLayoutDependencies

▸ verticalLayoutDependencies(lp: LayoutParams): number[]

Parameters:

Name	Type
lp	LayoutParams

Returns: number[]

---

Const xor

▸ xor(a: boolean, b: boolean): boolean

Parameters:

Name	Type
a	boolean
b	boolean

Returns: boolean

Object literals

Const DefaultProps

▪ DefaultProps: object

ABOVE

• ABOVE: undefined = undefined

ALIGN_BOTTOM

• ALIGN_BOTTOM: undefined = undefined

ALIGN_END

• ALIGN_END: undefined = undefined

ALIGN_START

• ALIGN_START: undefined = undefined

ALIGN_TOP

• ALIGN_TOP: undefined = undefined

BELOW

• BELOW: undefined = undefined

CENTER_HORIZONTAL

• CENTER_HORIZONTAL: boolean = false

CENTER_VERTICAL

• CENTER_VERTICAL: boolean = false

HEIGHT

• HEIGHT: number = WRAP_CONTENT

IS_ABSOLUTE

• IS_ABSOLUTE: boolean = false

IS_ANIMATED

• IS_ANIMATED: boolean = false

MARGIN

• MARGIN: Rect‹› = new Rect(0)

MAX_HEIGHT

• MAX_HEIGHT: number = Number.MAX_SAFE_INTEGER

MAX_WIDTH

• MAX_WIDTH: number = Number.MAX_SAFE_INTEGER

MIN_HEIGHT

• MIN_HEIGHT: number = 0

MIN_WIDTH

• MIN_WIDTH: number = 0

PADDING

• PADDING: Rect‹› = new Rect(0)

TO_END_OF

• TO_END_OF: undefined = undefined

TO_START_OF

• TO_START_OF: undefined = undefined

WIDTH

• WIDTH: number = WRAP_CONTENT

X

• X: number = 0

Y

• Y: number = 0

---

Const defaultFont

▪ defaultFont: object

fontFamily

• fontFamily: string = "Arial"

fontSize

• fontSize: number = 12

---

Const defaultPaintOptions

▪ defaultPaintOptions: object

font

• font: string = parseFont(defaultFont)

lineDash

• lineDash: never[] = []

lineRounding

• lineRounding: boolean = false

lineWidth

• lineWidth: number = 0

textAlign

• textAlign: TextAlign = 'left' as TextAlign

textBaseline

• textBaseline: TextBaseline = 'bottom' as TextBaseline

textDirection

• textDirection: CanvasDirection = 'ltr' as CanvasDirection

---

Const zeroRadius

▪ zeroRadius: object

bl

• bl: number = 0

br

• br: number = 0

tl

• tl: number = 0

tr

• tr: number = 0