@aquera/nile-visualization 0.2.0 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (170) hide show
  1. package/dist/src/index.d.ts +37 -1
  2. package/dist/src/index.js +19 -0
  3. package/dist/src/internal/chart-adapters.js +86 -0
  4. package/dist/src/internal/highcharts-provider.js +72 -0
  5. package/dist/src/internal/types/all-chart-config.type.d.ts +2 -4
  6. package/dist/src/internal/types/chart-area-config.type.d.ts +4 -0
  7. package/dist/src/internal/types/chart-area-negative-config.type.d.ts +13 -0
  8. package/dist/src/internal/types/chart-area-negative-config.type.js +2 -0
  9. package/dist/src/internal/types/chart-area-range-config.type.d.ts +12 -0
  10. package/dist/src/internal/types/chart-area-range-config.type.js +2 -0
  11. package/dist/src/internal/types/chart-area-spline-config.type.d.ts +13 -0
  12. package/dist/src/internal/types/chart-area-spline-config.type.js +2 -0
  13. package/dist/src/internal/types/chart-column-drilldown-config.type.d.ts +13 -0
  14. package/dist/src/internal/types/chart-column-drilldown-config.type.js +2 -0
  15. package/dist/src/internal/types/chart-column-pyramid-config.type.d.ts +11 -0
  16. package/dist/src/internal/types/chart-column-pyramid-config.type.js +2 -0
  17. package/dist/src/internal/types/chart-column-range-config.type.d.ts +12 -0
  18. package/dist/src/internal/types/chart-column-range-config.type.js +2 -0
  19. package/dist/src/internal/types/chart-config.type.d.ts +3 -2
  20. package/dist/src/internal/types/chart-donut-config.type.d.ts +2 -0
  21. package/dist/src/internal/types/chart-dumbbell-lower-config.type.d.ts +5 -0
  22. package/dist/src/internal/types/chart-dumbbell-lower-config.type.js +2 -0
  23. package/dist/src/internal/types/chart-dumbbell-upper-config.type.d.ts +5 -0
  24. package/dist/src/internal/types/chart-dumbbell-upper-config.type.js +2 -0
  25. package/dist/src/internal/types/chart-euler-config.type.d.ts +10 -0
  26. package/dist/src/internal/types/chart-euler-config.type.js +2 -0
  27. package/dist/src/internal/types/chart-heatmap-config.type.d.ts +19 -0
  28. package/dist/src/internal/types/chart-heatmap-config.type.js +2 -0
  29. package/dist/src/internal/types/chart-line-column-config.type.d.ts +14 -0
  30. package/dist/src/internal/types/chart-line-column-config.type.js +2 -0
  31. package/dist/src/internal/types/chart-lollipop-config.type.d.ts +11 -0
  32. package/dist/src/internal/types/chart-lollipop-config.type.js +2 -0
  33. package/dist/src/internal/types/chart-organization-config.type.d.ts +13 -0
  34. package/dist/src/internal/types/chart-organization-config.type.js +2 -0
  35. package/dist/src/internal/types/chart-polygon-config.type.d.ts +12 -0
  36. package/dist/src/internal/types/chart-polygon-config.type.js +2 -0
  37. package/dist/src/internal/types/chart-radial-bar-config.type.d.ts +16 -0
  38. package/dist/src/internal/types/chart-radial-bar-config.type.js +2 -0
  39. package/dist/src/internal/types/chart-variable-pie-config.type.d.ts +13 -0
  40. package/dist/src/internal/types/chart-variable-pie-config.type.js +2 -0
  41. package/dist/src/internal/types/chart-vector-config.type.d.ts +13 -0
  42. package/dist/src/internal/types/chart-vector-config.type.js +2 -0
  43. package/dist/src/internal/types/chart-xrange-config.type.d.ts +13 -0
  44. package/dist/src/internal/types/chart-xrange-config.type.js +2 -0
  45. package/dist/src/internal/types/index.d.ts +19 -1
  46. package/dist/src/internal/types/primitive-chart-config.type.d.ts +20 -1
  47. package/dist/src/nile-area-negative-chart/index.d.ts +2 -0
  48. package/dist/src/nile-area-negative-chart/index.js +2 -0
  49. package/dist/src/nile-area-negative-chart/nile-area-negative-chart.css.d.ts +1 -0
  50. package/dist/src/nile-area-negative-chart/nile-area-negative-chart.css.js +28 -0
  51. package/dist/src/nile-area-negative-chart/nile-area-negative-chart.d.ts +42 -0
  52. package/dist/src/nile-area-negative-chart/nile-area-negative-chart.js +178 -0
  53. package/dist/src/nile-area-range-chart/index.d.ts +2 -0
  54. package/dist/src/nile-area-range-chart/index.js +2 -0
  55. package/dist/src/nile-area-range-chart/nile-area-range-chart.css.d.ts +1 -0
  56. package/dist/src/nile-area-range-chart/nile-area-range-chart.css.js +28 -0
  57. package/dist/src/nile-area-range-chart/nile-area-range-chart.d.ts +41 -0
  58. package/dist/src/nile-area-range-chart/nile-area-range-chart.js +173 -0
  59. package/dist/src/nile-area-spline-chart/index.d.ts +2 -0
  60. package/dist/src/nile-area-spline-chart/index.js +2 -0
  61. package/dist/src/nile-area-spline-chart/nile-area-spline-chart.css.d.ts +1 -0
  62. package/dist/src/nile-area-spline-chart/nile-area-spline-chart.css.js +28 -0
  63. package/dist/src/nile-area-spline-chart/nile-area-spline-chart.d.ts +41 -0
  64. package/dist/src/nile-area-spline-chart/nile-area-spline-chart.js +174 -0
  65. package/dist/src/nile-bellcurve-chart/nile-bellcurve-chart.js +3 -1
  66. package/dist/src/nile-chart/index.d.ts +1 -1
  67. package/dist/src/nile-chart/nile-chart-config.d.ts +36 -96
  68. package/dist/src/nile-chart/nile-chart.css.js +1 -1
  69. package/dist/src/nile-chart/nile-chart.d.ts +36 -0
  70. package/dist/src/nile-chart/nile-chart.js +412 -5
  71. package/dist/src/nile-column-drilldown-chart/index.d.ts +2 -0
  72. package/dist/src/nile-column-drilldown-chart/index.js +2 -0
  73. package/dist/src/nile-column-drilldown-chart/nile-column-drilldown-chart.css.d.ts +1 -0
  74. package/dist/src/nile-column-drilldown-chart/nile-column-drilldown-chart.css.js +28 -0
  75. package/dist/src/nile-column-drilldown-chart/nile-column-drilldown-chart.d.ts +49 -0
  76. package/dist/src/nile-column-drilldown-chart/nile-column-drilldown-chart.js +186 -0
  77. package/dist/src/nile-column-pyramid-chart/index.d.ts +2 -0
  78. package/dist/src/nile-column-pyramid-chart/index.js +2 -0
  79. package/dist/src/nile-column-pyramid-chart/nile-column-pyramid-chart.css.d.ts +1 -0
  80. package/dist/src/nile-column-pyramid-chart/nile-column-pyramid-chart.css.js +28 -0
  81. package/dist/src/nile-column-pyramid-chart/nile-column-pyramid-chart.d.ts +39 -0
  82. package/dist/src/nile-column-pyramid-chart/nile-column-pyramid-chart.js +155 -0
  83. package/dist/src/nile-column-range-chart/index.d.ts +2 -0
  84. package/dist/src/nile-column-range-chart/index.js +2 -0
  85. package/dist/src/nile-column-range-chart/nile-column-range-chart.css.d.ts +1 -0
  86. package/dist/src/nile-column-range-chart/nile-column-range-chart.css.js +28 -0
  87. package/dist/src/nile-column-range-chart/nile-column-range-chart.d.ts +40 -0
  88. package/dist/src/nile-column-range-chart/nile-column-range-chart.js +169 -0
  89. package/dist/src/nile-donut-chart/nile-donut-chart.d.ts +2 -0
  90. package/dist/src/nile-donut-chart/nile-donut-chart.js +16 -1
  91. package/dist/src/nile-dumbbell-lower-chart/index.d.ts +1 -0
  92. package/dist/src/nile-dumbbell-lower-chart/index.js +2 -0
  93. package/dist/src/nile-dumbbell-lower-chart/nile-dumbbell-lower-chart.css.d.ts +1 -0
  94. package/dist/src/nile-dumbbell-lower-chart/nile-dumbbell-lower-chart.css.js +28 -0
  95. package/dist/src/nile-dumbbell-lower-chart/nile-dumbbell-lower-chart.d.ts +40 -0
  96. package/dist/src/nile-dumbbell-lower-chart/nile-dumbbell-lower-chart.js +214 -0
  97. package/dist/src/nile-dumbbell-upper-chart/index.d.ts +1 -0
  98. package/dist/src/nile-dumbbell-upper-chart/index.js +2 -0
  99. package/dist/src/nile-dumbbell-upper-chart/nile-dumbbell-upper-chart.css.d.ts +1 -0
  100. package/dist/src/nile-dumbbell-upper-chart/nile-dumbbell-upper-chart.css.js +28 -0
  101. package/dist/src/nile-dumbbell-upper-chart/nile-dumbbell-upper-chart.d.ts +40 -0
  102. package/dist/src/nile-dumbbell-upper-chart/nile-dumbbell-upper-chart.js +214 -0
  103. package/dist/src/nile-euler-chart/index.d.ts +2 -0
  104. package/dist/src/nile-euler-chart/index.js +2 -0
  105. package/dist/src/nile-euler-chart/nile-euler-chart.css.d.ts +1 -0
  106. package/dist/src/nile-euler-chart/nile-euler-chart.css.js +28 -0
  107. package/dist/src/nile-euler-chart/nile-euler-chart.d.ts +38 -0
  108. package/dist/src/nile-euler-chart/nile-euler-chart.js +149 -0
  109. package/dist/src/nile-heatmap-chart/index.d.ts +2 -0
  110. package/dist/src/nile-heatmap-chart/index.js +2 -0
  111. package/dist/src/nile-heatmap-chart/nile-heatmap-chart.css.d.ts +1 -0
  112. package/dist/src/nile-heatmap-chart/nile-heatmap-chart.css.js +28 -0
  113. package/dist/src/nile-heatmap-chart/nile-heatmap-chart.d.ts +49 -0
  114. package/dist/src/nile-heatmap-chart/nile-heatmap-chart.js +259 -0
  115. package/dist/src/nile-histogram-chart/nile-histogram-chart.js +3 -1
  116. package/dist/src/nile-inverted-area-chart/index.d.ts +2 -0
  117. package/dist/src/nile-inverted-area-chart/index.js +2 -0
  118. package/dist/src/nile-inverted-area-chart/nile-inverted-area-chart.css.d.ts +1 -0
  119. package/dist/src/nile-inverted-area-chart/nile-inverted-area-chart.css.js +28 -0
  120. package/dist/src/nile-inverted-area-chart/nile-inverted-area-chart.d.ts +40 -0
  121. package/dist/src/nile-inverted-area-chart/nile-inverted-area-chart.js +173 -0
  122. package/dist/src/nile-line-column-chart/index.d.ts +2 -0
  123. package/dist/src/nile-line-column-chart/index.js +2 -0
  124. package/dist/src/nile-line-column-chart/nile-line-column-chart.css.d.ts +1 -0
  125. package/dist/src/nile-line-column-chart/nile-line-column-chart.css.js +28 -0
  126. package/dist/src/nile-line-column-chart/nile-line-column-chart.d.ts +42 -0
  127. package/dist/src/nile-line-column-chart/nile-line-column-chart.js +205 -0
  128. package/dist/src/nile-lollipop-chart/index.d.ts +2 -0
  129. package/dist/src/nile-lollipop-chart/index.js +2 -0
  130. package/dist/src/nile-lollipop-chart/nile-lollipop-chart.css.d.ts +1 -0
  131. package/dist/src/nile-lollipop-chart/nile-lollipop-chart.css.js +28 -0
  132. package/dist/src/nile-lollipop-chart/nile-lollipop-chart.d.ts +39 -0
  133. package/dist/src/nile-lollipop-chart/nile-lollipop-chart.js +174 -0
  134. package/dist/src/nile-organization-chart/index.d.ts +2 -0
  135. package/dist/src/nile-organization-chart/index.js +2 -0
  136. package/dist/src/nile-organization-chart/nile-organization-chart.css.d.ts +1 -0
  137. package/dist/src/nile-organization-chart/nile-organization-chart.css.js +28 -0
  138. package/dist/src/nile-organization-chart/nile-organization-chart.d.ts +57 -0
  139. package/dist/src/nile-organization-chart/nile-organization-chart.js +206 -0
  140. package/dist/src/nile-polygon-chart/index.d.ts +2 -0
  141. package/dist/src/nile-polygon-chart/index.js +2 -0
  142. package/dist/src/nile-polygon-chart/nile-polygon-chart.css.d.ts +1 -0
  143. package/dist/src/nile-polygon-chart/nile-polygon-chart.css.js +28 -0
  144. package/dist/src/nile-polygon-chart/nile-polygon-chart.d.ts +41 -0
  145. package/dist/src/nile-polygon-chart/nile-polygon-chart.js +167 -0
  146. package/dist/src/nile-radial-bar-chart/index.d.ts +2 -0
  147. package/dist/src/nile-radial-bar-chart/index.js +2 -0
  148. package/dist/src/nile-radial-bar-chart/nile-radial-bar-chart.css.d.ts +1 -0
  149. package/dist/src/nile-radial-bar-chart/nile-radial-bar-chart.css.js +28 -0
  150. package/dist/src/nile-radial-bar-chart/nile-radial-bar-chart.d.ts +42 -0
  151. package/dist/src/nile-radial-bar-chart/nile-radial-bar-chart.js +191 -0
  152. package/dist/src/nile-variable-pie-chart/index.d.ts +2 -0
  153. package/dist/src/nile-variable-pie-chart/index.js +2 -0
  154. package/dist/src/nile-variable-pie-chart/nile-variable-pie-chart.css.d.ts +1 -0
  155. package/dist/src/nile-variable-pie-chart/nile-variable-pie-chart.css.js +28 -0
  156. package/dist/src/nile-variable-pie-chart/nile-variable-pie-chart.d.ts +42 -0
  157. package/dist/src/nile-variable-pie-chart/nile-variable-pie-chart.js +180 -0
  158. package/dist/src/nile-vector-chart/index.d.ts +2 -0
  159. package/dist/src/nile-vector-chart/index.js +2 -0
  160. package/dist/src/nile-vector-chart/nile-vector-chart.css.d.ts +1 -0
  161. package/dist/src/nile-vector-chart/nile-vector-chart.css.js +28 -0
  162. package/dist/src/nile-vector-chart/nile-vector-chart.d.ts +44 -0
  163. package/dist/src/nile-vector-chart/nile-vector-chart.js +181 -0
  164. package/dist/src/nile-xrange-chart/index.d.ts +2 -0
  165. package/dist/src/nile-xrange-chart/index.js +2 -0
  166. package/dist/src/nile-xrange-chart/nile-xrange-chart.css.d.ts +1 -0
  167. package/dist/src/nile-xrange-chart/nile-xrange-chart.css.js +28 -0
  168. package/dist/src/nile-xrange-chart/nile-xrange-chart.d.ts +44 -0
  169. package/dist/src/nile-xrange-chart/nile-xrange-chart.js +193 -0
  170. package/package.json +4 -1
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=chart-vector-config.type.js.map
@@ -0,0 +1,13 @@
1
+ import type { Options } from 'highcharts';
2
+ import type { XrangeDataPoint } from '../../nile-xrange-chart/nile-xrange-chart.js';
3
+ /** X-range / schedule bars (`<nile-xrange-chart>`). */
4
+ export interface ChartXrangeConfigType {
5
+ type: 'xrange';
6
+ data: XrangeDataPoint[];
7
+ categories: string[];
8
+ seriesName?: string;
9
+ datetimeAxis?: boolean;
10
+ height?: string;
11
+ loading?: boolean;
12
+ options?: Options;
13
+ }
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=chart-xrange-config.type.js.map
@@ -6,7 +6,7 @@ export type { ChartPieConfigType } from './chart-pie-config.type.js';
6
6
  export type { ChartTrendlineConfigType } from './chart-trendline-config.type.js';
