@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.
- package/.storybook/preview.js +6 -4
- package/README.md +27 -80
- package/dist/components/barchart/BarChart.component.d.ts +5 -0
- package/dist/components/barchart/BarChart.component.d.ts.map +1 -1
- package/dist/components/barchart/BarChart.component.js +5 -0
- package/dist/components/button/Button.component.d.ts +2 -1
- package/dist/components/button/Button.component.d.ts.map +1 -1
- package/dist/components/button/Button.component.js +2 -1
- package/dist/components/chartlegend/ChartLegend.d.ts.map +1 -1
- package/dist/components/chartlegend/ChartLegend.js +7 -13
- package/dist/components/chartlegend/ChartLegendWrapper.d.ts +1 -2
- package/dist/components/chartlegend/ChartLegendWrapper.d.ts.map +1 -1
- package/dist/components/chartlegend/ChartLegendWrapper.js +4 -9
- package/dist/components/icon/Icon.component.d.ts +9 -11
- package/dist/components/icon/Icon.component.d.ts.map +1 -1
- package/dist/components/icon/Icon.component.js +2 -0
- package/dist/components/linetemporalchart/ChartUtil.d.ts +3 -2
- package/dist/components/linetemporalchart/ChartUtil.d.ts.map +1 -1
- package/dist/components/linetemporalchart/ChartUtil.js +24 -20
- package/dist/components/linetemporalchart/LineTemporalChart.component.d.ts +4 -0
- package/dist/components/linetemporalchart/LineTemporalChart.component.d.ts.map +1 -1
- package/dist/components/linetemporalchart/LineTemporalChart.component.js +4 -0
- package/dist/components/linetimeseriechart/linetimeseriechart.component.d.ts +1 -1
- package/dist/components/linetimeseriechart/linetimeseriechart.component.d.ts.map +1 -1
- package/dist/index.d.ts +1 -11
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +0 -11
- package/dist/next.d.ts +1 -0
- package/dist/next.d.ts.map +1 -1
- package/jest.config.js +1 -0
- package/package.json +16 -37
- package/src/lib/components/barchart/BarChart.component.tsx +5 -0
- package/src/lib/components/button/Button.component.tsx +2 -1
- package/src/lib/components/chartlegend/ChartLegend.test.tsx +17 -0
- package/src/lib/components/chartlegend/ChartLegend.tsx +6 -12
- package/src/lib/components/chartlegend/ChartLegendWrapper.tsx +5 -13
- package/src/lib/components/icon/Icon.component.tsx +12 -1
- package/src/lib/components/linetemporalchart/ChartUtil.test.ts +23 -35
- package/src/lib/components/linetemporalchart/ChartUtil.ts +32 -26
- package/src/lib/components/linetemporalchart/LineTemporalChart.component.tsx +19 -15
- package/src/lib/components/linetimeseriechart/linetimeseriechart.component.tsx +5 -5
- package/src/lib/components/selectv2/selectv2.test.tsx +1 -1
- package/src/lib/components/toast/useMutationsHandler.test.tsx +22 -32
- package/src/lib/index.ts +6 -11
- package/src/lib/next.ts +1 -0
- package/stories/barchart.stories.tsx +1 -1
- package/stories/card.stories.tsx +7 -5
- package/stories/controls.ts +19 -20
- package/stories/linecharttemporal.stories.tsx +1 -1
- package/stories/linetimeseriechart.stories.tsx +49 -0
- package/stories/navbar.stories.tsx +103 -0
- package/stories/tabsv2.stories.tsx +51 -56
- package/dist/components/areachart/AreaChart.component.d.ts +0 -13
- package/dist/components/areachart/AreaChart.component.d.ts.map +0 -1
- package/dist/components/areachart/AreaChart.component.js +0 -27
- package/dist/components/chips/Chips.component.d.ts +0 -21
- package/dist/components/chips/Chips.component.d.ts.map +0 -1
- package/dist/components/chips/Chips.component.js +0 -105
- package/dist/components/cloudprogressbar/CloudProgressBar.component.d.ts +0 -10
- package/dist/components/cloudprogressbar/CloudProgressBar.component.d.ts.map +0 -1
- package/dist/components/cloudprogressbar/CloudProgressBar.component.js +0 -38
- package/dist/components/collapsiblepanel/CollapsiblePanel.component.d.ts +0 -9
- package/dist/components/collapsiblepanel/CollapsiblePanel.component.d.ts.map +0 -1
- package/dist/components/collapsiblepanel/CollapsiblePanel.component.js +0 -44
- package/dist/components/linechart/LineChart.component.d.ts +0 -21
- package/dist/components/linechart/LineChart.component.d.ts.map +0 -1
- package/dist/components/linechart/LineChart.component.js +0 -109
- package/dist/components/multiselect/MultiSelect.component.d.ts +0 -28
- package/dist/components/multiselect/MultiSelect.component.d.ts.map +0 -1
- package/dist/components/multiselect/MultiSelect.component.js +0 -73
- package/dist/components/select/Select.component.d.ts +0 -14
- package/dist/components/select/Select.component.d.ts.map +0 -1
- package/dist/components/select/Select.component.js +0 -71
- package/dist/components/spacedbox/SpacedBox.d.ts +0 -34
- package/dist/components/spacedbox/SpacedBox.d.ts.map +0 -1
- package/dist/components/spacedbox/SpacedBox.js +0 -64
- package/dist/components/sparkline/SparkLine.component.d.ts +0 -18
- package/dist/components/sparkline/SparkLine.component.d.ts.map +0 -1
- package/dist/components/sparkline/SparkLine.component.js +0 -148
- package/dist/components/vegachart/VegaChart.component.d.ts +0 -13
- package/dist/components/vegachart/VegaChart.component.d.ts.map +0 -1
- package/dist/components/vegachart/VegaChart.component.js +0 -120
- package/plopfile.js +0 -38
- package/src/lib/components/areachart/AreaChart.component.tsx +0 -49
- package/src/lib/components/chips/Chips.component.tsx +0 -169
- package/src/lib/components/cloudprogressbar/CloudProgressBar.component.tsx +0 -105
- package/src/lib/components/collapsiblepanel/CollapsiblePanel.component.tsx +0 -77
- package/src/lib/components/linechart/LineChart.component.tsx +0 -152
- package/src/lib/components/multiselect/MultiSelect.component.tsx +0 -158
- package/src/lib/components/select/Select.component.tsx +0 -98
- package/src/lib/components/spacedbox/SpacedBox.ts +0 -116
- package/src/lib/components/sparkline/SparkLine.component.tsx +0 -176
- package/src/lib/components/vegachart/VegaChart.component.tsx +0 -146
- package/stories/areachart.stories.tsx +0 -120
- package/stories/chips.stories.tsx +0 -107
- package/stories/cloudprogressbar.stories.tsx +0 -93
- package/stories/collapsiblepanel.stories.tsx +0 -57
- package/stories/data/areachart.ts +0 -122
- package/stories/data/sparklinechart.ts +0 -164
- package/stories/linechart.stories.tsx +0 -319
- package/stories/multiselect.stories.tsx +0 -126
- package/stories/select.stories.tsx +0 -52
- package/stories/sparkline.stories.tsx +0 -85
- 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
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/lib/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,8CAA8C,CAAC;AAC1E,OAAO,EAAE,
|
|
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
|
package/dist/next.d.ts.map
CHANGED
|
@@ -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
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@scality/core-ui",
|
|
3
|
-
"version": "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.
|
|
44
|
-
"@storybook/addon-essentials": "^8.
|
|
45
|
-
"@storybook/addon-
|
|
46
|
-
"@storybook/addon-
|
|
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.
|
|
50
|
-
"@storybook/manager-api": "^8.
|
|
51
|
-
"@storybook/react": "^8.
|
|
52
|
-
"@storybook/react-webpack5": "^8.
|
|
53
|
-
"@storybook/
|
|
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
|
-
"
|
|
80
|
-
"jest": "^26.6.3",
|
|
71
|
+
"jest": "^30.0.5",
|
|
81
72
|
"jest-canvas-mock": "^2.3.1",
|
|
82
|
-
"jest-
|
|
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.
|
|
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.
|
|
122
|
-
"react-router-dom": "7.
|
|
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",
|
|
@@ -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 (
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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
|
|
58
|
-
return
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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}
|
|
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
|
|
122
|
-
sampleDuration
|
|
123
|
-
|
|
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
|
-
!
|
|
130
|
+
!sampleInterval ||
|
|
130
131
|
startingTimeStamp < 0 ||
|
|
131
132
|
sampleDuration <= 0 ||
|
|
132
|
-
|
|
133
|
+
sampleInterval <= 0
|
|
133
134
|
) {
|
|
134
135
|
return [];
|
|
135
136
|
}
|
|
136
137
|
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
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
|
-
|
|
148
|
-
|
|
149
|
-
|
|
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
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
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
|
-
|
|
456
|
-
|
|
457
|
-
|
|
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
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
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>
|