@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
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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"}
package/dist/index.js 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, } 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';
package/dist/next.d.ts CHANGED
@@ -18,4 +18,5 @@ export { ChartTooltip } from './components/barchartv2/ChartTooltip';
18
18
  export { ChartLegendWrapper } from './components/chartlegend/ChartLegendWrapper';
19
19
  export { ChartLegend } from './components/chartlegend/ChartLegend';
20
20
  export { LineTimeSerieChart } from './components/linetimeseriechart/linetimeseriechart.component';
21
+ export { CoreUITheme } from './style/theme';
21
22
  //# sourceMappingURL=next.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"next.d.ts","sourceRoot":"","sources":["../src/lib/next.ts"],"names":[],"mappings":"AAAA,OAAO,2CAA2C,CAAC;AACnD,OAAO,aAAa,CAAC;AACrB,OAAO,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,4CAA4C,CAAC;AACxE,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,sCAAsC,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,wCAAwC,CAAC;AAC/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,4DAA4D,CAAC;AAC/F,OAAO,EACL,uBAAuB,EACvB,kBAAkB,GACnB,MAAM,uDAAuD,CAAC;AAC/D,OAAO,EAAE,kBAAkB,EAAE,MAAM,6CAA6C,CAAC;AACjF,OAAO,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAClE,OAAO,EAAE,cAAc,EAAE,MAAM,wDAAwD,CAAC;AACxF,OAAO,EAAE,mBAAmB,EAAE,MAAM,sDAAsD,CAAC;AAC3F,OAAO,EAAE,GAAG,EAAE,MAAM,sBAAsB,CAAC;AAC3C,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,4CAA4C,CAAC;AACvE,OAAO,EACL,QAAQ,EACR,cAAc,EACd,iBAAiB,GAClB,MAAM,4CAA4C,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,6CAA6C,CAAC;AACjF,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,8DAA8D,CAAC"}