7
7
  export type { ChartAnomalyConfigType } from './chart-anomaly-config.type.js';
8
8
  export type { ChartLineConfigType } from './chart-line-config.type.js';
9
- export type { ChartAreaConfigType } from './chart-area-config.type.js';
9
+ export type { ChartAreaConfigType, ChartInvertedAreaConfigType } from './chart-area-config.type.js';
10
10
  export type { ChartColumnConfigType } from './chart-column-config.type.js';
11
11
  export type { ChartDonutConfigType } from './chart-donut-config.type.js';
12
12
  export type { ChartScatterConfigType } from './chart-scatter-config.type.js';
@@ -22,8 +22,26 @@ export type { ChartBellcurveConfigType } from './chart-bellcurve-config.type.js'
22
22
  export type { ChartBoxplotConfigType } from './chart-boxplot-config.type.js';
23
23
  export type { ChartTimelineConfigType } from './chart-timeline-config.type.js';
24
24
  export type { ChartDumbbellConfigType } from './chart-dumbbell-config.type.js';
25
+ export type { ChartDumbbellLowerConfigType } from './chart-dumbbell-lower-config.type.js';
26
+ export type { ChartDumbbellUpperConfigType } from './chart-dumbbell-upper-config.type.js';
27
+ export type { ChartColumnPyramidConfigType } from './chart-column-pyramid-config.type.js';
28
+ export type { ChartLollipopConfigType } from './chart-lollipop-config.type.js';
29
+ export type { ChartAreaSplineConfigType } from './chart-area-spline-config.type.js';
30
+ export type { ChartAreaNegativeConfigType } from './chart-area-negative-config.type.js';
31
+ export type { ChartAreaRangeConfigType } from './chart-area-range-config.type.js';
32
+ export type { ChartColumnRangeConfigType } from './chart-column-range-config.type.js';
33
+ export type { ChartColumnDrilldownConfigType } from './chart-column-drilldown-config.type.js';
34
+ export type { ChartRadialBarConfigType } from './chart-radial-bar-config.type.js';
35
+ export type { ChartVariablePieConfigType } from './chart-variable-pie-config.type.js';
36
+ export type { ChartEulerConfigType } from './chart-euler-config.type.js';
37
+ export type { ChartPolygonConfigType } from './chart-polygon-config.type.js';
38
+ export type { ChartVectorConfigType } from './chart-vector-config.type.js';
39
+ export type { ChartXrangeConfigType } from './chart-xrange-config.type.js';
25
40
  export type { ChartFanConfigType } from './chart-fan-config.type.js';
