xref: /expo/packages/expo-maps/src/Polygon.ts (revision ee0de234) 
1import React from 'react';
2
3import { Point, PatternItem } from './Common.types';
4
5/**
6 * Props of Polygon component of Expo Maps library.
7 */
8export type PolygonProps = {
9  /**
10   * Array of polygon's vertices.
11   *
12   * The polygon is closed automatically, so there is no need to repeat the first vertex at the end.
13   *
14   * If empty, the polygon will be invisible, but logically it will be registered on the host map.
15   * @required
16   */
17  points: Point[];
18  /**
19   * Color of the polygon's interior (optional).
20   *
21   * Accepted formats:
22   * * `'#RRGGBB'`
23   * * `'#RRGGBBAA'`
24   * * `'#RGB'`
25   * * `'#RGBA'`
26   * * 'red'
27   * * 'blue'
28   * * 'green'
29   * * 'black'
30   * * 'white'
31   * * 'gray'
32   * * 'cyan'
33   * * 'magenta'
34   * * 'yellow'
35   * * 'lightgray'
36   * * 'darkgray'
37   * * 'grey'
38   * * 'aqua'
39   * * 'fuchsia'
40   * * 'lime'
41   * * 'maroon'
42   * * 'navy'
43   * * 'olive'
44   * * 'purple'
45   * * 'silver'
46   * * 'teal'
47   * @default transparent
48   */
49  fillColor?: string;
50  /**
51   * Color of the polygon's edge line (optional).
52   *
53   * Accepted formats:
54   * * `'#RRGGBB'`
55   * * `'#RRGGBBAA'`
56   * * `'#RGB'`
57   * * `'#RGBA'`
58   * * 'red'
59   * * 'blue'
60   * * 'green'
61   * * 'black'
62   * * 'white'
63   * * 'gray'
64   * * 'cyan'
65   * * 'magenta'
66   * * 'yellow'
67   * * 'lightgray'
68   * * 'darkgray'
69   * * 'grey'
70   * * 'aqua'
71   * * 'fuchsia'
72   * * 'lime'
73   * * 'maroon'
74   * * 'navy'
75   * * 'olive'
76   * * 'purple'
77   * * 'silver'
78   * * 'teal'
79   * @default 'black'
80   */
81  strokeColor?: string;
82  /**
83   * Width of the polygon's edge line (optional).
84   * @default 1.0
85   */
86  strokeWidth?: number;
87  /**
88   * Array of objects of type PatternItem, specifying the pattern of the polygon's edge line (optional).
89   *
90   * * Unprovided will imply a solid line.
91   * * Empty array will imply no visible line.
92   * * Otherwise line pattern starts with first provided element and repeats.
93   *
94   * For detailed info see {@link PatternItem}
95   */
96  strokePattern?: PatternItem[];
97  /**
98   * Style of joints between polygon's line segments (optional).
99   * * `'bevel'` - beveled joints between line segments
100   * * `'miter'` - sharp joints between line segments
101   * * `'round'` - rounded joints between line segments
102   * @default 'miter'
103   */
104  jointType?: 'bevel' | 'miter' | 'round';
105};
106
107/**
108 * Internal JSON object for representing polygons in Expo Maps library.
109 *
110 * See {@link PolygonProps} for more detail.
111 */
112export type PolygonObject = PolygonProps & {
113  type: 'polygon';
114};
115
116/**
117 * Polygon component of Expo Maps library.
118 *
119 * Draws customizable polygon on ExpoMap.
120 * This component should be ExpoMap component child to work properly.
121 *
122 * See {@link PolygonProps} to learn more about props.
123 */
124export class Polygon extends React.Component<PolygonProps> {
125  render() {
126    return null;
127  }
128}
129