1
+ {"version":3,"file":"next.d.ts","sourceRoot":"","sources":["../src/lib/next.ts"],"names":[],"mappings":"AAAA,OAAO,2CAA2C,CAAC;AACnD,OAAO,aAAa,CAAC;AACrB,OAAO,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,4CAA4C,CAAC;AACxE,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,sCAAsC,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,wCAAwC,CAAC;AAC/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,4DAA4D,CAAC;AAC/F,OAAO,EACL,uBAAuB,EACvB,kBAAkB,GACnB,MAAM,uDAAuD,CAAC;AAC/D,OAAO,EAAE,kBAAkB,EAAE,MAAM,6CAA6C,CAAC;AACjF,OAAO,EAAE,MAAM,EAAE,MAAM,0CAA0C,CAAC;AAClE,OAAO,EAAE,cAAc,EAAE,MAAM,wDAAwD,CAAC;AACxF,OAAO,EAAE,mBAAmB,EAAE,MAAM,sDAAsD,CAAC;AAC3F,OAAO,EAAE,GAAG,EAAE,MAAM,sBAAsB,CAAC;AAC3C,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,4CAA4C,CAAC;AACvE,OAAO,EACL,QAAQ,EACR,cAAc,EACd,iBAAiB,GAClB,MAAM,4CAA4C,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,6CAA6C,CAAC;AACjF,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,8DAA8D,CAAC;AAClG,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}
package/jest.config.js CHANGED
@@ -5,4 +5,5 @@ module.exports = {
5
5
  moduleNameMapper: {
6
6
  '\\.(css|less)$': 'identity-obj-proxy',
7
7
  },
8
+ testEnvironment: 'jsdom'
8
9
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@scality/core-ui",
3
- "version": "0.166.0",
3
+ "version": "0.167.0",
4
4
  "description": "Scality common React component library",
5
5
  "author": "Scality Engineering",
6
6
  "license": "SEE LICENSE IN LICENSE",
@@ -19,12 +19,10 @@
19
19
  "lint": "eslint src/* --ext .js --no-error-on-unmatched-pattern",
20
20
  "prepare": "npm run build",
21
21
  "postbuild": "npm run copy-files",
22
- "plop": "plop",
23
22
  "test": "jest",
24
23
  "storybook": "storybook dev -p 3000",
25
24
  "build-storybook": "storybook build",
26
- "storybook:deploy": "storybook-to-ghpages",
27
- "preview": "jest-preview"
25
+ "storybook:deploy": "storybook-to-ghpages"
28
26
  },
29
27
  "keywords": [],
30
28
  "browserslist": [
@@ -40,23 +38,19 @@
40
38
  "@babel/preset-react": "^7.16.7",
41
39
  "@babel/preset-typescript": "^7.16.7",
42
40
  "@chromatic-com/storybook": "^1.9.0",
43
- "@storybook/addon-actions": "^8.3.6",
44
- "@storybook/addon-essentials": "^8.3.6",
45
- "@storybook/addon-links": "^8.3.6",
46
- "@storybook/addon-mdx-gfm": "^8.3.6",
47
- "@storybook/addon-storysource": "^8.3.6",
41
+ "@storybook/addon-actions": "^8.6.14",
42
+ "@storybook/addon-essentials": "^8.6.14",
43
+ "@storybook/addon-mdx-gfm": "^8.6.14",
44
+ "@storybook/addon-storysource": "^8.6.14",
48
45
  "@storybook/addon-webpack5-compiler-swc": "^1.0.5",
49
- "@storybook/blocks": "^8.3.6",
50
- "@storybook/manager-api": "^8.3.6",
51
- "@storybook/react": "^8.3.6",
52
- "@storybook/react-webpack5": "^8.3.6",
53
- "@storybook/storybook-deployer": "^2.8.16",
54
- "@storybook/theming": "^8.3.6",
46
+ "@storybook/blocks": "^8.6.14",
47
+ "@storybook/manager-api": "^8.6.14",
48
+ "@storybook/react": "^8.6.14",
49
+ "@storybook/react-webpack5": "^8.6.14",
50
+ "@storybook/theming": "^8.6.14",
55
51
  "@testing-library/jest-dom": "^5.14.1",
56
52
  "@testing-library/react": "^15.0.7",
57
- "@testing-library/react-hooks": "^8.0.1",
58
53
  "@testing-library/user-event": "^13.5.0",
59
- "@types/jest": "^27.5.0",
60
54
  "@types/react": "^18.3.12",
61
55
  "@types/react-dom": "^18.3.1",
62
56
  "@types/react-router": "^5.1.20",
@@ -70,21 +64,17 @@
70
64
  "@typescript-eslint/eslint-plugin": "^6.12.0",
71
65
  "@typescript-eslint/parser": "^6.12.0",
72
66
  "copyfiles": "^2.4.1",
73
- "cross-env": "^7.0.3",
74
- "csstype": "^3.1.0",
75
67
  "eslint": "^8.15.0",
76
68
  "eslint-config-react-app": "^7.0.1",
77
69
  "eslint-plugin-storybook": "^0.10.1",
78
70
  "husky": "^3.0.5",
79
- "identity-obj-proxy": "^3.0.0",
80
- "jest": "^26.6.3",
71
+ "jest": "^30.0.5",
81
72
  "jest-canvas-mock": "^2.3.1",
82
- "jest-preview": "^0.3.1",
83
- "plop": "^2.4.0",
73
+ "jest-environment-jsdom": "^30.0.5",
84
74
  "regenerator-runtime": "^0.13.7",
85
75
  "rimraf": "^3.0.0",
86
76
  "source-map-explorer": "^2.0.1",
87
- "storybook": "^8.3.6",
77
+ "storybook": "^8.6.14",
88
78
  "typescript": "^5.3.2"
89
79
  },
90
80
  "husky": {
@@ -92,15 +82,6 @@
92
82
  "pre-commit": "npm run lint"
93
83
  }
94
84
  },
