@scality/core-ui 0.165.0 → 0.167.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 (138) hide show
  1. package/.storybook/preview.js +6 -4
  2. package/README.md +27 -80
  3. package/dist/components/barchart/BarChart.component.d.ts +5 -0
  4. package/dist/components/barchart/BarChart.component.d.ts.map +1 -1
  5. package/dist/components/barchart/BarChart.component.js +5 -0
  6. package/dist/components/barchartv2/Barchart.component.d.ts +19 -0
  7. package/dist/components/barchartv2/Barchart.component.d.ts.map +1 -1
  8. package/dist/components/barchartv2/Barchart.component.js +31 -5
  9. package/dist/components/barchartv2/ChartTooltip.d.ts +18 -0
  10. package/dist/components/barchartv2/ChartTooltip.d.ts.map +1 -0
  11. package/dist/components/barchartv2/ChartTooltip.js +31 -0
  12. package/dist/components/barchartv2/utils.d.ts +0 -7
  13. package/dist/components/barchartv2/utils.d.ts.map +1 -1
  14. package/dist/components/barchartv2/utils.js +1 -29
  15. package/dist/components/button/Button.component.d.ts +2 -1
  16. package/dist/components/button/Button.component.d.ts.map +1 -1
  17. package/dist/components/button/Button.component.js +2 -1
  18. package/dist/components/chartlegend/ChartLegend.d.ts +9 -0
  19. package/dist/components/chartlegend/ChartLegend.d.ts.map +1 -1
  20. package/dist/components/chartlegend/ChartLegend.js +32 -9
  21. package/dist/components/chartlegend/ChartLegendWrapper.d.ts +3 -0
  22. package/dist/components/chartlegend/ChartLegendWrapper.d.ts.map +1 -1
  23. package/dist/components/chartlegend/ChartLegendWrapper.js +18 -2
  24. package/dist/components/constants.d.ts +2 -0
  25. package/dist/components/constants.d.ts.map +1 -1
  26. package/dist/components/constants.js +6 -0
  27. package/dist/components/constrainedtext/Constrainedtext.component.d.ts +3 -1
  28. package/dist/components/constrainedtext/Constrainedtext.component.d.ts.map +1 -1
  29. package/dist/components/constrainedtext/Constrainedtext.component.js +2 -2
  30. package/dist/components/date/FormattedDateTime.d.ts +2 -1
  31. package/dist/components/date/FormattedDateTime.d.ts.map +1 -1
  32. package/dist/components/date/FormattedDateTime.js +10 -0
  33. package/dist/components/icon/Icon.component.d.ts +9 -11
  34. package/dist/components/icon/Icon.component.d.ts.map +1 -1
  35. package/dist/components/icon/Icon.component.js +2 -0
  36. package/dist/components/linetemporalchart/ChartUtil.d.ts +3 -2
  37. package/dist/components/linetemporalchart/ChartUtil.d.ts.map +1 -1
  38. package/dist/components/linetemporalchart/ChartUtil.js +24 -20
  39. package/dist/components/linetemporalchart/LineTemporalChart.component.d.ts +4 -0
  40. package/dist/components/linetemporalchart/LineTemporalChart.component.d.ts.map +1 -1
  41. package/dist/components/linetemporalchart/LineTemporalChart.component.js +4 -0
  42. package/dist/components/linetimeseriechart/linetimeseriechart.component.d.ts +4 -2
  43. package/dist/components/linetimeseriechart/linetimeseriechart.component.d.ts.map +1 -1
  44. package/dist/components/linetimeseriechart/linetimeseriechart.component.js +5 -7
  45. package/dist/components/text/Text.component.js +1 -1
  46. package/dist/components/toast/Toast.component.d.ts.map +1 -1
  47. package/dist/components/toast/Toast.component.js +24 -11
  48. package/dist/index.d.ts +1 -11
  49. package/dist/index.d.ts.map +1 -1
  50. package/dist/index.js +0 -11
  51. package/dist/next.d.ts +2 -0
  52. package/dist/next.d.ts.map +1 -1
  53. package/dist/next.js +1 -0
  54. package/jest.config.js +1 -0
  55. package/package.json +16 -38
  56. package/src/lib/components/barchart/BarChart.component.tsx +5 -0
  57. package/src/lib/components/barchartv2/Barchart.component.test.tsx +99 -1
  58. package/src/lib/components/barchartv2/Barchart.component.tsx +39 -11
  59. package/src/lib/components/barchartv2/ChartTooltip.tsx +76 -0
  60. package/src/lib/components/barchartv2/utils.ts +2 -33
  61. package/src/lib/components/button/Button.component.tsx +2 -1
  62. package/src/lib/components/chartlegend/ChartLegend.test.tsx +235 -0
  63. package/src/lib/components/chartlegend/ChartLegend.tsx +36 -8
  64. package/src/lib/components/chartlegend/ChartLegendWrapper.tsx +67 -29
  65. package/src/lib/components/constants.ts +11 -0
  66. package/src/lib/components/constrainedtext/Constrainedtext.component.tsx +5 -2
  67. package/src/lib/components/date/FormattedDateTime.tsx +15 -1
  68. package/src/lib/components/icon/Icon.component.tsx +12 -1
  69. package/src/lib/components/linetemporalchart/ChartUtil.test.ts +23 -35
  70. package/src/lib/components/linetemporalchart/ChartUtil.ts +32 -26
  71. package/src/lib/components/linetemporalchart/LineTemporalChart.component.tsx +19 -15
  72. package/src/lib/components/linetimeseriechart/linetimeseriechart.component.tsx +13 -11
  73. package/src/lib/components/selectv2/selectv2.test.tsx +1 -1
  74. package/src/lib/components/text/Text.component.tsx +1 -1
  75. package/src/lib/components/toast/Toast.component.tsx +27 -19
  76. package/src/lib/components/toast/useMutationsHandler.test.tsx +22 -32
  77. package/src/lib/index.ts +6 -11
  78. package/src/lib/next.ts +2 -0
  79. package/stories/barchart.stories.tsx +1 -1
  80. package/stories/card.stories.tsx +7 -5
  81. package/stories/constrainedtext.stories.tsx +4 -1
  82. package/stories/controls.ts +19 -20
  83. package/stories/linecharttemporal.stories.tsx +1 -1
  84. package/stories/linetimeseriechart.stories.tsx +79 -25
  85. package/stories/navbar.stories.tsx +103 -0
  86. package/stories/tabsv2.stories.tsx +51 -56
  87. package/dist/components/areachart/AreaChart.component.d.ts +0 -13
  88. package/dist/components/areachart/AreaChart.component.d.ts.map +0 -1
  89. package/dist/components/areachart/AreaChart.component.js +0 -27
  90. package/dist/components/chips/Chips.component.d.ts +0 -21
  91. package/dist/components/chips/Chips.component.d.ts.map +0 -1
  92. package/dist/components/chips/Chips.component.js +0 -105
  93. package/dist/components/cloudprogressbar/CloudProgressBar.component.d.ts +0 -10
  94. package/dist/components/cloudprogressbar/CloudProgressBar.component.d.ts.map +0 -1
  95. package/dist/components/cloudprogressbar/CloudProgressBar.component.js +0 -38
  96. package/dist/components/collapsiblepanel/CollapsiblePanel.component.d.ts +0 -9
  97. package/dist/components/collapsiblepanel/CollapsiblePanel.component.d.ts.map +0 -1
  98. package/dist/components/collapsiblepanel/CollapsiblePanel.component.js +0 -44
  99. package/dist/components/linechart/LineChart.component.d.ts +0 -21
  100. package/dist/components/linechart/LineChart.component.d.ts.map +0 -1
  101. package/dist/components/linechart/LineChart.component.js +0 -109
  102. package/dist/components/multiselect/MultiSelect.component.d.ts +0 -28
  103. package/dist/components/multiselect/MultiSelect.component.d.ts.map +0 -1
  104. package/dist/components/multiselect/MultiSelect.component.js +0 -73
  105. package/dist/components/select/Select.component.d.ts +0 -14
  106. package/dist/components/select/Select.component.d.ts.map +0 -1
  107. package/dist/components/select/Select.component.js +0 -71
  108. package/dist/components/spacedbox/SpacedBox.d.ts +0 -34
  109. package/dist/components/spacedbox/SpacedBox.d.ts.map +0 -1
  110. package/dist/components/spacedbox/SpacedBox.js +0 -64
  111. package/dist/components/sparkline/SparkLine.component.d.ts +0 -18
  112. package/dist/components/sparkline/SparkLine.component.d.ts.map +0 -1
  113. package/dist/components/sparkline/SparkLine.component.js +0 -148
  114. package/dist/components/vegachart/VegaChart.component.d.ts +0 -13
  115. package/dist/components/vegachart/VegaChart.component.d.ts.map +0 -1
  116. package/dist/components/vegachart/VegaChart.component.js +0 -120
  117. package/plopfile.js +0 -38
  118. package/src/lib/components/areachart/AreaChart.component.tsx +0 -49
  119. package/src/lib/components/chips/Chips.component.tsx +0 -169
  120. package/src/lib/components/cloudprogressbar/CloudProgressBar.component.tsx +0 -105
  121. package/src/lib/components/collapsiblepanel/CollapsiblePanel.component.tsx +0 -77
  122. package/src/lib/components/linechart/LineChart.component.tsx +0 -152
  123. package/src/lib/components/multiselect/MultiSelect.component.tsx +0 -158
  124. package/src/lib/components/select/Select.component.tsx +0 -98
  125. package/src/lib/components/spacedbox/SpacedBox.ts +0 -116
  126. package/src/lib/components/sparkline/SparkLine.component.tsx +0 -176
  127. package/src/lib/components/vegachart/VegaChart.component.tsx +0 -146
  128. package/stories/areachart.stories.tsx +0 -120
  129. package/stories/chips.stories.tsx +0 -107
  130. package/stories/cloudprogressbar.stories.tsx +0 -93
  131. package/stories/collapsiblepanel.stories.tsx +0 -57
  132. package/stories/data/areachart.ts +0 -122
  133. package/stories/data/sparklinechart.ts +0 -164
  134. package/stories/linechart.stories.tsx +0 -319
  135. package/stories/multiselect.stories.tsx +0 -126
  136. package/stories/select.stories.tsx +0 -52
  137. package/stories/sparkline.stories.tsx +0 -85
  138. package/stories/vegachart.stories.tsx +0 -98
