@scality/core-ui 0.166.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 (104) 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/button/Button.component.d.ts +2 -1
  7. package/dist/components/button/Button.component.d.ts.map +1 -1
  8. package/dist/components/button/Button.component.js +2 -1
  9. package/dist/components/chartlegend/ChartLegend.d.ts.map +1 -1
  10. package/dist/components/chartlegend/ChartLegend.js +7 -13
  11. package/dist/components/chartlegend/ChartLegendWrapper.d.ts +1 -2
  12. package/dist/components/chartlegend/ChartLegendWrapper.d.ts.map +1 -1
  13. package/dist/components/chartlegend/ChartLegendWrapper.js +4 -9
  14. package/dist/components/icon/Icon.component.d.ts +9 -11
  15. package/dist/components/icon/Icon.component.d.ts.map +1 -1
  16. package/dist/components/icon/Icon.component.js +2 -0
  17. package/dist/components/linetemporalchart/ChartUtil.d.ts +3 -2
  18. package/dist/components/linetemporalchart/ChartUtil.d.ts.map +1 -1
  19. package/dist/components/linetemporalchart/ChartUtil.js +24 -20
  20. package/dist/components/linetemporalchart/LineTemporalChart.component.d.ts +4 -0
  21. package/dist/components/linetemporalchart/LineTemporalChart.component.d.ts.map +1 -1
  22. package/dist/components/linetemporalchart/LineTemporalChart.component.js +4 -0
  23. package/dist/components/linetimeseriechart/linetimeseriechart.component.d.ts +1 -1
  24. package/dist/components/linetimeseriechart/linetimeseriechart.component.d.ts.map +1 -1
  25. package/dist/index.d.ts +1 -11
  26. package/dist/index.d.ts.map +1 -1
  27. package/dist/index.js +0 -11
  28. package/dist/next.d.ts +1 -0
  29. package/dist/next.d.ts.map +1 -1
  30. package/jest.config.js +1 -0
  31. package/package.json +16 -37
  32. package/src/lib/components/barchart/BarChart.component.tsx +5 -0
  33. package/src/lib/components/button/Button.component.tsx +2 -1
  34. package/src/lib/components/chartlegend/ChartLegend.test.tsx +17 -0
  35. package/src/lib/components/chartlegend/ChartLegend.tsx +6 -12
  36. package/src/lib/components/chartlegend/ChartLegendWrapper.tsx +5 -13
  37. package/src/lib/components/icon/Icon.component.tsx +12 -1
  38. package/src/lib/components/linetemporalchart/ChartUtil.test.ts +23 -35
  39. package/src/lib/components/linetemporalchart/ChartUtil.ts +32 -26
  40. package/src/lib/components/linetemporalchart/LineTemporalChart.component.tsx +19 -15
  41. package/src/lib/components/linetimeseriechart/linetimeseriechart.component.tsx +5 -5
  42. package/src/lib/components/selectv2/selectv2.test.tsx +1 -1
  43. package/src/lib/components/toast/useMutationsHandler.test.tsx +22 -32
  44. package/src/lib/index.ts +6 -11
  45. package/src/lib/next.ts +1 -0
  46. package/stories/barchart.stories.tsx +1 -1
  47. package/stories/card.stories.tsx +7 -5
  48. package/stories/controls.ts +19 -20
  49. package/stories/linecharttemporal.stories.tsx +1 -1
  50. package/stories/linetimeseriechart.stories.tsx +49 -0
  51. package/stories/navbar.stories.tsx +103 -0
  52. package/stories/tabsv2.stories.tsx +51 -56
  53. package/dist/components/areachart/AreaChart.component.d.ts +0 -13
  54. package/dist/components/areachart/AreaChart.component.d.ts.map +0 -1
  55. package/dist/components/areachart/AreaChart.component.js +0 -27
  56. package/dist/components/chips/Chips.component.d.ts +0 -21
  57. package/dist/components/chips/Chips.component.d.ts.map +0 -1
  58. package/dist/components/chips/Chips.component.js +0 -105
  59. package/dist/components/cloudprogressbar/CloudProgressBar.component.d.ts +0 -10
  60. package/dist/components/cloudprogressbar/CloudProgressBar.component.d.ts.map +0 -1
  61. package/dist/components/cloudprogressbar/CloudProgressBar.component.js +0 -38
  62. package/dist/components/collapsiblepanel/CollapsiblePanel.component.d.ts +0 -9
  63. package/dist/components/collapsiblepanel/CollapsiblePanel.component.d.ts.map +0 -1
  64. package/dist/components/collapsiblepanel/CollapsiblePanel.component.js +0 -44
  65. package/dist/components/linechart/LineChart.component.d.ts +0 -21
  66. package/dist/components/linechart/LineChart.component.d.ts.map +0 -1
  67. package/dist/components/linechart/LineChart.component.js +0 -109
  68. package/dist/components/multiselect/MultiSelect.component.d.ts +0 -28
  69. package/dist/components/multiselect/MultiSelect.component.d.ts.map +0 -1
  70. package/dist/components/multiselect/MultiSelect.component.js +0 -73
  71. package/dist/components/select/Select.component.d.ts +0 -14
  72. package/dist/components/select/Select.component.d.ts.map +0 -1
  73. package/dist/components/select/Select.component.js +0 -71
  74. package/dist/components/spacedbox/SpacedBox.d.ts +0 -34
  75. package/dist/components/spacedbox/SpacedBox.d.ts.map +0 -1
  76. package/dist/components/spacedbox/SpacedBox.js +0 -64
  77. package/dist/components/sparkline/SparkLine.component.d.ts +0 -18
  78. package/dist/components/sparkline/SparkLine.component.d.ts.map +0 -1
  79. package/dist/components/sparkline/SparkLine.component.js +0 -148
  80. package/dist/components/vegachart/VegaChart.component.d.ts +0 -13
  81. package/dist/components/vegachart/VegaChart.component.d.ts.map +0 -1
  82. package/dist/components/vegachart/VegaChart.component.js +0 -120
  83. package/plopfile.js +0 -38
  84. package/src/lib/components/areachart/AreaChart.component.tsx +0 -49
  85. package/src/lib/components/chips/Chips.component.tsx +0 -169
  86. package/src/lib/components/cloudprogressbar/CloudProgressBar.component.tsx +0 -105
  87. package/src/lib/components/collapsiblepanel/CollapsiblePanel.component.tsx +0 -77
  88. package/src/lib/components/linechart/LineChart.component.tsx +0 -152
  89. package/src/lib/components/multiselect/MultiSelect.component.tsx +0 -158
  90. package/src/lib/components/select/Select.component.tsx +0 -98
  91. package/src/lib/components/spacedbox/SpacedBox.ts +0 -116
  92. package/src/lib/components/sparkline/SparkLine.component.tsx +0 -176
  93. package/src/lib/components/vegachart/VegaChart.component.tsx +0 -146
  94. package/stories/areachart.stories.tsx +0 -120
  95. package/stories/chips.stories.tsx +0 -107
  96. package/stories/cloudprogressbar.stories.tsx +0 -93
  97. package/stories/collapsiblepanel.stories.tsx +0 -57
  98. package/stories/data/areachart.ts +0 -122
  99. package/stories/data/sparklinechart.ts +0 -164
  100. package/stories/linechart.stories.tsx +0 -319
  101. package/stories/multiselect.stories.tsx +0 -126
  102. package/stories/select.stories.tsx +0 -52
  103. package/stories/sparkline.stories.tsx +0 -85
  104. package/stories/vegachart.stories.tsx +0 -98
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { QueryClient, QueryClientProvider } from 'react-query';
3
3
  import { CoreUiThemeProvider } from '../src/lib/next';