26
41
  export type { ChartFunnelConfigType } from './chart-funnel-config.type.js';
42
+ export type { ChartOrganizationConfigType } from './chart-organization-config.type.js';
43
+ export type { ChartLineColumnConfigType } from './chart-line-column-config.type.js';
44
+ export type { ChartHeatmapConfigType } from './chart-heatmap-config.type.js';
27
45
  export type { ChartFlameConfigType } from './chart-flame-config.type.js';
28
46
  export type { ChartSpiderwebConfigType } from './chart-spiderweb-config.type.js';
29
47
  export type { ChartKpiPropsType } from './chart-kpi-config.type.js';
@@ -7,10 +7,29 @@ import type { ChartTimelineConfigType } from './chart-timeline-config.type.js';
7
7
  import type { ChartDumbbellConfigType } from './chart-dumbbell-config.type.js';
8
8
  import type { ChartFanConfigType } from './chart-fan-config.type.js';
9
9
  import type { ChartFunnelConfigType } from './chart-funnel-config.type.js';
10
+ import type { ChartOrganizationConfigType } from './chart-organization-config.type.js';
11
+ import type { ChartLineColumnConfigType } from './chart-line-column-config.type.js';
12
+ import type { ChartHeatmapConfigType } from './chart-heatmap-config.type.js';
10
13
  import type { ChartFlameConfigType } from './chart-flame-config.type.js';