@@ -1,14 +1,24 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { createContext, useContext, useState, useMemo, useCallback } from 'react';
2
+ import { createContext, useContext, useState, useMemo, useCallback, } from 'react';
3
3
  const ChartLegendContext = createContext(null);
4
4
  export const ChartLegendWrapper = ({ children, colorSet, }) => {
5
- const [selectedResources, setSelectedResources] = useState([]);
5
+ const allResources = Object.keys(colorSet);
6
+ const [selectedResources, setSelectedResources] = useState(allResources);
6
7
  const addSelectedResource = useCallback((resource) => {
7
8
  setSelectedResources((prev) => prev.includes(resource) ? prev : [...prev, resource]);
8
9
  }, []);
9
10
  const removeSelectedResource = useCallback((resource) => {
10
11
  setSelectedResources((prev) => prev.filter((r) => r !== resource));
11
12
  }, []);
13
+ const selectAllResources = useCallback(() => {
14
+ setSelectedResources(allResources);
15
+ }, [allResources]);
16
+ const selectOnlyResource = useCallback((resource) => {
17
+ setSelectedResources([resource]);
18
+ }, []);
19
+ const isOnlyOneSelected = useCallback(() => {
20
+ return selectedResources.length === 1;
21
+ }, [selectedResources]);
12
22
  const isSelected = useCallback((resource) => {
13
23
  return selectedResources.includes(resource);
14
24
  }, [selectedResources]);
@@ -27,16 +37,22 @@ export const ChartLegendWrapper = ({ children, colorSet, }) => {
27
37
  selectedResources,
28
38
  addSelectedResource,
29
39
  removeSelectedResource,
40
+ selectAllResources,
41
+ selectOnlyResource,
30
42
  isSelected,
31
43
  getColor,
32
44
  listResources,
45
+ isOnlyOneSelected,
33
46
  }), [
34
47
  selectedResources,
35
48
  addSelectedResource,
36
49
  removeSelectedResource,
50
+ selectAllResources,
51
+ selectOnlyResource,
37
52
  isSelected,
38
53
  getColor,
39
54
  listResources,
55
+ isOnlyOneSelected,
40
56
  ]);
41
57
  return (_jsx(ChartLegendContext.Provider, { value: chartLegendState, children: children }));
42
58
  };
@@ -19,6 +19,8 @@ export type QueryTimeSpan = {
19
19
  query: string;
20
20
  label: string;
21
21
  duration: number;
22
+ interval: number;
23
+ /** @deprecated Use `interval` instead */
22
24
  frequency: number;
23
25
  };
24
26
  export declare const queryTimeSpansCodes: QueryTimeSpan[];
@@ -1 +1 @@
1
- {"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/lib/components/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW,EAAE;KAAG,GAAG,IAAI,IAAI,GAAG,GAAG;CAQ7C,CAAC;AACF,MAAM,MAAM,IAAI,GACZ,SAAS,GACT,OAAO,GACP,MAAM,GACN,OAAO,GACP,QAAQ,GACR,MAAM,GACN,SAAS,CAAC;AAEd,MAAM,MAAM,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAG7E,eAAO,MAAM,qBAAqB,WAAW,CAAC;AAC9C,eAAO,MAAM,4BAA4B,YAAY,CAAC;AACtD,eAAO,MAAM,mBAAmB,WAAW,CAAC;AAE5C,eAAO,MAAM,eAAe,gBAAgB,CAAC;AAC7C,eAAO,MAAM,sBAAsB,kBAAkB,CAAC;AACtD,eAAO,MAAM,aAAa,gBAAgB,CAAC;AAE3C,eAAO,MAAM,+BAA+B,QAAmB,CAAC;AAChE,eAAO,MAAM,sCAAsC,QAAe,CAAC;AACnE,eAAO,MAAM,6BAA6B,QAAU,CAAC;AAErD,eAAO,MAAM,gCAAgC,QAAU,CAAC;AACxD,eAAO,MAAM,uCAAuC,MAAM,CAAC;AAC3D,eAAO,MAAM,8BAA8B,KAAK,CAAC;AACjD,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,MAAM,CAAC;IAEd,KAAK,EAAE,MAAM,CAAC;IAEd,QAAQ,EAAE,MAAM,CAAC;IAEjB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AACF,eAAO,MAAM,mBAAmB,EAAE,aAAa,EAmB9C,CAAC;AACF,eAAO,MAAM,UAAU,QAAQ,CAAC;AAEhC,eAAO,MAAM,eAAe,aAAa,CAAC;AAC1C,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,WAAW,SAAS,CAAC;AAClC,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,WAAW,SAAS,CAAC;AAElC,MAAM,MAAM,MAAM,GACd,MAAM,GACN,SAAS,GACT,MAAM,GACN,SAAS,GACT,SAAS,GACT,SAAS,GACT,UAAU,CAAC"}
1
+ {"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/lib/components/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW,EAAE;KAAG,GAAG,IAAI,IAAI,GAAG,GAAG;CAQ7C,CAAC;AACF,MAAM,MAAM,IAAI,GACZ,SAAS,GACT,OAAO,GACP,MAAM,GACN,OAAO,GACP,QAAQ,GACR,MAAM,GACN,SAAS,CAAC;AAEd,MAAM,MAAM,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAG7E,eAAO,MAAM,qBAAqB,WAAW,CAAC;AAC9C,eAAO,MAAM,4BAA4B,YAAY,CAAC;AACtD,eAAO,MAAM,mBAAmB,WAAW,CAAC;AAE5C,eAAO,MAAM,eAAe,gBAAgB,CAAC;AAC7C,eAAO,MAAM,sBAAsB,kBAAkB,CAAC;AACtD,eAAO,MAAM,aAAa,gBAAgB,CAAC;AAE3C,eAAO,MAAM,+BAA+B,QAAmB,CAAC;AAChE,eAAO,MAAM,sCAAsC,QAAe,CAAC;AACnE,eAAO,MAAM,6BAA6B,QAAU,CAAC;AAErD,eAAO,MAAM,gCAAgC,QAAU,CAAC;AACxD,eAAO,MAAM,uCAAuC,MAAM,CAAC;AAC3D,eAAO,MAAM,8BAA8B,KAAK,CAAC;AACjD,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,MAAM,CAAC;IAEd,KAAK,EAAE,MAAM,CAAC;IAEd,QAAQ,EAAE,MAAM,CAAC;IAEjB,QAAQ,EAAE,MAAM,CAAC;IAEjB,yCAAyC;IACzC,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,aAAa,EAyB9C,CAAC;AAEF,eAAO,MAAM,UAAU,QAAQ,CAAC;AAEhC,eAAO,MAAM,eAAe,aAAa,CAAC;AAC1C,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,WAAW,SAAS,CAAC;AAClC,eAAO,MAAM,cAAc,YAAY,CAAC;AACxC,eAAO,MAAM,WAAW,SAAS,CAAC;AAElC,MAAM,MAAM,MAAM,GACd,MAAM,GACN,SAAS,GACT,MAAM,GACN,SAAS,GACT,SAAS,GACT,SAAS,GACT,UAAU,CAAC"}
@@ -29,18 +29,24 @@ export const queryTimeSpansCodes = [
29
29
  query: QUERY_LAST_SEVEN_DAYS,
30
30
  label: LAST_SEVEN_DAYS,
31
31
  duration: SAMPLE_DURATION_LAST_SEVEN_DAYS,
32
+ interval: SAMPLE_FREQUENCY_LAST_SEVEN_DAYS,
33
+ /** @deprecated Use `interval` instead */
32
34
  frequency: SAMPLE_FREQUENCY_LAST_SEVEN_DAYS,
33
35
  },