95
- "jest": {
96
- "setupFiles": [
97
- "jest-canvas-mock"
98
- ],
99
- "transform": {
100
- "^.+\\.[tj]sx?$": "babel-jest",
101
- "^.+\\.mdx?$": "@storybook/addon-docs/jest-transform-mdx"
102
- }
103
- },
104
85
  "dependencies": {
105
86
  "@floating-ui/dom": "^1.6.3",
106
87
  "@floating-ui/react": "^0.26.28",
@@ -114,16 +95,14 @@
114
95
  "downshift": "^7.0.5",
115
96
  "polished": "3.4.1",
116
97
  "pretty-bytes": "^5.6.0",
117
- "react-debounce-input": "3.2.2",
118
98
  "react-dropzone": "^14.2.3",
119
99
  "react-hook-form": "^7.49.2",
120
100
  "react-query": "^3.34.0",
121
- "react-router": "7.0.1",
122
- "react-router-dom": "7.0.1",
101
+ "react-router": "7.8.1",
102
+ "react-router-dom": "7.8.1",
123
103
  "react-select": "4.3.1",
124
104
  "react-table": "^7.7.0",
125
105
  "react-test-renderer": "^18.3.1",
126
- "react-virtualized": "9.22.3",
127
106
  "react-virtualized-auto-sizer": "^1.0.24",
128
107
  "react-window": "^1.8.6",
129
108
  "recharts": "^3.0.2",
@@ -9,6 +9,11 @@ type Props = {
9
9
  barConfig?: Record<string, any>;
10
10
  };
11
11
 
12
+ /**
13
+ * @deprecated Use Barchart v2 instead
14
+ * @example import { Barchart } from '@scality/core-ui/dist/next';
15
+
16
+ */
12
17
  function BarChart({
13
18
  id,
14
19
  data,
@@ -242,8 +242,9 @@ const Anchor = ButtonStyled.withComponent('a');
242
242
 
243
243
  /**
244
244
  * @deprecated
245
+ * Used only in Dropdown.component.tsx, can be removed after refactoring
245
246
  * You should use ButtonV2 with
246
- * import { Button } from '@scality/core-ui/dist/next';
247
+ * @example import { Button } from '@scality/core-ui/dist/next';
247
248
  */
248
249
  function Button({
249
250
  text = '',
@@ -214,5 +214,22 @@ describe('ChartLegend', () => {
214
214
  expect(screen.getByLabelText('Memory not selected')).toBeInTheDocument();
215
215
  expect(screen.getByLabelText('Disk selected')).toBeInTheDocument();
216
216
  });
217
+ it('should select one item when clicking on selected item and other items are selected', () => {
218
+ render(
219
+ <ChartLegendWrapper colorSet={colorSet}>
220
+ <ChartLegend shape="line" />
221
+ </ChartLegendWrapper>,
222
+ );
223
+ userEvent.click(screen.getByText('CPU'));
224
+ userEvent.click(screen.getByText('Memory'), { metaKey: true });
225
+
226
+ expect(screen.getByLabelText('CPU selected')).toBeInTheDocument();
227
+ expect(screen.getByLabelText('Memory selected')).toBeInTheDocument();
228
+ expect(screen.getByLabelText('Disk not selected')).toBeInTheDocument();
229
+ userEvent.click(screen.getByText('CPU'));
230
+ expect(screen.getByLabelText('CPU selected')).toBeInTheDocument();
231
+ expect(screen.getByLabelText('Memory not selected')).toBeInTheDocument();
232
+ expect(screen.getByLabelText('Disk not selected')).toBeInTheDocument();
233
+ });
217
234
  });
218
235
  });
@@ -73,9 +73,8 @@ export const ChartLegend = ({
73
73
  addSelectedResource,
74
74
  removeSelectedResource,
75
75
  selectAllResources,
76
- getAllResourcesCount,
77
- getSelectedCount,
78
76
  selectOnlyResource,
77
+ isOnlyOneSelected,
79
78
  } = useChartLegend();
80
79
 
81
80
  const resources = listResources();
@@ -89,7 +88,7 @@ export const ChartLegend = ({
89
88
 
90
89
  if (isModifierClick) {
91
90
  if (itemIsSelected) {
92
- if (getSelectedCount() === 1) {
91
+ if (isOnlyOneSelected()) {
93
92
  selectAllResources();
94
93
  } else {
95
94
  removeSelectedResource(resource);
@@ -97,14 +96,10 @@ export const ChartLegend = ({
97
96
  } else {
98
97
  addSelectedResource(resource);
99
98
  }
99
+ } else if (itemIsSelected && isOnlyOneSelected()) {
100
+ selectAllResources();
100
101
  } else {
101
- if (getSelectedCount() === getAllResourcesCount()) {
102
- selectOnlyResource(resource);
103
- } else if (itemIsSelected) {
104
- selectAllResources();
105
- } else {
106
- selectOnlyResource(resource);
107
- }
102
+ selectOnlyResource(resource);
108
103
  }
109
104
  },
110
105
  [
@@ -114,8 +109,7 @@ export const ChartLegend = ({
114
109
  removeSelectedResource,
115
110
  selectAllResources,
116
111
  selectOnlyResource,
117
- getAllResourcesCount,
118
- getSelectedCount,
112
+ isOnlyOneSelected,
119
113
  ],
120
114
  );
121
115
 
@@ -17,8 +17,7 @@ export type ChartLegendState = {
17
17
  isSelected: (resource: string) => boolean;
18
18
  getColor: (resource: string) => string | undefined;
19
19
  listResources: () => string[];
20
- getAllResourcesCount: () => number;
21
- getSelectedCount: () => number;
20
+ isOnlyOneSelected: () => boolean;
22
21
  };
23
22
 
24
23
  const ChartLegendContext = createContext<ChartLegendState | null>(null);
@@ -54,14 +53,9 @@ export const ChartLegendWrapper = ({
54
53
  setSelectedResources([resource]);
55
54
  }, []);
56
55
 
57
- const getAllResourcesCount = useCallback(() => {
58
- return allResources.length;
59
- }, [allResources]);
60
-
61
- const getSelectedCount = useCallback(() => {
62
- return selectedResources.length;
56
+ const isOnlyOneSelected = useCallback(() => {
57
+ return selectedResources.length === 1;
63
58
  }, [selectedResources]);
64
-
65
59
  const isSelected = useCallback(
66
60
  (resource: string) => {
67
61
  return selectedResources.includes(resource);
@@ -97,8 +91,7 @@ export const ChartLegendWrapper = ({
97
91
  isSelected,
98
92
  getColor,
99
93
  listResources,
100
- getAllResourcesCount,
101
- getSelectedCount,
94
+ isOnlyOneSelected,
102
95
  }),
103
96
  [
104
97
  selectedResources,
@@ -109,8 +102,7 @@ export const ChartLegendWrapper = ({
109
102
  isSelected,
110
103
  getColor,
111
104
  listResources,
112
- getAllResourcesCount,
113
- getSelectedCount,
105
+ isOnlyOneSelected,
114
106
  ],
115
107
  );
116
108
 
@@ -142,7 +142,15 @@ export const iconTable = {
142
142
  Mail: 'fas faEnvelope',
143
143
  };
144
144
 
145
- export const customIcons = {
145
+ type IconProps = {
146
+ 'aria-label'?: string;
147
+ color?: string;
148
+ size?: string;
149
+ icon?: string;
150
+ title?: string;
151
+ };
152
+
153
+ export const customIcons: Record<string, ((props: IconProps) => JSX.Element) & { displayName?: string }> = {
146
154
  'Remote-user': ({ 'aria-label': ariaLabel, color, size }) => (
147
155
  <RemoteUser ariaLabel={ariaLabel} color={color} size={size} />
148
156
  ),
@@ -151,6 +159,9 @@ export const customIcons = {
151
159
  ),
152
160
  };
153
161
 
162
+ customIcons['Remote-user'].displayName = 'RemoteUser';
163
+ customIcons['Remote-group'].displayName = 'RemoteGroup';
164
+
154
165
  const IconStyled = styled(FontAwesomeIcon)`
155
166
  ${(props) => {
156
167
  const theme = props.theme;
@@ -165,33 +165,33 @@ it('returns the unit label GiB/Sec', () => {
165
165
  expect(valueBase).toEqual(1024 * 1024 * 1024);
166
166
  });
167
167
  // test for addMissingDataPoint function
168
- const originalValue = [
169
- [0, 0],
170
- [1, 1],
171
- [2, 2],
172
- [3, 3],
173
- [4, 4],
174
- [5, 5],
175
- [6, 6],
176
- [8, 8],
177
- [9, 9],
178
- [10, 10],
168
+ const originalValue: [number, number | string | null][] = [
169
+ [0, '0'],
170
+ [1, '1'],
171
+ [2, '2'],
172
+ [3, '3'],
173
+ [4, '4'],
174
+ [5, '5'],
175
+ [6, '6'],
176
+ [8, '8'],
177
+ [9, '9'],
178
+ [10, '10'],
179
179
  ];
180
180
  const startingTimeStamp = 0;
181
181
  const sampleDuration = 10;
182
182
  const sampleFrequency = 1;
183
183
  const newValues = [
184
- [0, 0],
185
- [1, 1],
186
- [2, 2],
187
- [3, 3],
188
- [4, 4],
189
- [5, 5],
190
- [6, 6],
184
+ [0, '0'],
185
+ [1, '1'],
186
+ [2, '2'],
187
+ [3, '3'],
188
+ [4, '4'],
189
+ [5, '5'],
190
+ [6, '6'],
191
191
  [7, 'NAN'],
192
- [8, 8],
193
- [9, 9],
194
- [10, 10],
192
+ [8, '8'],
193
+ [9, '9'],
194
+ [10, '10'],
195
195
  ];
196
196
  it('should add missing data point with null', () => {
197
197
  const result = addMissingDataPoint(
@@ -210,19 +210,7 @@ it('should return the array with string NAN when the original dataset is empty',
210
210
  sampleDuration,
211
211
  sampleFrequency,
212
212
  );
213
- expect(result).toEqual([
214
- [0, 'NAN'],
215
- [1, 'NAN'],
216
- [2, 'NAN'],
217
- [3, 'NAN'],
218
- [4, 'NAN'],
219
- [5, 'NAN'],
220
- [6, 'NAN'],
221
- [7, 'NAN'],
222
- [8, 'NAN'],
223
- [9, 'NAN'],
224
- [10, 'NAN'],
225
- ]);
213
+ expect(result).toEqual([]);
226
214
  });
227
215
  it('should return an empty array when the starting timestamp is undefined', () => {
228
216
  const result = addMissingDataPoint(
@@ -259,4 +247,4 @@ it('should return an empty array when sample frequency is undefined', () => {
259
247
  undefined,
260
248
  );
261
249
  expect(result).toEqual([]);
262
- });
250
+ });
@@ -109,55 +109,61 @@ export function getUnitLabel(
109
109
 
110
110
  /**
111
111
  * This function manually adds the missing data points with `null` value caused by downtime of the VMs
112
+ * Missing data points are only added when the gap between consecutive data points is bigger than 2 intervals
112
113
  *
113
114
  * @param {array} orginalValues - The array of the data points are already sorted according to the time series
114
115
  * @param {number} startingTimeStamp - The starting timestamp in seconds
115
116
  * @param {number} sampleDuration - The time span value in seconds
116
- * @param {number} sampleFrequency - The time difference between two data points in seconds
117
+ * @param {number} sampleInterval - The time difference between two data points in seconds
117
118
  *
118
119
  */
119
120
  export function addMissingDataPoint(
120
- orginalValues: [number, string | null][],
121
- startingTimeStamp: number,
122
- sampleDuration: number,
123
- sampleFrequency: number,
124
- ): [number, string | null][] {
121
+ orginalValues: [number, number | string | null][],
122
+ startingTimeStamp?: number,
123
+ sampleDuration?: number,
124
+ sampleInterval?: number,
125
+ ): [number, number | string | null][] {
125
126
  if (
126
127
  !orginalValues ||
127
128
  startingTimeStamp === undefined ||
128
129
  !sampleDuration ||
129
- !sampleFrequency ||
130
+ !sampleInterval ||
130
131
  startingTimeStamp < 0 ||
131
132
  sampleDuration <= 0 ||
132
- sampleFrequency <= 0
133
+ sampleInterval <= 0
133
134
  ) {
134
135
  return [];
135
136
  }
136
137
 
137
- const newValues = [];
138
- const numberOfDataPoints = sampleDuration / sampleFrequency + 1;
139
- let samplingPointTime = startingTimeStamp;
140
-
141
- // initialize the array with all "NAN" value, in order for the tooltip to display dash(-)
142
- for (let i = 0; i < numberOfDataPoints; i++) {
143
- newValues.push([samplingPointTime, NAN_STRING]);
144
- samplingPointTime += sampleFrequency;
138
+ // If there are no original values, return empty array
139
+ if (orginalValues.length === 0) {
140
+ return [];
145
141
  }
146
142
 
147
- // copy the existing data points from `orginalValue` array to `newValues`
148
- if (newValues.length === 0) return [];
149
- let nextIndex = 0;
143
+ const newValues: [number, number | string | null][] = [];
144
+
145
+ // Process all but the last element
146
+ for (let i = 0; i < orginalValues.length - 1; i++) {
147
+ // Always add the current data point
148
+ newValues.push(orginalValues[i]);
150
149
 
151
- for (let i = 0; i < newValues.length; i++) {
152
- if (
153
- orginalValues[nextIndex] &&
154
- newValues[i][0] === orginalValues[nextIndex][0]
155
- ) {
156
- newValues[i][1] = orginalValues[nextIndex][1];
157
- nextIndex++;
150
+ const currentTimestamp = orginalValues[i][0];
151
+ const nextTimestamp = orginalValues[i + 1][0];
152
+ const gap = nextTimestamp - currentTimestamp;
153
+
154
+ // Calculate how many missing points to add
155
+ const missingIntervals = Math.floor(gap / sampleInterval) - 1;
156
+
157
+ // Add missing data points with NAN_STRING (only executes if missingIntervals > 0)
158
+ for (let j = 1; j <= missingIntervals; j++) {
159
+ const missingTimestamp = currentTimestamp + j * sampleInterval;
160
+ newValues.push([missingTimestamp, NAN_STRING]);
158
161
  }
159
162
  }
160
163
 
164
+ // Add the last element
165
+ newValues.push(orginalValues[orginalValues.length - 1]);
166
+
161
167
  return newValues;
162
168
  }
163
169
  // get the value for the based value
@@ -165,6 +165,10 @@ const colorRange = [
165
165
  ];
166
166
 
167
167
  // Note: we need to make sure the start time and end timefor the prometheus query between the series are the same.
168
+ /**
169
+ * @deprecated Use LineTimeSerieChart instead
170
+ * @example import { LineTimeSerieChart } from '@scality/core-ui/dist/next';
171
+ */
168
172
  function LineTemporalChart({
169
173
  series,
170
174
  title,
@@ -451,10 +455,10 @@ function LineTemporalChart({
451
455
  ],
452
456
  }
453
457
  : yAxisType === 'percentage'
454
- ? {
455
- domain: [0, 100],
456
- }
457
- : undefined,
458
+ ? {
459
+ domain: [0, 100],
460
+ }
461
+ : undefined,
458
462
  };
459
463
  }, [yAxisTitle, yAxisType]);
460
464
  const symmetricalColorRange =
@@ -652,15 +656,15 @@ function LineTemporalChart({
652
656
  },
653
657
  }
654
658
  : yAxisType === 'symmetrical'
655
- ? {
656
- // for symmetrical chart we manually draw the line from minValue to maxValue
657
- ...syncedVerticalRuler,
658
- encoding: {
659
- ...syncedVerticalRuler.encoding,
660
- ...syncedVerticalRulerSymmetrical.encoding,
661
- },
662
- }
663
- : syncedVerticalRuler,
659
+ ? {
660
+ // for symmetrical chart we manually draw the line from minValue to maxValue
661
+ ...syncedVerticalRuler,
662
+ encoding: {
663
+ ...syncedVerticalRuler.encoding,
664
+ ...syncedVerticalRulerSymmetrical.encoding,
665
+ },
666
+ }
667
+ : syncedVerticalRuler,
664
668
  ],
665
669
  },
666
670
  tooltipConfig,
@@ -698,8 +702,8 @@ function LineTemporalChart({
698
702
  const unitLabel = unitRange
699
703
  ? getUnitLabel(unitRange, maxValue).unitLabel
700
704
  : yAxisType === 'percentage'
701
- ? '%'
702
- : '';
705
+ ? '%'
706
+ : '';
703
707
  return (
704
708
  <LineTemporalChartWrapper>
705
709
  <ChartHeader>