11
14
  import type { ChartSpiderwebConfigType } from './chart-spiderweb-config.type.js';
15
+ import type { ChartInvertedAreaConfigType } from './chart-area-config.type.js';
16
+ import type { ChartColumnPyramidConfigType } from './chart-column-pyramid-config.type.js';
17
+ import type { ChartLollipopConfigType } from './chart-lollipop-config.type.js';
18
+ import type { ChartAreaSplineConfigType } from './chart-area-spline-config.type.js';
19
+ import type { ChartAreaNegativeConfigType } from './chart-area-negative-config.type.js';
20
+ import type { ChartAreaRangeConfigType } from './chart-area-range-config.type.js';
21
+ import type { ChartColumnRangeConfigType } from './chart-column-range-config.type.js';
22
+ import type { ChartColumnDrilldownConfigType } from './chart-column-drilldown-config.type.js';
23
+ import type { ChartRadialBarConfigType } from './chart-radial-bar-config.type.js';
24
+ import type { ChartVariablePieConfigType } from './chart-variable-pie-config.type.js';
25
+ import type { ChartDumbbellLowerConfigType } from './chart-dumbbell-lower-config.type.js';
26
+ import type { ChartDumbbellUpperConfigType } from './chart-dumbbell-upper-config.type.js';
27
+ import type { ChartEulerConfigType } from './chart-euler-config.type.js';
28
+ import type { ChartPolygonConfigType } from './chart-polygon-config.type.js';
29
+ import type { ChartVectorConfigType } from './chart-vector-config.type.js';
30
+ import type { ChartXrangeConfigType } from './chart-xrange-config.type.js';
12
31
  /**
13
32
  * Chart configs for primitive `<nile-*-chart>` elements (`el.config = { chart, aq }`).
14
33
  * Discriminated on `chart.type`.
15
34
  */