34
36
  {
35
37
  query: QUERY_LAST_TWENTY_FOUR_HOURS,
36
38
  label: LAST_TWENTY_FOUR_HOURS,
37
39
  duration: SAMPLE_DURATION_LAST_TWENTY_FOUR_HOURS,
40
+ interval: SAMPLE_FREQUENCY_LAST_TWENTY_FOUR_HOURS,
41
+ /** @deprecated Use `interval` instead */
38
42
  frequency: SAMPLE_FREQUENCY_LAST_TWENTY_FOUR_HOURS,
39
43
  },
40
44
  {
41
45
  query: QUERY_LAST_ONE_HOUR,
42
46
  label: LAST_ONE_HOUR,
43
47
  duration: SAMPLE_DURATION_LAST_ONE_HOUR,
48
+ interval: SAMPLE_FREQUENCY_LAST_ONE_HOUR,
49
+ /** @deprecated Use `interval` instead */
44
50
  frequency: SAMPLE_FREQUENCY_LAST_ONE_HOUR,
45
51
  },
46
52
  ];
@@ -1,12 +1,14 @@
1
1
  import { $PropertyType } from 'utility-types';
2
2
  import { Props as TooltipProps } from '../tooltip/Tooltip.component';
3
+ import { CoreUITheme } from '../../style/theme';
3
4
  type Props = {
4
5
  text: string | number | JSX.Element | JSX.Element[];
5
6
  tooltipStyle?: $PropertyType<TooltipProps, 'overlayStyle'>;
6
7
  tooltipPlacement?: $PropertyType<TooltipProps, 'placement'>;
7
8
  lineClamp?: number;
8
9
  centered?: boolean;
10
+ color?: keyof CoreUITheme;
9
11
  };
10
- declare function ConstrainedText({ text, tooltipStyle, tooltipPlacement, lineClamp, centered, }: Props): JSX.Element;
12
+ declare function ConstrainedText({ text, tooltipStyle, tooltipPlacement, lineClamp, color, centered, }: Props): JSX.Element;
11
13
  export { ConstrainedText };
12
14
  //# sourceMappingURL=Constrainedtext.component.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Constrainedtext.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/constrainedtext/Constrainedtext.component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAK9C,OAAO,EAAE,KAAK,IAAI,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAGrE,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IACpD,YAAY,CAAC,EAAE,aAAa,CAAC,YAAY,EAAE,cAAc,CAAC,CAAC;IAC3D,gBAAgB,CAAC,EAAE,aAAa,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAwDF,iBAAS,eAAe,CAAC,EACvB,IAAI,EACJ,YAAY,EACZ,gBAAgB,EAChB,SAAa,EACb,QAAgB,GACjB,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAqCrB;AAED,OAAO,EAAE,eAAe,EAAE,CAAC"}