4
- import { brand, coreUIAvailableThemes } from '../src/lib/style/theme';
4
+ import { coreUIAvailableThemes } from '../src/lib/style/theme';
5
5
  import { Wrapper } from '../stories/common';
6
6
  import { ToastProvider } from '../src/lib';
7
7
 
@@ -72,9 +72,11 @@ export const parameters = {
72
72
  controls: {
73
73
  //All props with color in name will automatically have a control 'color'
74
74
  //with colors presets to theme colors, possible to have the color name from theme in control
75
- presetColors: Object.entries(brand).map((color) => {
76
- return { color: color[1], title: color[0] };
77
- }),
75
+ presetColors: Object.entries(coreUIAvailableThemes.darkRebrand).map(
76
+ (color) => {
77
+ return { color: color[1], title: color[0] };
78
+ },
79
+ ),
78
80
  matchers: {
79
81
  color: /color/i,
80
82
  },
package/README.md CHANGED
@@ -11,38 +11,21 @@ Core-UI is a component library containing all components, layouts, icons and the
11
11
  - Add `@scality/core-ui` in the `package.json`'s dependencies of your project.
12
12
 
13
13
  ```json
14
- "@scality/core-ui": "0.115.0",
14
+ "@scality/core-ui": "^0.165.0",
15
15
  ```
16
16
 
17
17
  - `@scality/core-ui` requires the peerDependencies below. Make sure that you have them in the `package.json`'s dependencies.
18
18
 
19
19
  ```json
20
- "@fortawesome/fontawesome-free": "^5.10.2",
21
- "@fortawesome/fontawesome-svg-core": "^1.2.35",
22
- "@fortawesome/free-regular-svg-icons": "^5.15.3",
23
- "@fortawesome/free-solid-svg-icons": "^5.15.3",
24
- "@fortawesome/react-fontawesome": "^0.1.14",
25
- "@js-temporal/polyfill": "^0.4.4",
26
- "polished": "3.4.1",
27
- "pretty-bytes": "^5.6.0",
28
- "react": "^17.0.2",
29
- "react-debounce-input": "3.2.2",
30
- "react-dom": "^17.0.2",
31
- "react-dropzone": "^14.2.3",
20
+ "react": "^18.0.0",
21
+ "react-dom": "^18.0.0",
22
+ // to provides a Provider to the components using react-query
32
23
  "react-query": "^3.34.0",
33
- "react-router": "^5.2.0",
34
- "react-router-dom": "^5.2.0",
35
- "react-select": "4.3.1",
36
- "react-table": "^7.7.0",
37
- "react-virtualized": "9.22.3",
38
- "react-virtualized-auto-sizer": "^1.0.5",
39
- "react-window": "^1.8.6",
40
- "styled-components": "^4.1.2",
41
- "styled-system": "^5.1.5",
42
- "vega": "^5.17.3",
43
- "vega-embed": "^6.0.0",
44
- "vega-lite": "^5.0.0",
45
- "vega-tooltip": "^0.27.0"
24
+ // for the components using react router
25
+ "react-router": "^7.0.1",
26
+ "react-router-dom": "^7.0.1",
27
+ // for legacy chart components
28
+ "canvas": "^2.10.1",
46
29
  ```
47
30
 
48
31
  - Install the dependencies :
@@ -90,51 +73,23 @@ import { coreUIAvailableThemes as themes } from '@scality/core-ui/dist/style/the
90
73
 
91
74
  There is 2 default theme available in Core-UI : you can find them [here](https://github.com/scality/core-ui/pull/684#:~:text=https%3A//github.com/scality/core%2Dui/blob/development/1.0/src/lib/style/theme.ts)
92
75
 
93
- <br/>
94
-
95
- You can also modify or create a new theme. In this case make sure to respect this type :
76
+ You can also modify or create a new theme but make sure to extend this type:
96
77
 
97
78
  ```tsx
98
- export type CoreUITheme = {
99
- statusHealthy: string;
100
- statusHealthyRGB: string;
101
- statusWarning: string;
102
- statusWarningRGB: string;
103
- statusCritical: string;
104
- statusCriticalRGB: string;
105
- selectedActive: string;
106
- highlight: string;
107
- border: string;
108
- buttonPrimary: string;
109
- buttonSecondary: string;
110
- buttonDelete: string;
111
- infoPrimary: string;
112
- infoSecondary: string;
113
- backgroundLevel1: string;
114
- backgroundLevel2: string;
115
- backgroundLevel3: string;
116
- backgroundLevel4: string;
117
- textPrimary: string;
118
- textSecondary: string;
119
- textTertiary: string;
120
- textReverse: string;
121
- textLink: string;
122
- };
79
+ import { CoreUITheme } from "@scality/core-ui/dist/next";
123
80
  ```
124
81
 
125
- <br />
126
-
127
82
  ## Development
128
83
 
129
84
  This project is built with [React](https://react.dev/) and [TypeScript](https://www.typescriptlang.org/), and styled with [styled-components](https://styled-components.com/).
130
85
 
131
- To start contributing to core-ui, clone the repository :
86
+ To start contributing to core-ui, clone the repository:
132
87
 
133
88
  ```sh
134
89
  git clone git@github.com:scality/core-ui.git
135
90
  ```
136
91
 
137
- then install the dependancies :
92
+ then install the dependancies:
138
93
 
139
94
  ```sh
140
95
  npm install
@@ -142,7 +97,7 @@ npm install
142
97
 
143
98
  ### Create a new branch
144
99
 
145
- Give your branch an explicit name with the reference to the Jira ticket or issue if it exists, and prefix it with :
100
+ Give your branch an explicit name with the reference to the Jira ticket or issue if it exists, and prefix it with:
146
101
 
147
102
  - feature/ for new component or major component update : `feature/TICKET-123-some-feature`
148
103
  - improvement/ for code improvement, component update : `improvement/TICKET-456-some-improvement`
@@ -183,7 +138,7 @@ When creating a new version of an existing component, expose it in `src/lib/next
183
138
 
184
139
  You can use storybook to help with the development.
185
140
  Storybook helps to test and vizualize component in isolation.
186
- If it doesn't exist, write a [story](https://storybook.js.org/docs/get-started/whats-a-story) for the component :
141
+ If it doesn't exist, write a [story](https://storybook.js.org/docs/get-started/whats-a-story) for the component:
187
142
 
188
143
  ```jsx
189
144
  // in stories/example/example.stories.tsx
@@ -200,10 +155,9 @@ type Story = StoryObj<typeof Example>;
200
155
  export const Default: Story = {
201
156
  render: () => <Example />,
202
157
  };
203
-
204
158
  ```
205
159
 
206
- then launch storybook :
160
+ Then launch storybook:
207
161
 
208
162
  ```sh
209
163
  npm run storybook
@@ -213,7 +167,7 @@ Storybook will be launched on `http://localhost:3000`.
213
167
 
214
168
  ### Lint
215
169
 
216
- To make sure your code is correctly lint, run :
170
+ To make sure your code is correctly lint, run:
217
171
 
218
172
  ```sh
219
173
  npm run lint
@@ -225,13 +179,13 @@ It will run ESLint by using `eslint-config-react-app` which is a shareable ESLin
225
179
 
226
180
  Build tests with [jest](https://jestjs.io/)
227
181
 
228
- Make sure to write tests that cover all cases, then you can run all tests with :
182
+ Make sure to write tests that cover all cases, then you can run all tests with:
229
183
 
230
184
  ```sh
231
185
  npm run test
232
186
  ```
233
187
 
234
- or run a specific test with :
188
+ Or run a specific test with:
235
189
 
236
190
  ```sh
237
191
  npm run test Example.test.tsx
@@ -241,7 +195,6 @@ npm run test Example.test.tsx
241
195
 
242
196
  Core-UI uses [storybook](https://storybook.js.org/) for its documentation. \
243
197
  Illustrate use cases and state variations with [stories](https://storybook.js.org/docs/writing-stories).
244
- All stories should be type.
245
198
 
246
199
  If possible create or update the component guideline.
247
200
  This guideline is an MDX file containing details about the component usage and is illustrated with the stories write in stories.tsx file.
@@ -259,29 +212,23 @@ import * as ExampleStories from './Example.stories';
259
212
  An Example component is used for example.
260
213
 
261
214
  <Canvas of={ExampleStories.Default} />
262
-
263
215
  ```
264
216
 
265
- ### Pull request
266
-
267
- Push your code on the repository
268
-
269
- ```sh
270
- git push origin <branch-name>
271
- ```
217
+ ### Contributing
272
218
 
273
- then create a `Pull Request`.
274
- Pull request needs to be approved by at least one reviewer.
275
- After your PR is approved you can comment `/approve`
219
+ - Push your code on a branch following the [branch naming convention](#create-a-new-branch)
220
+ - Create a pull request.
221
+ - Obtain the approval of at least one reviewer.
222
+ - Then comment with `/approve` to merge the PR.
276
223
 
277
224
  ### Release
278
225
 
279
226
  After merging one or more PR in Core-UI, it is possible to plublish a new release.
280
- In the Core-UI repo, follow these steps :
227
+ In the Core-UI repo, follow these steps:
281
228
 
282
229
  1. Go on `Releases` then `Draft a new release`
283
- 2. In the select menu `Choose a tag` : Create a new tag (the current tag increment by 1).
284
- 3. You can now `Generate release notes` : it will add all the PR infos since the last release. \
230
+ 2. In the select menu `Choose a tag`: Create a new tag (the current tag increment by 1).
231
+ 3. You can now `Generate release notes`: it will add all the PR infos since the last release. \
285
232
  You can add details if necessary.
286
233
  4. `Publish release`
287
234
  5. It will create a PR that need to be approved.
@@ -7,6 +7,11 @@ type Props = {
7
7
  height?: number;
8
8
  barConfig?: Record<string, any>;
9
9
  };
10
+ /**
11
+ * @deprecated Use Barchart v2 instead
12
+ * @example import { Barchart } from '@scality/core-ui/dist/next';
13
+
14
+ */
10
15
  declare function BarChart({ id, data, xAxis, yAxis, color, height, barConfig, }: Props): import("react/jsx-runtime").JSX.Element;
11
16
  export { BarChart };
12
17
  //# sourceMappingURL=BarChart.component.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BarChart.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/barchart/BarChart.component.tsx"],"names":[],"mappings":"AACA,KAAK,KAAK,GAAG;IACX,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC;IACjC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACjC,CAAC;AAEF,iBAAS,QAAQ,CAAC,EAChB,EAAE,EACF,IAAI,EACJ,KAAK,EACL,KAAK,EACL,KAAK,EACL,MAAY,EACZ,SAAS,GACV,EAAE,KAAK,2CAwBP;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
1
+ {"version":3,"file":"BarChart.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/barchart/BarChart.component.tsx"],"names":[],"mappings":"AACA,KAAK,KAAK,GAAG;IACX,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC;IACjC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACjC,CAAC;AAEF;;;;GAIG;AACH,iBAAS,QAAQ,CAAC,EAChB,EAAE,EACF,IAAI,EACJ,KAAK,EACL,KAAK,EACL,KAAK,EACL,MAAY,EACZ,SAAS,GACV,EAAE,KAAK,2CAwBP;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
@@ -1,5 +1,10 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { VegaChart } from '../vegachartv2/VegaChartV2.component';
3
+ /**
4
+ * @deprecated Use Barchart v2 instead
5
+ * @example import { Barchart } from '@scality/core-ui/dist/next';
6
+
7
+ */
3
8
  function BarChart({ id, data, xAxis, yAxis, color, height = 200, barConfig, }) {
4
9
  const spec = {
5
10
  mark: {
@@ -19,8 +19,9 @@ export declare const ButtonText: import("styled-components").StyledComponent<"sp
19
19
  export declare const ButtonContent: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
20
20
  /**
21
21
  * @deprecated
22
+ * Used only in Dropdown.component.tsx, can be removed after refactoring
22
23
  * You should use ButtonV2 with
23
- * import { Button } from '@scality/core-ui/dist/next';
24
+ * @example import { Button } from '@scality/core-ui/dist/next';
24
25
  */
25
26
  declare function Button({ text, href, icon, size, variant, outlined, disabled, onClick, title, isLoading, type, inverted, ...rest }: Props): import("react/jsx-runtime").JSX.Element;
26
27
  export { Button };
@@ -1 +1 @@
1
- {"version":3,"file":"Button.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/button/Button.component.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,KAAK,KAAK,GAAG;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,IAAI,CAAC;IAIZ,OAAO,CAAC,EACJ,eAAe,GACf,iBAAiB,GACjB,cAAc,GACd,kBAAkB,CAAC;IAEvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;CAC/B,CAAC;AACF,eAAO,MAAM,YAAY,4GA+LxB,CAAC;AACF,eAAO,MAAM,UAAU,0GAStB,CAAC;AACF,eAAO,MAAM,UAAU,0GAItB,CAAC;AACF,eAAO,MAAM,aAAa,0GAEzB,CAAC;AAGF;;;;GAIG;AACH,iBAAS,MAAM,CAAC,EACd,IAAS,EACT,IAAS,EACT,IAAW,EACX,IAAa,EACb,OAAyB,EACzB,QAAgB,EAChB,QAAgB,EAChB,OAAO,EACP,KAAU,EACV,SAAiB,EACjB,IAAe,EACf,QAAgB,EAChB,GAAG,IAAI,EACR,EAAE,KAAK,2CAgDP;AAED,OAAO,EAAE,MAAM,EAAE,CAAC"}
1
+ {"version":3,"file":"Button.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/button/Button.component.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,KAAK,KAAK,GAAG;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,IAAI,CAAC;IAIZ,OAAO,CAAC,EACJ,eAAe,GACf,iBAAiB,GACjB,cAAc,GACd,kBAAkB,CAAC;IAEvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;CAC/B,CAAC;AACF,eAAO,MAAM,YAAY,4GA+LxB,CAAC;AACF,eAAO,MAAM,UAAU,0GAStB,CAAC;AACF,eAAO,MAAM,UAAU,0GAItB,CAAC;AACF,eAAO,MAAM,aAAa,0GAEzB,CAAC;AAGF;;;;;GAKG;AACH,iBAAS,MAAM,CAAC,EACd,IAAS,EACT,IAAS,EACT,IAAW,EACX,IAAa,EACb,OAAyB,EACzB,QAAgB,EAChB,QAAgB,EAChB,OAAO,EACP,KAAU,EACV,SAAiB,EACjB,IAAe,EACf,QAAgB,EAChB,GAAG,IAAI,EACR,EAAE,KAAK,2CAgDP;AAED,OAAO,EAAE,MAAM,EAAE,CAAC"}
@@ -218,8 +218,9 @@ export const ButtonContent = styled.span `
218
218
  const Anchor = ButtonStyled.withComponent('a');
219
219
  /**
220
220
  * @deprecated
221
+ * Used only in Dropdown.component.tsx, can be removed after refactoring
221
222
  * You should use ButtonV2 with
222
- * import { Button } from '@scality/core-ui/dist/next';
223
+ * @example import { Button } from '@scality/core-ui/dist/next';
223
224
  */
224
225
  function Button({ text = '', href = '', icon = null, size = 'base', variant = 'buttonPrimary', outlined = false, disabled = false, onClick, title = '', isLoading = false, type = 'button', inverted = false, ...rest }) {
225
226
  return href && href.length ? (_jsxs(Anchor, { className: "sc-button", href: href, variant: variant, outlined: outlined, disabled: disabled, size: size, title: title, ...rest, children: [icon && (_jsx(ButtonIcon, { text: text, size: size, children: icon })), _jsx(ButtonText, { children: text })] })) : (_jsx(ButtonStyled, { className: "sc-button", variant: variant, outlined: outlined, disabled: disabled || isLoading, size: size, onClick: onClick, title: title, isLoading: isLoading, type: type, inverted: inverted, icon: icon, text: text, ...rest, children: _jsxs(ButtonContent, { children: [isLoading && _jsx(Loader, { size: size }), _jsxs("span", { className: "sc-button-text", children: [icon && (_jsx(ButtonIcon, { text: text, size: size, children: icon })), _jsx(ButtonText, { children: text })] })] }) }));
@@ -1 +1 @@
1
- {"version":3,"file":"ChartLegend.d.ts","sourceRoot":"","sources":["../../../src/lib/components/chartlegend/ChartLegend.tsx"],"names":[],"mappings":"AAMA,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,MAAM,GAAG,WAAW,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;CACvC,CAAC;AAUF,eAAO,MAAM,UAAU;eACV,OAAO;eACP,OAAO;SAYnB,CAAC;AAEF,eAAO,MAAM,WAAW;YACd,MAAM;WACP,MAAM,GAAG,WAAW;iBACd,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;SAsBpC,CAAC;AAEF,eAAO,MAAM,WAAW,oCAIrB,gBAAgB,4CA+ElB,CAAC"}
1
+ {"version":3,"file":"ChartLegend.d.ts","sourceRoot":"","sources":["../../../src/lib/components/chartlegend/ChartLegend.tsx"],"names":[],"mappings":"AAMA,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,MAAM,GAAG,WAAW,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;CACvC,CAAC;AAUF,eAAO,MAAM,UAAU;eACV,OAAO;eACP,OAAO;SAYnB,CAAC;AAEF,eAAO,MAAM,WAAW;YACd,MAAM;WACP,MAAM,GAAG,WAAW;iBACd,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;SAsBpC,CAAC;AAEF,eAAO,MAAM,WAAW,oCAIrB,gBAAgB,4CAyElB,CAAC"}
@@ -45,7 +45,7 @@ export const LegendShape = styled.div `
45
45
  }}
46
46
  `;
47
47
  export const ChartLegend = ({ shape, disabled = false, direction = 'horizontal', }) => {
48
- const { listResources, getColor, isSelected, addSelectedResource, removeSelectedResource, selectAllResources, getAllResourcesCount, getSelectedCount, selectOnlyResource, } = useChartLegend();
48
+ const { listResources, getColor, isSelected, addSelectedResource, removeSelectedResource, selectAllResources, selectOnlyResource, isOnlyOneSelected, } = useChartLegend();
49
49
  const resources = listResources();
50
50
  const handleLegendClick = useCallback((resource, event) => {
51
51
  if (disabled)
@@ -54,7 +54,7 @@ export const ChartLegend = ({ shape, disabled = false, direction = 'horizontal',
54
54
  const itemIsSelected = isSelected(resource);
55
55
  if (isModifierClick) {
56
56
  if (itemIsSelected) {
57
- if (getSelectedCount() === 1) {
57
+ if (isOnlyOneSelected()) {
58
58
  selectAllResources();
59
59
  }
60
60
  else {
@@ -65,16 +65,11 @@ export const ChartLegend = ({ shape, disabled = false, direction = 'horizontal',
65
65
  addSelectedResource(resource);
66
66
  }
67
67
  }
68
+ else if (itemIsSelected && isOnlyOneSelected()) {
69
+ selectAllResources();
70
+ }
68
71
  else {
69
- if (getSelectedCount() === getAllResourcesCount()) {
70
- selectOnlyResource(resource);
71
- }
72
- else if (itemIsSelected) {
73
- selectAllResources();
74
- }
75
- else {
76
- selectOnlyResource(resource);
77
- }
72
+ selectOnlyResource(resource);
78
73
  }
79
74
  }, [
80
75
  disabled,
@@ -83,8 +78,7 @@ export const ChartLegend = ({ shape, disabled = false, direction = 'horizontal',
83
78
  removeSelectedResource,
84
79
  selectAllResources,
85
80
  selectOnlyResource,
86
- getAllResourcesCount,
87
- getSelectedCount,
81
+ isOnlyOneSelected,
88
82
  ]);
89
83
  return (_jsx(Legend, { direction: direction, children: resources.map((resource) => {
90
84
  const color = getColor(resource);
@@ -9,8 +9,7 @@ export type ChartLegendState = {
9
9
  isSelected: (resource: string) => boolean;
10
10
  getColor: (resource: string) => string | undefined;
11
11
  listResources: () => string[];
12
- getAllResourcesCount: () => number;
13
- getSelectedCount: () => number;
12
+ isOnlyOneSelected: () => boolean;
14
13
  };
15
14
  export type ChartLegendWrapperProps = {
16
15
  children: ReactNode;
@@ -1 +1 @@
1
- {"version":3,"file":"ChartLegendWrapper.d.ts","sourceRoot":"","sources":["../../../src/lib/components/chartlegend/ChartLegendWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,SAAS,EAGV,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,iBAAiB,EAAE,MAAM,EAAE,CAAC;IAC5B,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,sBAAsB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,kBAAkB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,UAAU,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC;IAC1C,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACnD,aAAa,EAAE,MAAM,MAAM,EAAE,CAAC;IAC9B,oBAAoB,EAAE,MAAM,MAAM,CAAC;IACnC,gBAAgB,EAAE,MAAM,MAAM,CAAC;CAChC,CAAC;AAIF,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,GAAG,MAAM,CAAC,CAAC;CAChD,CAAC;AAEF,eAAO,MAAM,kBAAkB,4BAG5B,uBAAuB,4CAwFzB,CAAC;AAGF,eAAO,MAAM,cAAc,wBAM1B,CAAC"}
1
+ {"version":3,"file":"ChartLegendWrapper.d.ts","sourceRoot":"","sources":["../../../src/lib/components/chartlegend/ChartLegendWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,SAAS,EAGV,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,iBAAiB,EAAE,MAAM,EAAE,CAAC;IAC5B,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,sBAAsB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,kBAAkB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,UAAU,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC;IAC1C,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACnD,aAAa,EAAE,MAAM,MAAM,EAAE,CAAC;IAC9B,iBAAiB,EAAE,MAAM,OAAO,CAAC;CAClC,CAAC;AAIF,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,GAAG,MAAM,CAAC,CAAC;CAChD,CAAC;AAEF,eAAO,MAAM,kBAAkB,4BAG5B,uBAAuB,4CAiFzB,CAAC;AAGF,eAAO,MAAM,cAAc,wBAM1B,CAAC"}
@@ -16,11 +16,8 @@ export const ChartLegendWrapper = ({ children, colorSet, }) => {
16
16
  const selectOnlyResource = useCallback((resource) => {
17
17
  setSelectedResources([resource]);
18
18
  }, []);
19
- const getAllResourcesCount = useCallback(() => {
20
- return allResources.length;
21
- }, [allResources]);
22
- const getSelectedCount = useCallback(() => {
23
- return selectedResources.length;
19
+ const isOnlyOneSelected = useCallback(() => {
20
+ return selectedResources.length === 1;
24
21
  }, [selectedResources]);
25
22
  const isSelected = useCallback((resource) => {
26
23
  return selectedResources.includes(resource);
@@ -45,8 +42,7 @@ export const ChartLegendWrapper = ({ children, colorSet, }) => {
45
42
  isSelected,
46
43
  getColor,
47
44
  listResources,
48
- getAllResourcesCount,
49
- getSelectedCount,
45
+ isOnlyOneSelected,
50
46
  }), [
51
47
  selectedResources,
52
48
  addSelectedResource,
@@ -56,8 +52,7 @@ export const ChartLegendWrapper = ({ children, colorSet, }) => {
56
52
  isSelected,
57
53
  getColor,
58
54
  listResources,
59
- getAllResourcesCount,
60
- getSelectedCount,
55
+ isOnlyOneSelected,
61
56
  ]);
62
57
  return (_jsx(ChartLegendContext.Provider, { value: chartLegendState, children: children }));
63
58
  };
@@ -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;
@@ -1 +1 @@
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,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,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"}
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"}