16
- export type PrimitiveChartConfigType = ChartClusterConfigType | ChartStackedConfigType | ChartHistogramConfigType | ChartBellcurveConfigType | ChartBoxplotConfigType | ChartTimelineConfigType | ChartDumbbellConfigType | ChartFanConfigType | ChartFunnelConfigType | ChartFlameConfigType | ChartSpiderwebConfigType;
35
+ export type PrimitiveChartConfigType = ChartInvertedAreaConfigType | ChartColumnPyramidConfigType | ChartLollipopConfigType | ChartAreaSplineConfigType | ChartAreaNegativeConfigType | ChartAreaRangeConfigType | ChartColumnRangeConfigType | ChartColumnDrilldownConfigType | ChartRadialBarConfigType | ChartVariablePieConfigType | ChartDumbbellLowerConfigType | ChartDumbbellUpperConfigType | ChartEulerConfigType | ChartPolygonConfigType | ChartVectorConfigType | ChartXrangeConfigType | ChartClusterConfigType | ChartStackedConfigType | ChartHistogramConfigType | ChartBellcurveConfigType | ChartBoxplotConfigType | ChartTimelineConfigType | ChartDumbbellConfigType | ChartFanConfigType | ChartFunnelConfigType | ChartOrganizationConfigType | ChartLineColumnConfigType | ChartHeatmapConfigType | ChartFlameConfigType | ChartSpiderwebConfigType;
@@ -0,0 +1,2 @@
1
+ export { NileAreaNegativeChart } from './nile-area-negative-chart.js';
2
+ export type { AreaNegativeSeriesData } from './nile-area-negative-chart.js';
@@ -0,0 +1,2 @@
1
+ export { NileAreaNegativeChart } from './nile-area-negative-chart.js';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -0,0 +1,28 @@
1
+ import { css } from 'lit';
2
+ export const styles = css `
3
+ :host {
4
+ display: block;
5
+ width: 100%;
6
+ position: relative;
7
+ }
8
+
9
+ :host([hidden]) {
10
+ display: none;
11
+ }
12
+
13
+ .chart-container {
14
+ width: 100%;
15
+ min-height: var(--nile-height-200px, var(--ng-height-200px));
16
+ }
17
+
18
+ .chart-loading {
19
+ display: flex;
20
+ align-items: center;
21
+ justify-content: center;
22
+ min-height: inherit;
23
+ color: var(--nile-colors-neutral-700, var(--ng-colors-text-secondary-700));
24
+ font-family: var(--nile-font-family-serif, var(--ng-font-family-body));
25
+ font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));
26
+ }
27
+ `;
28
+ //# sourceMappingURL=nile-area-negative-chart.css.js.map
@@ -0,0 +1,42 @@
1
+ import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
2
+ import type Highcharts from 'highcharts';
3
+ import NileElement from '../internal/nile-element.js';
4
+ import type { SeparatedChartConfigInputType } from '../internal/types/separated-chart-config-input.type.js';
5
+ export interface AreaNegativeSeriesData {
6
+ name: string;
7
+ data: number[];
8
+ color?: string;
9
+ negativeColor?: string;
10
+ }
11
+ export declare class NileAreaNegativeChart extends NileElement {
12
+ static styles: CSSResultGroup;
13
+ private _hc;
14
+ private chart;
15
+ private resizeObserver;
16
+ private chartContainer;
17
+ config: SeparatedChartConfigInputType | null;
18
+ chartTitle: string;
19
+ chartSubtitle: string;
20
+ data: AreaNegativeSeriesData[];
21
+ categories: string[];
22
+ options: Highcharts.Options;
23
+ loading: boolean;
24
+ height: string;
25
+ yAxisTitle: string;
26
+ threshold: number;
27
+ private applyConfig;
28
+ connectedCallback(): void;
29
+ disconnectedCallback(): void;
30
+ protected firstUpdated(): void;
31
+ protected updated(changedProperties: PropertyValues): void;
32
+ private setupResizeObserver;
33
+ private buildOptions;
34
+ private initChart;
35
+ private destroyChart;
36
+ render(): TemplateResult;
37
+ }
38
+ declare global {
39
+ interface HTMLElementTagNameMap {
40
+ 'nile-area-negative-chart': NileAreaNegativeChart;
41
+ }
42
+ }
@@ -0,0 +1,178 @@
1
+ import { __decorate } from "tslib";
2
+ import { customElement, property, query } from 'lit/decorators.js';
3
+ import { html } from 'lit';
4
+ import NileElement from '../internal/nile-element.js';
5
+ import { applySeparatedChartConfig } from '../internal/separated-chart-config.js';
6
+ import { getHighcharts } from '../internal/highcharts-provider.js';
7
+ import { deepMerge } from '../internal/utils.js';
8
+ import { styles } from './nile-area-negative-chart.css.js';
9
+ let NileAreaNegativeChart = class NileAreaNegativeChart extends NileElement {
10
+ constructor() {
11
+ super(...arguments);
12
+ this._hc = null;
13
+ this.chart = null;
14
+ this.resizeObserver = null;
15
+ this.config = null;
16
+ this.chartTitle = '';
17
+ this.chartSubtitle = '';
18
+ this.data = [];
19
+ this.categories = [];
20
+ this.options = {};
21
+ this.loading = false;
22
+ this.height = '400px';
23
+ this.yAxisTitle = '';
24
+ this.threshold = 0;
25
+ }
26
+ applyConfig(cfg) {
27
+ applySeparatedChartConfig(this, cfg);
28
+ }
29
+ connectedCallback() {
30
+ super.connectedCallback();
31
+ if (this.config)
32
+ this.applyConfig(this.config);
33
+ }
34
+ disconnectedCallback() {
35
+ super.disconnectedCallback();
36
+ this.destroyChart();
37
+ this.resizeObserver?.disconnect();
38
+ this.resizeObserver = null;
39
+ }
40
+ firstUpdated() {
41
+ this.initChart();
42
+ this.setupResizeObserver();
43
+ }
44
+ updated(changedProperties) {
45
+ if (changedProperties.has('config') && this.config) {
46
+ this.applyConfig(this.config);
47
+ return;
48
+ }
49
+ const props = [
50
+ 'data',
51
+ 'categories',
52
+ 'chartTitle',
53
+ 'chartSubtitle',
54
+ 'options',
55
+ 'height',
56
+ 'yAxisTitle',
57
+ 'threshold',
58
+ 'loading',
59
+ ];
60
+ if (!props.some(p => changedProperties.has(p)))
61
+ return;
62
+ if (this.loading) {
63
+ this.destroyChart();
64
+ return;
65
+ }
66
+ if (this.chart) {
67
+ this.chart.update(this.buildOptions(), true, true);
68
+ }
69
+ else {
70
+ this.initChart();
71
+ }
72
+ }
73
+ setupResizeObserver() {
74
+ if (!this.chartContainer)
75
+ return;
76
+ this.resizeObserver = new ResizeObserver(() => this.chart?.reflow());
77
+ this.resizeObserver.observe(this.chartContainer);
78
+ }
79
+ buildOptions() {
80
+ const self = this;
81
+ return deepMerge({
82
+ chart: { type: 'area', height: this.height },
83
+ title: { text: this.chartTitle || undefined },
84
+ subtitle: { text: this.chartSubtitle || undefined },
85
+ xAxis: { categories: this.categories },
86
+ yAxis: { title: { text: this.yAxisTitle || undefined } },
87
+ tooltip: { shared: true },
88
+ plotOptions: {
89
+ area: {
90
+ threshold: this.threshold,
91
+ fillOpacity: 0.35,
92
+ },
93
+ series: {
94
+ cursor: 'pointer',
95
+ point: {
96
+ events: {
97
+ click() {
98
+ self.emit('nile-chart-click', {
99
+ point: this,
100
+ category: this.category,
101
+ value: this.y,
102
+ seriesName: this.series.name,
103
+ });
104
+ },
105
+ },
106
+ },
107
+ },
108
+ },
109
+ series: this.data.map(s => ({
110
+ type: 'area',
111
+ name: s.name,
112
+ data: s.data,
113
+ color: s.color,
114
+ negativeColor: s.negativeColor,
115
+ })),
116
+ credits: { enabled: false },
117
+ }, this.options);
118
+ }
119
+ async initChart() {
120
+ if (this.loading || !this.chartContainer)
121
+ return;
122
+ if (!this._hc)
123
+ this._hc = await getHighcharts();
124
+ this.chart = this._hc.chart(this.chartContainer, this.buildOptions());
125
+ this.emit('nile-chart-ready', { chart: this.chart });
126
+ }
127
+ destroyChart() {
128
+ if (this.chart) {
129
+ this.chart.destroy();
130
+ this.chart = null;
131
+ }
132
+ }
133
+ render() {
134
+ if (this.loading) {
135
+ return html `<div class="chart-loading" style="height:${this.height}">Loading...</div>`;
136
+ }
137
+ return html `<div class="chart-container"></div>`;
138
+ }
139
+ };
140
+ NileAreaNegativeChart.styles = styles;
141
+ __decorate([
142
+ query('.chart-container')
143
+ ], NileAreaNegativeChart.prototype, "chartContainer", void 0);
144
+ __decorate([
145
+ property({ type: Object })
146
+ ], NileAreaNegativeChart.prototype, "config", void 0);
147
+ __decorate([
148
+ property({ type: String, attribute: 'chart-title' })
149
+ ], NileAreaNegativeChart.prototype, "chartTitle", void 0);
150
+ __decorate([
151
+ property({ type: String, attribute: 'chart-subtitle' })
152
+ ], NileAreaNegativeChart.prototype, "chartSubtitle", void 0);
153
+ __decorate([
154
+ property({ type: Array })
155
+ ], NileAreaNegativeChart.prototype, "data", void 0);
156
+ __decorate([
157
+ property({ type: Array })
158
+ ], NileAreaNegativeChart.prototype, "categories", void 0);
159
+ __decorate([
160
+ property({ type: Object })
161
+ ], NileAreaNegativeChart.prototype, "options", void 0);
162
+ __decorate([
163
+ property({ type: Boolean, reflect: true })
164
+ ], NileAreaNegativeChart.prototype, "loading", void 0);
165
+ __decorate([
166
+ property({ type: String })
167
+ ], NileAreaNegativeChart.prototype, "height", void 0);
168
+ __decorate([
169
+ property({ type: String, attribute: 'y-axis-title' })
170
+ ], NileAreaNegativeChart.prototype, "yAxisTitle", void 0);
171
+ __decorate([
172
+ property({ type: Number })
173
+ ], NileAreaNegativeChart.prototype, "threshold", void 0);
174
+ NileAreaNegativeChart = __decorate([
175
+ customElement('nile-area-negative-chart')
176
+ ], NileAreaNegativeChart);
177
+ export { NileAreaNegativeChart };
178
+ //# sourceMappingURL=nile-area-negative-chart.js.map
@@ -0,0 +1,2 @@
1
+ export { NileAreaRangeChart } from './nile-area-range-chart.js';
2
+ export type { AreaRangeSeriesData } from './nile-area-range-chart.js';
@@ -0,0 +1,2 @@
1
+ export { NileAreaRangeChart } from './nile-area-range-chart.js';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -0,0 +1,28 @@
1
+ import { css } from 'lit';
2
+ export const styles = css `
3
+ :host {
4
+ display: block;
5
+ width: 100%;
6
+ position: relative;
7
+ }
8
+
9
+ :host([hidden]) {
10
+ display: none;
11
+ }
12
+
13
+ .chart-container {
14
+ width: 100%;
15
+ min-height: var(--nile-height-200px, var(--ng-height-200px));
16
+ }
17
+
18
+ .chart-loading {
19
+ display: flex;
20
+ align-items: center;
21
+ justify-content: center;
22
+ min-height: inherit;
23
+ color: var(--nile-colors-neutral-700, var(--ng-colors-text-secondary-700));
24
+ font-family: var(--nile-font-family-serif, var(--ng-font-family-body));
25
+ font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));
26
+ }
27
+ `;
28
+ //# sourceMappingURL=nile-area-range-chart.css.js.map
@@ -0,0 +1,41 @@
1
+ import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
2
+ import type Highcharts from 'highcharts';
3
+ import NileElement from '../internal/nile-element.js';
4
+ import type { SeparatedChartConfigInputType } from '../internal/types/separated-chart-config-input.type.js';
5
+ export interface AreaRangeSeriesData {
6
+ name: string;
7
+ data: [number, number][];
8
+ color?: string;
9
+ fillOpacity?: number;
10
+ }
11
+ export declare class NileAreaRangeChart extends NileElement {
12
+ static styles: CSSResultGroup;
13
+ private _hc;
14
+ private chart;
15
+ private resizeObserver;
16
+ private chartContainer;
17
+ config: SeparatedChartConfigInputType | null;
18
+ chartTitle: string;
19
+ chartSubtitle: string;
20
+ data: AreaRangeSeriesData[];
21
+ categories: string[];
22
+ options: Highcharts.Options;
23
+ loading: boolean;
24
+ height: string;
25
+ yAxisTitle: string;
26
+ private applyConfig;
27
+ connectedCallback(): void;
28
+ disconnectedCallback(): void;
29
+ protected firstUpdated(): void;
30
+ protected updated(changedProperties: PropertyValues): void;
31
+ private setupResizeObserver;
32
+ private buildOptions;
33
+ private initChart;
34
+ private destroyChart;
35
+ render(): TemplateResult;
36
+ }
37
+ declare global {
38
+ interface HTMLElementTagNameMap {
39
+ 'nile-area-range-chart': NileAreaRangeChart;
40
+ }
41
+ }
@@ -0,0 +1,173 @@
1
+ import { __decorate } from "tslib";
2
+ import { customElement, property, query } from 'lit/decorators.js';
3
+ import { html } from 'lit';
4
+ import NileElement from '../internal/nile-element.js';
5
+ import { applySeparatedChartConfig } from '../internal/separated-chart-config.js';
6
+ import { getHighcharts } from '../internal/highcharts-provider.js';
7
+ import { deepMerge } from '../internal/utils.js';
8
+ import { styles } from './nile-area-range-chart.css.js';
9
+ let NileAreaRangeChart = class NileAreaRangeChart extends NileElement {
10
+ constructor() {
11
+ super(...arguments);
12
+ this._hc = null;
13
+ this.chart = null;
14
+ this.resizeObserver = null;
15
+ this.config = null;
16
+ this.chartTitle = '';
17
+ this.chartSubtitle = '';
18
+ this.data = [];
19
+ this.categories = [];
20
+ this.options = {};
21
+ this.loading = false;
22
+ this.height = '400px';
23
+ this.yAxisTitle = '';
24
+ }
25
+ applyConfig(cfg) {
26
+ applySeparatedChartConfig(this, cfg);
27
+ }
28
+ connectedCallback() {
29
+ super.connectedCallback();
30
+ if (this.config)
31
+ this.applyConfig(this.config);
32
+ }
33
+ disconnectedCallback() {
34
+ super.disconnectedCallback();
35
+ this.destroyChart();
36
+ this.resizeObserver?.disconnect();
37
+ this.resizeObserver = null;
38
+ }
39
+ firstUpdated() {
40
+ this.initChart();
41
+ this.setupResizeObserver();
42
+ }
43
+ updated(changedProperties) {
44
+ if (changedProperties.has('config') && this.config) {
45
+ this.applyConfig(this.config);
46
+ return;
47
+ }
48
+ const props = [
49
+ 'data',
50
+ 'categories',
51
+ 'chartTitle',
52
+ 'chartSubtitle',
53
+ 'options',
54
+ 'height',
55
+ 'yAxisTitle',
56
+ 'loading',
57
+ ];
58
+ if (!props.some(p => changedProperties.has(p)))
59
+ return;
60
+ if (this.loading) {
61
+ this.destroyChart();
62
+ return;
63
+ }
64
+ if (this.chart) {
65
+ this.chart.update(this.buildOptions(), true, true);
66
+ }
67
+ else {
68
+ this.initChart();
69
+ }
70
+ }
71
+ setupResizeObserver() {
72
+ if (!this.chartContainer)
73
+ return;
74
+ this.resizeObserver = new ResizeObserver(() => this.chart?.reflow());
75
+ this.resizeObserver.observe(this.chartContainer);
76
+ }
77
+ buildOptions() {
78
+ const self = this;
79
+ return deepMerge({
80
+ chart: { height: this.height },
81
+ title: { text: this.chartTitle || undefined },
82
+ subtitle: { text: this.chartSubtitle || undefined },
83
+ xAxis: { categories: this.categories },
84
+ yAxis: { title: { text: this.yAxisTitle || undefined } },
85
+ tooltip: { shared: true, valueDecimals: 0 },
86
+ plotOptions: {
87
+ arearange: {
88
+ fillOpacity: 0.35,
89
+ },
90
+ series: {
91
+ cursor: 'pointer',
92
+ point: {
93
+ events: {
94
+ click() {
95
+ self.emit('nile-chart-click', {
96
+ point: this,
97
+ category: this.category,
98
+ low: this.low,
99
+ high: this.high,
100
+ seriesName: this.series.name,
101
+ });
102
+ },
103
+ },
104
+ },
105
+ },
106
+ },
107
+ series: this.data.map(s => ({
108
+ type: 'arearange',
109
+ name: s.name,
110
+ data: s.data,
111
+ color: s.color,
112
+ fillOpacity: s.fillOpacity,
113
+ })),
114
+ credits: { enabled: false },
115
+ }, this.options);
116
+ }
117
+ async initChart() {
118
+ if (this.loading || !this.chartContainer)
119
+ return;
120
+ if (!this._hc)
121
+ this._hc = await getHighcharts();
122
+ this.chart = this._hc.chart(this.chartContainer, this.buildOptions());
123
+ this.emit('nile-chart-ready', { chart: this.chart });
124
+ }
125
+ destroyChart() {
126
+ if (this.chart) {
127
+ this.chart.destroy();
128
+ this.chart = null;
129
+ }
130
+ }
131
+ render() {
132
+ if (this.loading) {
133
+ return html `<div class="chart-loading" style="height:${this.height}">Loading...</div>`;
134
+ }
135
+ return html `<div class="chart-container"></div>`;
136
+ }
137
+ };
138
+ NileAreaRangeChart.styles = styles;
139
+ __decorate([
140
+ query('.chart-container')
141
+ ], NileAreaRangeChart.prototype, "chartContainer", void 0);
142
+ __decorate([
143
+ property({ type: Object })
144
+ ], NileAreaRangeChart.prototype, "config", void 0);
145
+ __decorate([
146
+ property({ type: String, attribute: 'chart-title' })
147
+ ], NileAreaRangeChart.prototype, "chartTitle", void 0);
148
+ __decorate([
149
+ property({ type: String, attribute: 'chart-subtitle' })
150
+ ], NileAreaRangeChart.prototype, "chartSubtitle", void 0);
151
+ __decorate([
152
+ property({ type: Array })
153
+ ], NileAreaRangeChart.prototype, "data", void 0);
154
+ __decorate([
155
+ property({ type: Array })
156
+ ], NileAreaRangeChart.prototype, "categories", void 0);
157
+ __decorate([
158
+ property({ type: Object })
159
+ ], NileAreaRangeChart.prototype, "options", void 0);
160
+ __decorate([
161
+ property({ type: Boolean, reflect: true })
162
+ ], NileAreaRangeChart.prototype, "loading", void 0);
163
+ __decorate([
164
+ property({ type: String })
165
+ ], NileAreaRangeChart.prototype, "height", void 0);
166
+ __decorate([
167
+ property({ type: String, attribute: 'y-axis-title' })
168
+ ], NileAreaRangeChart.prototype, "yAxisTitle", void 0);
169
+ NileAreaRangeChart = __decorate([
170
+ customElement('nile-area-range-chart')
171
+ ], NileAreaRangeChart);
172
+ export { NileAreaRangeChart };
173
+ //# sourceMappingURL=nile-area-range-chart.js.map
@@ -0,0 +1,2 @@
1
+ export { NileAreaSplineChart } from './nile-area-spline-chart.js';
2
+ export type { AreaSplineSeriesData } from './nile-area-spline-chart.js';
@@ -0,0 +1,2 @@
1
+ export { NileAreaSplineChart } from './nile-area-spline-chart.js';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -0,0 +1,28 @@
1
+ import { css } from 'lit';
2
+ export const styles = css `
3
+ :host {
4
+ display: block;
5
+ width: 100%;
6
+ position: relative;
7
+ }
8
+
9
+ :host([hidden]) {
10
+ display: none;
11
+ }
12
+
13
+ .chart-container {
14
+ width: 100%;
15
+ min-height: var(--nile-height-200px, var(--ng-height-200px));
16
+ }
17
+
18
+ .chart-loading {
19
+ display: flex;
20
+ align-items: center;
21
+ justify-content: center;
22
+ min-height: inherit;
23
+ color: var(--nile-colors-neutral-700, var(--ng-colors-text-secondary-700));
24
+ font-family: var(--nile-font-family-serif, var(--ng-font-family-body));
25
+ font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));
26
+ }
27
+ `;
28
+ //# sourceMappingURL=nile-area-spline-chart.css.js.map