1
+ {"version":3,"file":"Constrainedtext.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/constrainedtext/Constrainedtext.component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAK9C,OAAO,EAAE,KAAK,IAAI,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAErE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IACpD,YAAY,CAAC,EAAE,aAAa,CAAC,YAAY,EAAE,cAAc,CAAC,CAAC;IAC3D,gBAAgB,CAAC,EAAE,aAAa,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,WAAW,CAAC;CAC3B,CAAC;AAwDF,iBAAS,eAAe,CAAC,EACvB,IAAI,EACJ,YAAY,EACZ,gBAAgB,EAChB,SAAa,EACb,KAAK,EACL,QAAgB,GACjB,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAqCrB;AAED,OAAO,EAAE,eAAe,EAAE,CAAC"}
@@ -38,11 +38,11 @@ function isEllipsisActive(element) {
38
38
  function getConstrainedTextContainer(constrainedTextRef, lineClamp, text, centered) {
39
39
  return (_jsx(ConstrainedTextContainer, { ref: constrainedTextRef, className: "sc-constrainedtext", lineClamp: lineClamp, centered: centered, children: text }));
40
40
  }
41
- function ConstrainedText({ text, tooltipStyle, tooltipPlacement, lineClamp = 1, centered = false, }) {
41
+ function ConstrainedText({ text, tooltipStyle, tooltipPlacement, lineClamp = 1, color, centered = false, }) {
42
42
  const [displayToolTip, setDisplayToolTip] = useState(false);
43
43
  const constrainedTextRef = useCallback((element) => {
44
44
  element && text && setDisplayToolTip(isEllipsisActive(element));
45
45
  }, [text]);
46
- return (_jsx(BlockTooltip, { children: displayToolTip ? (_jsx(Tooltip, { overlay: text, overlayStyle: tooltipStyle, placement: tooltipPlacement, children: _jsx(Text, { children: getConstrainedTextContainer(constrainedTextRef, lineClamp, text, centered) }) })) : (_jsx(Text, { children: getConstrainedTextContainer(constrainedTextRef, lineClamp, text, centered) })) }));
46
+ return (_jsx(BlockTooltip, { children: displayToolTip ? (_jsx(Tooltip, { overlay: text, overlayStyle: tooltipStyle, placement: tooltipPlacement, children: _jsx(Text, { color: color, children: getConstrainedTextContainer(constrainedTextRef, lineClamp, text, centered) }) })) : (_jsx(Text, { color: color, children: getConstrainedTextContainer(constrainedTextRef, lineClamp, text, centered) })) }));
47
47
  }
48
48
  export { ConstrainedText };
@@ -1,3 +1,4 @@
1
+ export declare const LONG_DATE_FORMATER: Intl.DateTimeFormat;
1
2
  export declare const DATE_FORMATER: Intl.DateTimeFormat;
2
3
  export declare const DAY_MONTH_FORMATER: Intl.DateTimeFormat;
3
4
  export declare const TIME_SECOND_FORMATER: Intl.DateTimeFormat;
@@ -5,7 +6,7 @@ export declare const TIME_FORMATER: Intl.DateTimeFormat;
5
6
  export declare const DAY_MONTH_ABBREVIATED_HOUR_MINUTE_SECOND: Intl.DateTimeFormat;
6
7
  export declare const DAY_MONTH_ABBREVIATED_HOUR_MINUTE: Intl.DateTimeFormat;
7
8
  type FormattedDateTimeProps = {
8
- format: 'date' | 'date-time' | 'date-time-second' | 'time' | 'time-second' | 'relative' | 'day-month-abbreviated-hour-minute' | 'day-month-abbreviated-hour-minute-second';
9
+ format: 'date' | 'date-time' | 'date-time-second' | 'time' | 'time-second' | 'relative' | 'day-month-abbreviated-hour-minute' | 'day-month-abbreviated-hour-minute-second' | 'long-date' | 'chart-date';
9
10
  value: Date;
10
11
  };
11
12
  export declare const FormattedDateTime: ({ format, value, }: FormattedDateTimeProps) => import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- {"version":3,"file":"FormattedDateTime.d.ts","sourceRoot":"","sources":["../../../src/lib/components/date/FormattedDateTime.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa,qBAKxB,CAAC;AAEH,eAAO,MAAM,kBAAkB,qBAI7B,CAAC;AAEH,eAAO,MAAM,oBAAoB,qBAK/B,CAAC;AAEH,eAAO,MAAM,aAAa,qBAIxB,CAAC;AAEH,eAAO,MAAM,wCAAwC,qBAUpD,CAAC;AAEF,eAAO,MAAM,iCAAiC,qBAM5C,CAAC;AAEH,KAAK,sBAAsB,GAAG;IAC5B,MAAM,EACF,MAAM,GACN,WAAW,GACX,kBAAkB,GAClB,MAAM,GACN,aAAa,GACb,UAAU,GACV,mCAAmC,GACnC,0CAA0C,CAAC;IAC/C,KAAK,EAAE,IAAI,CAAC;CACb,CAAC;AAaF,eAAO,MAAM,iBAAiB,uBAG3B,sBAAsB,4CAiHxB,CAAC"}
1
+ {"version":3,"file":"FormattedDateTime.d.ts","sourceRoot":"","sources":["../../../src/lib/components/date/FormattedDateTime.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,kBAAkB,qBAK7B,CAAC;AAEH,eAAO,MAAM,aAAa,qBAKxB,CAAC;AAEH,eAAO,MAAM,kBAAkB,qBAI7B,CAAC;AAEH,eAAO,MAAM,oBAAoB,qBAK/B,CAAC;AAEH,eAAO,MAAM,aAAa,qBAIxB,CAAC;AAEH,eAAO,MAAM,wCAAwC,qBAUpD,CAAC;AAEF,eAAO,MAAM,iCAAiC,qBAM5C,CAAC;AAEH,KAAK,sBAAsB,GAAG;IAC5B,MAAM,EACF,MAAM,GACN,WAAW,GACX,kBAAkB,GAClB,MAAM,GACN,aAAa,GACb,UAAU,GACV,mCAAmC,GACnC,0CAA0C,GAC1C,WAAW,GACX,YAAY,CAAC;IAEjB,KAAK,EAAE,IAAI,CAAC;CACb,CAAC;AAaF,eAAO,MAAM,iBAAiB,uBAG3B,sBAAsB,4CAqHxB,CAAC"}
@@ -1,6 +1,12 @@
1
1
  import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
2
2
  import { getDateDaysDiff } from './dateDiffer';
3
3
  import { Tooltip } from '../tooltip/Tooltip.component';
4
+ export const LONG_DATE_FORMATER = Intl.DateTimeFormat('en-GB', {
5
+ weekday: 'long',
6
+ year: 'numeric',
7
+ month: 'long',
8
+ day: 'numeric',
9
+ });
4
10
  export const DATE_FORMATER = Intl.DateTimeFormat('fr-CA', {
5
11
  year: 'numeric',
6
12
  month: '2-digit',
@@ -83,6 +89,10 @@ export const FormattedDateTime = ({ format, value, }) => {
83
89
  return (_jsx(_Fragment, { children: DAY_MONTH_ABBREVIATED_HOUR_MINUTE.format(value).replace(',', '') }));
84
90
  case 'day-month-abbreviated-hour-minute-second':
85
91
  return (_jsx(_Fragment, { children: DAY_MONTH_ABBREVIATED_HOUR_MINUTE_SECOND.format(value).replace(',', '') }));
92
+ case 'long-date':
93
+ return _jsx(_Fragment, { children: LONG_DATE_FORMATER.format(value) });
94
+ case 'chart-date':
95
+ return _jsx(_Fragment, { children: DAY_MONTH_FORMATER.format(value).replace(/[ ,]/g, '') });
86
96
  default:
87
97
  return _jsx(_Fragment, {});
88
98
  }
@@ -127,18 +127,16 @@ export declare const iconTable: {
127
127
  Play: string;
128
128
  Mail: string;
129
129
  };
130
- export declare const customIcons: {
131
- 'Remote-user': ({ "aria-label": ariaLabel, color, size }: {
132
- "aria-label": any;
133
- color: any;
134
- size: any;
135
- }) => import("react/jsx-runtime").JSX.Element;
136
- 'Remote-group': ({ "aria-label": ariaLabel, color, size }: {
137
- "aria-label": any;
138
- color: any;
139
- size: any;
140
- }) => import("react/jsx-runtime").JSX.Element;
130
+ type IconProps = {
131
+ 'aria-label'?: string;
132
+ color?: string;
133
+ size?: string;
134
+ icon?: string;
135
+ title?: string;
141
136
  };
137
+ export declare const customIcons: Record<string, ((props: IconProps) => JSX.Element) & {
138
+ displayName?: string;
139
+ }>;
142
140
  export type IconName = keyof typeof iconTable | keyof typeof customIcons;
143
141
  export type IconColor = keyof CoreUITheme;
144
142
  type Props = {
@@ -1 +1 @@
1
- {"version":3,"file":"Icon.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/icon/Icon.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAE7D,OAAO,EACL,aAAa,EAKd,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAOhD,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6HrB,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;;;;;;;CAOvB,CAAC;AAaF,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,GAAG,MAAM,OAAO,WAAW,CAAC;AACzE,MAAM,MAAM,SAAS,GAAG,MAAM,WAAW,CAAC;AAC1C,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,QAAQ,CAAC;IACf,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC,OAAO,CAAC,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAiBF,eAAO,MAAM,WAAW;UAAsB,QAAQ;SAiCrD,CAAC;AA2DF,iBAAS,IAAI,CAAC,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,2CAU7C;AAED,OAAO,EAAE,IAAI,EAAE,CAAC"}
1
+ {"version":3,"file":"Icon.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/icon/Icon.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAE7D,OAAO,EACL,aAAa,EAKd,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAOhD,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6HrB,CAAC;AAEF,KAAK,SAAS,GAAG;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC,KAAK,EAAE,SAAS,KAAK,GAAG,CAAC,OAAO,CAAC,GAAG;IAAE,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,CAOtG,CAAC;AAgBF,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,GAAG,MAAM,OAAO,WAAW,CAAC;AACzE,MAAM,MAAM,SAAS,GAAG,MAAM,WAAW,CAAC;AAC1C,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,QAAQ,CAAC;IACf,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC,OAAO,CAAC,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAiBF,eAAO,MAAM,WAAW;UAAsB,QAAQ;SAiCrD,CAAC;AA2DF,iBAAS,IAAI,CAAC,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,2CAU7C;AAED,OAAO,EAAE,IAAI,EAAE,CAAC"}
@@ -136,6 +136,8 @@ export const customIcons = {
136
136
  'Remote-user': ({ 'aria-label': ariaLabel, color, size }) => (_jsx(RemoteUser, { ariaLabel: ariaLabel, color: color, size: size })),
137
137
  'Remote-group': ({ 'aria-label': ariaLabel, color, size }) => (_jsx(RemoteGroup, { ariaLabel: ariaLabel, color: color, size: size })),
138
138
  };
139
+ customIcons['Remote-user'].displayName = 'RemoteUser';
140
+ customIcons['Remote-group'].displayName = 'RemoteGroup';
139
141
  const IconStyled = styled(FontAwesomeIcon) `
140
142
  ${(props) => {
141
143
  const theme = props.theme;
@@ -25,14 +25,15 @@ export declare function getUnitLabel(unitRange: {
25
25
  };
26
26
  /**
27
27
  * This function manually adds the missing data points with `null` value caused by downtime of the VMs
28
+ * Missing data points are only added when the gap between consecutive data points is bigger than 2 intervals
28
29
  *
29
30
  * @param {array} orginalValues - The array of the data points are already sorted according to the time series
30
31
  * @param {number} startingTimeStamp - The starting timestamp in seconds
31
32
  * @param {number} sampleDuration - The time span value in seconds
32
- * @param {number} sampleFrequency - The time difference between two data points in seconds
33
+ * @param {number} sampleInterval - The time difference between two data points in seconds
33
34
  *
34
35
  */
35
- export declare function addMissingDataPoint(orginalValues: [number, string | null][], startingTimeStamp: number, sampleDuration: number, sampleFrequency: number): [number, string | null][];
36
+ export declare function addMissingDataPoint(orginalValues: [number, number | string | null][], startingTimeStamp?: number, sampleDuration?: number, sampleInterval?: number): [number, number | string | null][];
36
37
  export declare const getRelativeValue: (value: number, base: number) => number;
37
38
  export declare const relativeDatumToOriginalDatum: <T>(datum: T, base: number) => T;
38
39
  export declare const getAbsoluteValue: (relativeValue: number, base: number) => number;
@@ -1 +1 @@
1
- {"version":3,"file":"ChartUtil.d.ts","sourceRoot":"","sources":["../../../src/lib/components/linetemporalchart/ChartUtil.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AACtD,OAAO,+BAA+B,CAAC;AAEvC,MAAM,MAAM,QAAQ,GAAG;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IAEd,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC;IAEtB,eAAe,EAAE,OAAO,CAAC;IAEzB,QAAQ,EAAE,OAAO,CAAC;CACnB,EAAE,CAAC;AAKJ,wBAAgB,qBAAqB,CAAC,SAAS,EAAE,MAAM,UAEtD;AACD,wBAAgB,gBAAgB,CAC9B,2BAA2B,EAAE,KAAK,EAAE,GACnC,QAAQ,CAqBV;AAED,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,GAAG,QAAQ,CAU3E;AAED;;;;;GAKG;AACH,wBAAgB,YAAY,CAC1B,SAAS,EAAE;IACT,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACf,EAAE,EACH,QAAQ,EAAE,MAAM,GACf;IACD,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;CACnB,CAkCA;AAED;;;;;;;;GAQG;AACH,wBAAgB,mBAAmB,CACjC,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC,EAAE,EACxC,iBAAiB,EAAE,MAAM,EACzB,cAAc,EAAE,MAAM,EACtB,eAAe,EAAE,MAAM,GACtB,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC,EAAE,CAsC3B;AAGD,eAAO,MAAM,gBAAgB,UAAW,MAAM,QAAQ,MAAM,WAE3D,CAAC;AACF,eAAO,MAAM,4BAA4B,GAAI,CAAC,SAAS,CAAC,QAAQ,MAAM,KAAG,CAQxE,CAAC;AACF,eAAO,MAAM,gBAAgB,kBAAmB,MAAM,QAAQ,MAAM,WAEnE,CAAC;AAEF,eAAO,MAAM,eAAe,WAAY,KAAK,EAAE,KAAG,MAAM,EAMvD,CAAC"}
1
+ {"version":3,"file":"ChartUtil.d.ts","sourceRoot":"","sources":["../../../src/lib/components/linetemporalchart/ChartUtil.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AACtD,OAAO,+BAA+B,CAAC;AAEvC,MAAM,MAAM,QAAQ,GAAG;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IAEd,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC;IAEtB,eAAe,EAAE,OAAO,CAAC;IAEzB,QAAQ,EAAE,OAAO,CAAC;CACnB,EAAE,CAAC;AAKJ,wBAAgB,qBAAqB,CAAC,SAAS,EAAE,MAAM,UAEtD;AACD,wBAAgB,gBAAgB,CAC9B,2BAA2B,EAAE,KAAK,EAAE,GACnC,QAAQ,CAqBV;AAED,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,GAAG,QAAQ,CAU3E;AAED;;;;;GAKG;AACH,wBAAgB,YAAY,CAC1B,SAAS,EAAE;IACT,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACf,EAAE,EACH,QAAQ,EAAE,MAAM,GACf;IACD,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;CACnB,CAkCA;AAED;;;;;;;;;GASG;AACH,wBAAgB,mBAAmB,CACjC,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC,EAAE,EACjD,iBAAiB,CAAC,EAAE,MAAM,EAC1B,cAAc,CAAC,EAAE,MAAM,EACvB,cAAc,CAAC,EAAE,MAAM,GACtB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC,EAAE,CA2CpC;AAGD,eAAO,MAAM,gBAAgB,UAAW,MAAM,QAAQ,MAAM,WAE3D,CAAC;AACF,eAAO,MAAM,4BAA4B,GAAI,CAAC,SAAS,CAAC,QAAQ,MAAM,KAAG,CAQxE,CAAC;AACF,eAAO,MAAM,gBAAgB,kBAAmB,MAAM,QAAQ,MAAM,WAEnE,CAAC;AAEF,eAAO,MAAM,eAAe,WAAY,KAAK,EAAE,KAAG,MAAM,EAMvD,CAAC"}
@@ -65,42 +65,46 @@ export function getUnitLabel(unitRange, maxValue) {
65
65
  }
66
66
  /**
67
67
  * This function manually adds the missing data points with `null` value caused by downtime of the VMs
68
+ * Missing data points are only added when the gap between consecutive data points is bigger than 2 intervals
68
69
  *
69
70
  * @param {array} orginalValues - The array of the data points are already sorted according to the time series
70
71
  * @param {number} startingTimeStamp - The starting timestamp in seconds
71
72
  * @param {number} sampleDuration - The time span value in seconds
72
- * @param {number} sampleFrequency - The time difference between two data points in seconds
73
+ * @param {number} sampleInterval - The time difference between two data points in seconds
73
74
  *
74
75
  */
75
- export function addMissingDataPoint(orginalValues, startingTimeStamp, sampleDuration, sampleFrequency) {
76
+ export function addMissingDataPoint(orginalValues, startingTimeStamp, sampleDuration, sampleInterval) {
76
77
  if (!orginalValues ||
77
78
  startingTimeStamp === undefined ||
78
79
  !sampleDuration ||
79
- !sampleFrequency ||
80
+ !sampleInterval ||
80
81
  startingTimeStamp < 0 ||
81
82
  sampleDuration <= 0 ||
82
- sampleFrequency <= 0) {
83
+ sampleInterval <= 0) {
83
84
  return [];
84
85
  }
85
- const newValues = [];
86
- const numberOfDataPoints = sampleDuration / sampleFrequency + 1;
87
- let samplingPointTime = startingTimeStamp;
88
- // initialize the array with all "NAN" value, in order for the tooltip to display dash(-)
89
- for (let i = 0; i < numberOfDataPoints; i++) {
90
- newValues.push([samplingPointTime, NAN_STRING]);
91
- samplingPointTime += sampleFrequency;
92
- }
93
- // copy the existing data points from `orginalValue` array to `newValues`
94
- if (newValues.length === 0)
86
+ // If there are no original values, return empty array
87
+ if (orginalValues.length === 0) {
95
88
  return [];
96
- let nextIndex = 0;
97
- for (let i = 0; i < newValues.length; i++) {
98
- if (orginalValues[nextIndex] &&
99
- newValues[i][0] === orginalValues[nextIndex][0]) {
100
- newValues[i][1] = orginalValues[nextIndex][1];
101
- nextIndex++;
89
+ }
90
+ const newValues = [];
91
+ // Process all but the last element
92
+ for (let i = 0; i < orginalValues.length - 1; i++) {
93
+ // Always add the current data point
94
+ newValues.push(orginalValues[i]);
95
+ const currentTimestamp = orginalValues[i][0];
96
+ const nextTimestamp = orginalValues[i + 1][0];
97
+ const gap = nextTimestamp - currentTimestamp;
98
+ // Calculate how many missing points to add
99
+ const missingIntervals = Math.floor(gap / sampleInterval) - 1;
100
+ // Add missing data points with NAN_STRING (only executes if missingIntervals > 0)
101
+ for (let j = 1; j <= missingIntervals; j++) {
102
+ const missingTimestamp = currentTimestamp + j * sampleInterval;
103
+ newValues.push([missingTimestamp, NAN_STRING]);
102
104
  }
103
105
  }
106
+ // Add the last element
107
+ newValues.push(orginalValues[orginalValues.length - 1]);
104
108
  return newValues;
105
109
  }
106
110
  // get the value for the based value
@@ -37,6 +37,10 @@ export type LineChartProps = {
37
37
  unitLabel: string;
38
38
  }, tooltipData: any) => string;
39
39
  };
40
+ /**
41
+ * @deprecated Use LineTimeSerieChart instead
42
+ * @example import { LineTimeSerieChart } from '@scality/core-ui/dist/next';
43
+ */
40
44
  declare function LineTemporalChart({ series, title, height, startingTimeStamp, unitRange, isLoading, isLegendHidden, yAxisType, yAxisTitle, helpText, renderTooltipSerie, onHover, ...rest }: LineChartProps): import("react/jsx-runtime").JSX.Element;
41
45
  export { LineTemporalChart };
42
46
  //# sourceMappingURL=LineTemporalChart.component.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"LineTemporalChart.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/linetemporalchart/LineTemporalChart.component.tsx"],"names":[],"mappings":"AAoCA,eAAO,MAAM,sBAAsB,uBAAuB,CAAC;AAC3D,eAAO,MAAM,kBAAkB,mBAAmB,CAAC;AACnD,eAAO,MAAM,aAAa;;;GAqBzB,CAAC;AA+BF,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,EAAE,MAAM,CAAC;IAEjB,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IAEhC,eAAe,EAAE,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAEtE,cAAc,CAAC,EAAE,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAEtE,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AACF,MAAM,MAAM,cAAc,GAAG;IAC3B,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,iBAAiB,EAAE,MAAM,CAAC;IAE1B,SAAS,CAAC,EAAE;QACV,SAAS,EAAE,MAAM,CAAC;QAClB,KAAK,EAAE,MAAM,CAAC;KACf,EAAE,CAAC;IACJ,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,aAAa,CAAC;IACrD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAChC,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,GAAG,KAAK,IAAI,CAAC;IACnC,kBAAkB,CAAC,EAAE,CACnB,IAAI,EAAE;QACJ,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,OAAO,CAAC;QACvB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;QACd,GAAG,EAAE,MAAM,CAAC;QACZ,SAAS,EAAE,MAAM,CAAC;KACnB,EACD,WAAW,EAAE,GAAG,KACb,MAAM,CAAC;CACb,CAAC;AAkCF,iBAAS,iBAAiB,CAAC,EACzB,MAAM,EACN,KAAK,EACL,MAAM,EACN,iBAAiB,EACjB,SAAS,EACT,SAAiB,EACjB,cAAsB,EACtB,SAAqB,EACrB,UAAU,EACV,QAAQ,EACR,kBAAkB,EAClB,OAAO,EACP,GAAG,IAAI,EACR,EAAE,cAAc,2CAomBhB;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAC"}
1
+ {"version":3,"file":"LineTemporalChart.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/linetemporalchart/LineTemporalChart.component.tsx"],"names":[],"mappings":"AAoCA,eAAO,MAAM,sBAAsB,uBAAuB,CAAC;AAC3D,eAAO,MAAM,kBAAkB,mBAAmB,CAAC;AACnD,eAAO,MAAM,aAAa;;;GAqBzB,CAAC;AA+BF,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,EAAE,MAAM,CAAC;IAEjB,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IAEhC,eAAe,EAAE,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAEtE,cAAc,CAAC,EAAE,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAEtE,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AACF,MAAM,MAAM,cAAc,GAAG;IAC3B,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,iBAAiB,EAAE,MAAM,CAAC;IAE1B,SAAS,CAAC,EAAE;QACV,SAAS,EAAE,MAAM,CAAC;QAClB,KAAK,EAAE,MAAM,CAAC;KACf,EAAE,CAAC;IACJ,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,aAAa,CAAC;IACrD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAChC,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,GAAG,KAAK,IAAI,CAAC;IACnC,kBAAkB,CAAC,EAAE,CACnB,IAAI,EAAE;QACJ,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,OAAO,CAAC;QACvB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;QACd,GAAG,EAAE,MAAM,CAAC;QACZ,SAAS,EAAE,MAAM,CAAC;KACnB,EACD,WAAW,EAAE,GAAG,KACb,MAAM,CAAC;CACb,CAAC;AAkCF;;;GAGG;AACH,iBAAS,iBAAiB,CAAC,EACzB,MAAM,EACN,KAAK,EACL,MAAM,EACN,iBAAiB,EACjB,SAAS,EACT,SAAiB,EACjB,cAAsB,EACtB,SAAqB,EACrB,UAAU,EACV,QAAQ,EACR,kBAAkB,EAClB,OAAO,EACP,GAAG,IAAI,EACR,EAAE,cAAc,2CAomBhB;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAC"}
@@ -94,6 +94,10 @@ const colorRange = [
94
94
  darken(0.3, lineColor8),
95
95
  ];
96
96
  // Note: we need to make sure the start time and end timefor the prometheus query between the series are the same.
97
+ /**
98
+ * @deprecated Use LineTimeSerieChart instead
99
+ * @example import { LineTimeSerieChart } from '@scality/core-ui/dist/next';
100
+ */
97
101
  function LineTemporalChart({ series, title, height, startingTimeStamp, unitRange, isLoading = false, isLegendHidden = false, yAxisType = 'default', yAxisTitle, helpText, renderTooltipSerie, onHover, ...rest }) {
98
102
  // property validation
99
103
  if (!['default', 'percentage', 'symmetrical'].includes(yAxisType)) {
@@ -1,6 +1,6 @@
1
1
  export type Serie = {
2
2
  resource: string;
3
- data: [number, string | null][];
3
+ data: [number, number | string | null][];
4
4
  getTooltipLabel: (metricPrefix?: string, resource?: string) => string;
5
5
  metricPrefix?: string;
6
6
  isLineDashed?: boolean;
@@ -20,6 +20,8 @@ export type LineChartProps = (NonSymmetricalChartSerie | SymmetricalChartSerie)
20
20
  title: string;
21
21
  height: number;
22
22
  startingTimeStamp: number;
23
+ interval: number;
24
+ duration: number;
23
25
  unitRange?: {
24
26
  threshold: number;
25
27
  label: string;
@@ -28,6 +30,6 @@ export type LineChartProps = (NonSymmetricalChartSerie | SymmetricalChartSerie)
28
30
  yAxisTitle?: string;
29
31
  helpText?: string;
30
32
  };
31
- export declare function LineTimeSerieChart({ series, title, height, startingTimeStamp, unitRange, isLoading, yAxisType, yAxisTitle, helpText, ...rest }: LineChartProps): import("react/jsx-runtime").JSX.Element;
33
+ export declare function LineTimeSerieChart({ series, title, height, startingTimeStamp, interval, duration, unitRange, isLoading, yAxisType, yAxisTitle, helpText, ...rest }: LineChartProps): import("react/jsx-runtime").JSX.Element;
32
34
  export {};
33
35
  //# sourceMappingURL=linetimeseriechart.component.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"linetimeseriechart.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/linetimeseriechart/linetimeseriechart.component.tsx"],"names":[],"mappings":"AA2FA,MAAM,MAAM,KAAK,GAAG;IAElB,QAAQ,EAAE,MAAM,CAAC;IAEjB,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IAEhC,eAAe,EAAE,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAEtE,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF,KAAK,wBAAwB,GAAG;IAC9B,SAAS,CAAC,EAAE,SAAS,GAAG,YAAY,CAAC;IACrC,MAAM,EAAE,KAAK,EAAE,CAAC;CACjB,CAAC;AAGF,KAAK,qBAAqB,GAAG;IAC3B,SAAS,EAAE,aAAa,CAAC;IACzB,MAAM,EAAE;QACN,KAAK,EAAE,KAAK,EAAE,CAAC;QACf,KAAK,EAAE,KAAK,EAAE,CAAC;KAChB,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,CACzB,wBAAwB,GACxB,qBAAqB,CACxB,GAAG;IACF,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,iBAAiB,EAAE,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE;QACV,SAAS,EAAE,MAAM,CAAC;QAClB,KAAK,EAAE,MAAM,CAAC;KACf,EAAE,CAAC;IACJ,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAiEF,wBAAgB,kBAAkB,CAAC,EACjC,MAAM,EACN,KAAK,EACL,MAAM,EACN,iBAAiB,EACjB,SAAS,EACT,SAAiB,EACjB,SAAqB,EACrB,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,cAAc,2CAqShB"}
1
+ {"version":3,"file":"linetimeseriechart.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/linetimeseriechart/linetimeseriechart.component.tsx"],"names":[],"mappings":"AA0FA,MAAM,MAAM,KAAK,GAAG;IAElB,QAAQ,EAAE,MAAM,CAAC;IAEjB,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IAEzC,eAAe,EAAE,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAEtE,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF,KAAK,wBAAwB,GAAG;IAC9B,SAAS,CAAC,EAAE,SAAS,GAAG,YAAY,CAAC;IACrC,MAAM,EAAE,KAAK,EAAE,CAAC;CACjB,CAAC;AAGF,KAAK,qBAAqB,GAAG;IAC3B,SAAS,EAAE,aAAa,CAAC;IACzB,MAAM,EAAE;QACN,KAAK,EAAE,KAAK,EAAE,CAAC;QACf,KAAK,EAAE,KAAK,EAAE,CAAC;KAChB,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,CACzB,wBAAwB,GACxB,qBAAqB,CACxB,GAAG;IACF,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,iBAAiB,EAAE,MAAM,CAAC;IAC1B,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE;QACV,SAAS,EAAE,MAAM,CAAC;QAClB,KAAK,EAAE,MAAM,CAAC;KACf,EAAE,CAAC;IACJ,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAiEF,wBAAgB,kBAAkB,CAAC,EACjC,MAAM,EACN,KAAK,EACL,MAAM,EACN,iBAAiB,EACjB,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,SAAiB,EACjB,SAAqB,EACrB,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,cAAc,2CAoShB"}
@@ -2,7 +2,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Line, LineChart, ReferenceLine, ResponsiveContainer, Tooltip, XAxis, YAxis, CartesianGrid, } from 'recharts';
3
3
  import { useMemo, useRef } from 'react';
4
4
  import { useTheme } from 'styled-components';
5
- import { useMetricsTimeSpan } from '../linetemporalchart/MetricTimespanProvider';
6
5
  import { addMissingDataPoint } from '../linetemporalchart/ChartUtil';
7
6
  import styled from 'styled-components';
8
7
  import { fontSize, fontWeight } from '../../style/theme';
@@ -91,9 +90,8 @@ const CustomTooltip = ({ active, payload, label, unitLabel, }) => {
91
90
  const isSymmetricalSeries = (series) => {
92
91
  return 'above' in series && 'below' in series;
93
92
  };
94
- export function LineTimeSerieChart({ series, title, height, startingTimeStamp, unitRange, isLoading = false, yAxisType = 'default', yAxisTitle, helpText, ...rest }) {
93
+ export function LineTimeSerieChart({ series, title, height, startingTimeStamp, interval, duration, unitRange, isLoading = false, yAxisType = 'default', yAxisTitle, helpText, ...rest }) {
95
94
  const theme = useTheme();
96
- const { frequency, duration } = useMetricsTimeSpan();
97
95
  const { getColor } = useChartLegend();
98
96
  const chartRef = useRef(null);
99
97
  const chartData = useMemo(() => {
@@ -102,17 +100,17 @@ export function LineTimeSerieChart({ series, title, height, startingTimeStamp, u
102
100
  ? {
103
101
  above: series.above.map((line) => ({
104
102
  ...line,
105
- data: addMissingDataPoint(line.data, startingTimeStamp, duration, frequency),
103
+ data: addMissingDataPoint(line.data, startingTimeStamp, duration, interval),
106
104
  })),
107
105
  // Convert positive values to negative values
108
106
  below: series.below.map((line) => ({
109
107
  ...line,
110
- data: addMissingDataPoint(line.data, startingTimeStamp, duration, frequency).map(([timestamp, value]) => [timestamp, value === null ? null : `-${Number(value)}`]),
108
+ data: addMissingDataPoint(line.data, startingTimeStamp, duration, interval).map(([timestamp, value]) => [timestamp, value === null ? null : `-${Number(value)}`]),
111
109
  })),
112
110
  }
113
111
  : series.map((line) => ({
114
112
  ...line,
115
- data: addMissingDataPoint(line.data, startingTimeStamp, duration, frequency),
113
+ data: addMissingDataPoint(line.data, startingTimeStamp, duration, interval),
116
114
  }));
117
115
  // 2. Convert directly to Recharts format
118
116
  // Initialize an object to hold data points by timestamp
@@ -136,7 +134,7 @@ export function LineTimeSerieChart({ series, title, height, startingTimeStamp, u
136
134
  });
137
135
  // Convert object to array for Recharts
138
136
  return Object.values(dataPointsByTime).sort((a, b) => a.timestamp - b.timestamp);
139
- }, [series, startingTimeStamp, duration, frequency, yAxisType]);
137
+ }, [series, startingTimeStamp, duration, interval, yAxisType]);
140
138
  // Calculate 5 perfectly evenly spaced ticks
141
139
  const xAxisTicks = useMemo(() => {
142
140
  if (!chartData || chartData.length === 0)
@@ -99,7 +99,7 @@ export const GentleEmphaseSecondaryText = styled(SecondaryText) `
99
99
  : ''}
100
100
  `;
101
101
  export const Text = styled.span `
102
- color: ${(props) => props.theme[props.color || 'textPrimary']};
102
+ ${(props) => props.color && `color: ${props.theme[props.color]};`}
103
103
  ${(props) => props.variant === 'Larger'
104
104
  ? `
105
105
  font-size: 1.43rem;
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/toast/Toast.component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAU,MAAM,OAAO,CAAC;AAM1C,OAAO,EAAE,aAAa,EAAkB,MAAM,wBAAwB,CAAC;AAKvE,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;AAEnE,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,SAAS,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IACrC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,qBAAqB,WAAY,MAAM,WAYnD,CAAC;AA6DF,iBAAS,KAAK,CAAC,EACb,IAAI,EACJ,OAAO,EACP,OAAO,EACP,QAAsB,EACtB,MAAe,EACf,WAAkB,EAClB,QAAe,EACf,IAAsC,EACtC,KAAqB,EACrB,eAAuB,EACvB,KAAK,GACN,EAAE,UAAU,kDAmEZ;AAED,OAAO,EAAE,KAAK,EAAE,CAAC"}
1
+ {"version":3,"file":"Toast.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/toast/Toast.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAU,MAAM,OAAO,CAAC;AAM1C,OAAO,EAAE,aAAa,EAAkB,MAAM,wBAAwB,CAAC;AAKvE,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;AAEnE,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,SAAS,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IACrC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,qBAAqB,WAAY,MAAM,WAYnD,CAAC;AAsFF,iBAAS,KAAK,CAAC,EACb,IAAI,EACJ,OAAO,EACP,OAAO,EACP,QAAsB,EACtB,MAAe,EACf,WAAkB,EAClB,QAAe,EACf,IAAsC,EACtC,KAAqB,EACrB,eAAuB,EACvB,KAAK,GACN,EAAE,UAAU,kDAmDZ;AAED,OAAO,EAAE,KAAK,EAAE,CAAC"}
@@ -1,5 +1,4 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { motion } from 'framer-motion';
3
2
  import { useRef } from 'react';
4
3
  import { useTheme } from 'styled-components';
5
4
  import { Box } from '../box/Box';
@@ -75,6 +74,29 @@ const ContentContainer = styled.div `
75
74
  padding: 0px 16px;
76
75
  position: relative;
77
76
  `;
77
+ const FadingToast = styled.div `
78
+ align-items: flex-end;
79
+ background-color: ${props => props.theme.backgroundLevel1};
80
+ border: 1px solid ${props => props.theme.border};
81
+ box-shadow: 0px 4px 10px 4px #000;
82
+ display: flex;
83
+ border-radius: 4px;
84
+ position: relative;
85
+
86
+ @keyframes toastEnter {
87
+ from {
88
+ opacity: 0;
89
+ transform: translateY(-20px);
90
+ }
91
+ to {
92
+ opacity: 1;
93
+ transform: translateY(0);
94
+ }
95
+ }
96
+ `;
97
+ const ToastEnter = styled(FadingToast) `
98
+ animation: toastEnter 0.3s ease forwards;
99
+ `;
78
100
  function Toast({ open, message, onClose, position = 'top-right', status = 'info', autoDismiss = true, duration = 5000, icon = _jsx(DefaultIcon, { status: status }), width = DEFAULT_WIDTH, withProgressBar = false, style, }) {
79
101
  const ref = useRef(null);
80
102
  const { params } = useToastParameters({
@@ -85,7 +107,6 @@ function Toast({ open, message, onClose, position = 'top-right', status = 'info'
85
107
  const positionStyle = positionOutput[position];
86
108
  const bgColor = useGetBackgroundColor(status);
87
109
  const rgbBgColor = useGetRgbBackgroundColor(status);
88
- const theme = useTheme();
89
110
  if (!open) {
90
111
  return null;
91
112
  }
@@ -93,14 +114,6 @@ function Toast({ open, message, onClose, position = 'top-right', status = 'info'
93
114
  position: 'fixed',
94
115
  ...(style || positionStyle),
95
116
  width,
96
- }, children: [_jsxs(motion.div, { initial: { opacity: 0, y: -20 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: 20 }, transition: { duration: 0.3 }, style: {
97
- alignItems: 'flex-end',
98
- backgroundColor: theme.backgroundLevel1,
99
- border: `1px solid ${theme.border}`,
100
- boxShadow: '0px 4px 10px 4px #000',
101
- display: 'flex',
102
- borderRadius: '4px',
103
- position: 'relative',
104
- }, children: [_jsx(IconContainer, { bgColor: rgbBgColor, children: icon }), _jsx(ContentContainer, { children: _jsx(BasicText, { children: message }) }), _jsx(Box, { display: "flex", alignItems: "center", alignSelf: "stretch", children: _jsx(Button, { icon: _jsx(Icon, { name: "Close", size: "lg", color: "textSecondary" }), onClick: params === null || params === void 0 ? void 0 : params.onClose, "aria-label": "Close", tooltip: { overlay: 'Close', placement: 'top' } }) })] }, "toast"), withProgressBar && (_jsx(DurationBasedProgressBar, { duration: autoDismiss ? duration : null, color: bgColor }))] }));
117
+ }, children: [_jsxs(ToastEnter, { children: [_jsx(IconContainer, { bgColor: rgbBgColor, children: icon }), _jsx(ContentContainer, { children: _jsx(BasicText, { children: message }) }), _jsx(Box, { display: "flex", alignItems: "center", alignSelf: "stretch", children: _jsx(Button, { icon: _jsx(Icon, { name: "Close", size: "lg", color: "textSecondary" }), onClick: params === null || params === void 0 ? void 0 : params.onClose, "aria-label": "Close", tooltip: { overlay: 'Close', placement: 'top' } }) })] }), withProgressBar && (_jsx(DurationBasedProgressBar, { duration: autoDismiss ? duration : null, color: bgColor }))] }));
105
118
  }
106
119
  export { Toast };
package/dist/index.d.ts CHANGED
@@ -1,8 +1,6 @@
1
1
  export { Banner } from './components/banner/Banner.component';
2
2
  export { Breadcrumb } from './components/breadcrumb/Breadcrumb.component';
3
- export { Button } from './components/button/Button.component';
4
3
  export { Checkbox } from './components/checkbox/Checkbox.component';
5
- export { Chips } from './components/chips/Chips.component';
6
4
  export { Dropdown } from './components/dropdown/Dropdown.component';
7
5
  export { LOADER_SIZE, STATUS_CRITICAL, STATUS_WARNING, STATUS_SUCCESS, STATUS_HEALTHY, STATUS_INFO, STATUS_UNKNOWN, STATUS_NONE, Status, } from './components/constants';
8
6
  export { Layout } from './components/layout/Layout.component';
@@ -11,22 +9,14 @@ export { Modal } from './components/modal/Modal.component';
11
9
  export { Navbar } from './components/navbar/Navbar.component';
12
10
  export { Notifications } from './components/notifications/Notifications.component';
13
11
  export { SearchInput } from './components/searchinput/SearchInput.component';
14
- export { Select } from './components/select/Select.component';
15
12
  export { Sidebar } from './components/sidebar/Sidebar.component';
16
13
  export { Steppers } from './components/steppers/Steppers.component';
17
14
  export { Toggle } from './components/toggle/Toggle.component';
18
15
  export { Tooltip } from './components/tooltip/Tooltip.component';
19
- export { MultiSelect } from './components/multiselect/MultiSelect.component';
20
- export { VegaChart } from './components/vegachart/VegaChart.component';
21
- export { LineChart } from './components/linechart/LineChart.component';
22
16
  export { ProgressBar } from './components/progressbar/ProgressBar.component';
23
17
  export { TextArea } from './components/textarea/TextArea.component';
24
- export { CloudProgressBar } from './components/cloudprogressbar/CloudProgressBar.component';
25
- export { Sparkline } from './components/sparkline/SparkLine.component';
26
18
  export { BarChart } from './components/barchart/BarChart.component';
27
19
  export { CircularProgressBar } from './components/circularprogressbar/CircularProgressBar.component';
28
- export { AreaChart } from './components/areachart/AreaChart.component';
29
- export { CollapsiblePanel } from './components/collapsiblepanel/CollapsiblePanel.component';
30
20
  export { LateralNavbarLayout } from './components/lateralnavbarlayout/LateralNavbarLayout.component';
31
21
  export { GlobalHealthBar } from './components/globalhealthbar/GlobalHealthBar.component';
32
22
  export { ConstrainedText } from './components/constrainedtext/Constrainedtext.component';
@@ -38,7 +28,6 @@ export { ErrorPage404 } from './components/error-pages/ErrorPage404.component';
38
28
  export { ErrorPage500 } from './components/error-pages/ErrorPage500.component';
39
29
  export { ErrorPageAuth } from './components/error-pages/ErrorPageAuth.component';
40
30
  export { TextBadge } from './components/textbadge/TextBadge.component';
41
- export { SpacedBox } from './components/spacedbox/SpacedBox';
42
31
  export { Layout as Layout2 } from './components/layout/v2';
43
32
  export { TwoPanelLayout } from './components/layout/v2/panels';
44
33
  export { AppContainer } from './components/layout/v2/AppContainer';
@@ -61,4 +50,5 @@ export { InfoMessage } from './components/infomessage/InfoMessage.component';
61
50
  export { InputList } from './components/inputlist/InputList.component';
62
51
  export { InlineInput } from './components/inlineinput/InlineInput';
63
52
  export { UnsuccessfulResult } from './components/UnsuccessfulResult.component';
53
+ export { CoreUITheme } from './style/theme';
64
54
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/lib/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/lib/index.ts"],"names":[],"mappings":"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"}