composition.d.ts 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187
  1. import { Theme } from './theme';
  2. import { Coordinate } from './coordinate';
  3. import { Interaction } from './interaction';
  4. import { Transform } from './transform';
  5. import { Scale } from './scale';
  6. import { Data } from './data';
  7. import { LabelTransform } from './labelTransform';
  8. import { Closeable, Literal2Object, Padding } from './utils';
  9. import { AxisComponent, LegendComponent, ScrollbarComponent, SliderComponent, TitleComponent, TooltipComponent } from './component';
  10. import { AtheisticChanelTypes, Mark, PositionChannelTypes } from './mark';
  11. export type Composition = ViewComposition | GeoViewComposition | GeoPathComposition | SpaceLayerComposition | SpaceFlexComposition | RepeatMatrixComposition | FacetRectComposition | FacetCircleComposition | TimingKeyframeComposition;
  12. export type CompositionTypes = 'view' | 'getView' | 'geoPath' | 'spaceLayer' | 'spaceFlex' | 'facetRect' | 'facetCircle' | 'repeatMatrix' | 'timingKeyframe';
  13. export type ViewComposition = {
  14. type?: 'view';
  15. x?: number;
  16. y?: number;
  17. width?: number;
  18. height?: number;
  19. data?: Data;
  20. key?: string;
  21. class?: string;
  22. padding?: Padding;
  23. paddingLeft?: Padding;
  24. paddingRight?: Padding;
  25. paddingTop?: Padding;
  26. paddingBottom?: Padding;
  27. margin?: number;
  28. marginLeft?: number;
  29. marginBottom?: number;
  30. marginTop?: number;
  31. marginRight?: number;
  32. inset?: number;
  33. insetLeft?: number;
  34. insetTop?: number;
  35. insetBottom?: number;
  36. insetRight?: number;
  37. coordinate?: Coordinate;
  38. interaction?: Literal2Object<Interaction>;
  39. transform?: Transform[];
  40. theme?: Theme;
  41. children?: Mark[];
  42. scale?: Record<string, Scale>;
  43. frame?: boolean;
  44. labelTransform?: LabelTransform[];
  45. axis?: Closeable<Partial<Record<PositionChannelTypes, Closeable<AxisComponent>>>>;
  46. legend?: Closeable<Partial<Record<AtheisticChanelTypes, Closeable<LegendComponent>>>>;
  47. tooltip?: TooltipComponent;
  48. slider?: Closeable<Partial<Record<PositionChannelTypes, Closeable<SliderComponent>>>>;
  49. scrollbar?: Closeable<Partial<Record<PositionChannelTypes, Closeable<ScrollbarComponent>>>>;
  50. title?: string | TitleComponent;
  51. style?: Record<string, any>;
  52. clip?: boolean;
  53. };
  54. export type GeoViewComposition = Omit<ViewComposition, 'type'> & {
  55. type?: 'geoView';
  56. coordinate?: Record<string, any>;
  57. };
  58. export type GeoPathComposition = Omit<ViewComposition, 'type'> & {
  59. type?: 'geoPath';
  60. coordinate?: Record<string, any>;
  61. [key: string]: any;
  62. };
  63. export type SpaceLayerComposition = {
  64. type?: 'spaceLayer';
  65. key?: string;
  66. data?: any;
  67. children?: Node[];
  68. };
  69. export type SpaceFlexComposition = {
  70. type?: 'spaceFlex';
  71. key?: string;
  72. data?: Data;
  73. direction?: 'col' | 'row';
  74. ratio?: number[];
  75. padding?: Padding;
  76. children?: Node[];
  77. };
  78. export type FacetContext = {
  79. columnField?: string | number;
  80. columnIndex?: number;
  81. columnValue?: string | number;
  82. columnValuesLength?: number;
  83. rowField?: string | number;
  84. rowIndex?: number;
  85. rowValue?: string | number;
  86. rowValuesLength?: number;
  87. };
  88. export type FacetRectComposition = {
  89. type?: 'facetRect';
  90. transform?: Transform;
  91. data?: Data;
  92. padding?: Padding;
  93. paddingLeft?: Padding;
  94. paddingRight?: Padding;
  95. paddingTop?: Padding;
  96. paddingBottom?: Padding;
  97. margin?: number;
  98. marginLeft?: number;
  99. marginBottom?: number;
  100. marginTop?: number;
  101. marginRight?: number;
  102. key?: string;
  103. title?: string | TitleComponent;
  104. encode?: {
  105. x?: string;
  106. y?: string;
  107. };
  108. scale?: {
  109. x?: Scale;
  110. y?: Scale;
  111. color?: Scale;
  112. };
  113. shareData?: boolean;
  114. shareSize?: boolean;
  115. children?: Node[] | ((facet: FacetContext) => Node);
  116. axis?: Record<string, any> | boolean;
  117. legend?: Record<string, any> | boolean;
  118. };
  119. export type RepeatMatrixComposition = {
  120. type?: 'repeatMatrix';
  121. padding?: Padding;
  122. paddingLeft?: Padding;
  123. paddingRight?: Padding;
  124. paddingTop?: Padding;
  125. paddingBottom?: Padding;
  126. margin?: number;
  127. marginLeft?: number;
  128. marginBottom?: number;
  129. marginTop?: number;
  130. marginRight?: number;
  131. transform?: Transform;
  132. title?: string | TitleComponent;
  133. data?: Data;
  134. key?: string;
  135. encode?: {
  136. x?: string[] | string;
  137. y?: string[] | string;
  138. position?: string[];
  139. };
  140. scale?: {
  141. x?: Scale;
  142. y?: Scale;
  143. color?: Scale;
  144. };
  145. axis?: Record<string, any> | boolean;
  146. legend?: Record<string, any> | boolean;
  147. children?: Node[] | ((facet: FacetContext) => Node);
  148. };
  149. export type FacetCircleComposition = {
  150. type?: 'facetCircle';
  151. padding?: Padding;
  152. paddingLeft?: Padding;
  153. paddingRight?: Padding;
  154. paddingTop?: Padding;
  155. paddingBottom?: Padding;
  156. margin?: number;
  157. marginLeft?: number;
  158. marginBottom?: number;
  159. marginTop?: number;
  160. marginRight?: number;
  161. transform?: Transform;
  162. title?: string | TitleComponent;
  163. data?: Data;
  164. key?: string;
  165. encode?: {
  166. position?: string;
  167. };
  168. scale?: {
  169. x?: Scale;
  170. y?: Scale;
  171. color?: Scale;
  172. };
  173. children?: Node[] | ((facet: FacetContext) => Node);
  174. axis?: Record<string, any> | boolean;
  175. legend?: Record<string, any> | boolean;
  176. };
  177. export type TimingKeyframeComposition = {
  178. type?: 'timingKeyframe';
  179. duration?: number;
  180. key?: string;
  181. easing?: string;
  182. iterationCount?: 'infinite' | number;
  183. direction?: 'normal' | 'reverse' | 'alternate' | 'reverse-alternate';
  184. children?: Node[];
  185. };
  186. type Node = Mark | Composition;
  187. export {};