@banyan_cloud/roots 2.0.3 → 2.0.4
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/dist/esm/index.js +1278 -849
- package/dist/esm/index.js.map +1 -1
- package/package.json +1 -1
package/dist/esm/index.js
CHANGED
|
@@ -9,9 +9,10 @@ import { LineChart, BarChart, HeatmapChart, PieChart, MapChart } from 'echarts/c
|
|
|
9
9
|
import { TitleComponent, LegendComponent, TooltipComponent, GridComponent, DatasetComponent, DataZoomComponent, DataZoomInsideComponent, DataZoomSliderComponent, VisualMapComponent, GeoComponent, PolarComponent } from 'echarts/components';
|
|
10
10
|
import * as echarts from 'echarts/core';
|
|
11
11
|
import { CanvasRenderer } from 'echarts/renderers';
|
|
12
|
-
import { Chart,
|
|
13
|
-
import { Pie, Bar, Line } from 'react-chartjs-2';
|
|
12
|
+
import { Chart, BarElement, CategoryScale, LinearScale, Tooltip as Tooltip$1, Legend, Title as Title$1, PointElement, LineElement, Filler, RadialLinearScale, ArcElement } from 'chart.js';
|
|
14
13
|
import ChartDataLabels from 'chartjs-plugin-datalabels';
|
|
14
|
+
import { Bar, Line, PolarArea, Pie } from 'react-chartjs-2';
|
|
15
|
+
import annotationPlugin from 'chartjs-plugin-annotation';
|
|
15
16
|
import { Prism } from 'react-syntax-highlighter';
|
|
16
17
|
import { coldarkCold, coldarkDark } from 'react-syntax-highlighter/dist/esm/styles/prism';
|
|
17
18
|
import { ErrorBoundary } from 'react-error-boundary';
|
|
@@ -5107,9 +5108,9 @@ var isEmptyHtmlString = function isEmptyHtmlString(htmlString) {
|
|
|
5107
5108
|
|
|
5108
5109
|
var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
|
|
5109
5110
|
|
|
5110
|
-
var css$
|
|
5111
|
+
var css$1B = ".BaseCell_module_root__2651956d {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n padding: 0.5rem;\n gap: 0.5rem;\n flex: none;\n height: 3rem;\n background: var(--light-color3);\n max-width: 100%;\n max-height: 100%;\n}\n.BaseCell_module_root__2651956d > [data-elem*=component] {\n display: inline-block;\n max-height: 100%;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_sm__2651956d {\n width: 9.063rem;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_md__2651956d {\n width: 15.625rem;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_lg__2651956d {\n width: 21.875rem;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_auto__2651956d {\n width: auto;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_borderRadiusDefault__2651956d {\n border-radius: 0.25rem;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_borderRadiusRound__2651956d {\n border-radius: 50%;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_borderRadiusEllipse__2651956d {\n border-radius: 1.563rem;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_flexible__2651956d {\n flex-grow: 1;\n flex-shrink: 1;\n min-width: 3rem;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_flexible__2651956d.BaseCell_module_sm__2651956d {\n min-width: 9.063rem;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_flexible__2651956d.BaseCell_module_md__2651956d {\n min-width: 15.625rem;\n}\n.BaseCell_module_root__2651956d.BaseCell_module_flexible__2651956d.BaseCell_module_lg__2651956d {\n min-width: 21.875rem;\n}";
|
|
5111
5112
|
var modules_3af9b74c = {"root":"BaseCell_module_root__2651956d","sm":"BaseCell_module_sm__2651956d","md":"BaseCell_module_md__2651956d","lg":"BaseCell_module_lg__2651956d","auto":"BaseCell_module_auto__2651956d","border-radius-default":"BaseCell_module_borderRadiusDefault__2651956d","border-radius-round":"BaseCell_module_borderRadiusRound__2651956d","border-radius-ellipse":"BaseCell_module_borderRadiusEllipse__2651956d","flexible":"BaseCell_module_flexible__2651956d"};
|
|
5112
|
-
n(css$
|
|
5113
|
+
n(css$1B,{});
|
|
5113
5114
|
|
|
5114
5115
|
var BaseCell = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
5115
5116
|
var _props$className = props.className,
|
|
@@ -5182,9 +5183,9 @@ var defaultProps = {
|
|
|
5182
5183
|
attrs: {}
|
|
5183
5184
|
};
|
|
5184
5185
|
|
|
5185
|
-
var css$
|
|
5186
|
+
var css$1A = "button.BaseButton_module_root__c1cc92c2[data-elem=base-cell] {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n display: inline-flex;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n border: none;\n background: none;\n padding: 0.5rem 0.75rem;\n}\nbutton.BaseButton_module_root__c1cc92c2[data-elem=base-cell]:focus {\n outline: 1px solid var(--primary-color4);\n}\nbutton.BaseButton_module_root__c1cc92c2[data-elem=base-cell]:active {\n outline: none;\n}\nbutton.BaseButton_module_root__c1cc92c2[data-elem=base-cell]:disabled {\n cursor: not-allowed;\n}\nbutton.BaseButton_module_root__c1cc92c2[data-elem=base-cell].BaseButton_module_contained__c1cc92c2 {\n background: var(--text-color);\n color: var(--light-color3);\n}\nbutton.BaseButton_module_root__c1cc92c2[data-elem=base-cell].BaseButton_module_outlined__c1cc92c2 {\n color: var(--text-color);\n border: 1px solid var(--text-color);\n}\nbutton.BaseButton_module_root__c1cc92c2[data-elem=base-cell].BaseButton_module_text__c1cc92c2 {\n color: var(--text-color);\n}\nbutton.BaseButton_module_root__c1cc92c2[data-elem=base-cell] [data-elem*=component] {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\nbutton.BaseButton_module_root__c1cc92c2[data-elem=base-cell] [data-elem=component2] {\n min-width: 0;\n}\nbutton.BaseButton_module_root__c1cc92c2[data-elem=base-cell] [data-elem=title] {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n}";
|
|
5186
5187
|
var modules_ab72627b = {"root":"BaseButton_module_root__c1cc92c2","contained":"BaseButton_module_contained__c1cc92c2","outlined":"BaseButton_module_outlined__c1cc92c2","text":"BaseButton_module_text__c1cc92c2"};
|
|
5187
|
-
n(css$
|
|
5188
|
+
n(css$1A,{});
|
|
5188
5189
|
|
|
5189
5190
|
var BaseButton = /*#__PURE__*/forwardRef(function BaseButton(props, ref) {
|
|
5190
5191
|
var _props$className = props.className,
|
|
@@ -5244,9 +5245,9 @@ BaseButton.propTypes = _objectSpread2(_objectSpread2({}, BaseCell.propTypes), {}
|
|
|
5244
5245
|
variant: propTypesExports.oneOf(['contained', 'outlined', 'text'])
|
|
5245
5246
|
});
|
|
5246
5247
|
|
|
5247
|
-
var css$
|
|
5248
|
+
var css$1z = ".Button_module_root__cb319292[data-elem=base-cell] {\n cursor: pointer;\n}\n.Button_module_root__cb319292[data-elem=base-cell] [data-elem=component2] [data-elem=title] {\n font-weight: 500;\n font-size: 0.875rem;\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_primary__cb319292.Button_module_contained__cb319292 {\n background-color: var(--secondary-color2);\n color: var(--white);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_primary__cb319292.Button_module_contained__cb319292:hover {\n opacity: 0.85;\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_primary__cb319292.Button_module_text__cb319292 {\n color: var(--secondary-color2);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_primary__cb319292.Button_module_outlined__cb319292 {\n background-color: transparent;\n border-color: var(--secondary-color2);\n color: var(--secondary-color2);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_primary__cb319292.Button_module_outlined__cb319292:hover {\n background-color: var(--secondary-color2);\n color: var(--white);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_primary__cb319292.Button_module_outlined__cb319292:hover:hover {\n opacity: 0.85;\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_success__cb319292.Button_module_contained__cb319292 {\n background-color: var(--primary-color2);\n color: var(--white);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_success__cb319292.Button_module_contained__cb319292:hover {\n opacity: 0.85;\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_success__cb319292.Button_module_outlined__cb319292 {\n background-color: transparent;\n border-color: var(--primary-color2);\n color: var(--primary-color2);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_success__cb319292.Button_module_outlined__cb319292:hover {\n background-color: var(--primary-color2);\n color: var(--white);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_success__cb319292.Button_module_outlined__cb319292:hover:hover {\n opacity: 0.85;\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_success__cb319292.Button_module_text__cb319292 {\n color: var(--primary-color2);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_danger__cb319292.Button_module_contained__cb319292 {\n background-color: var(--primary-color1);\n color: var(--light-color3);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_danger__cb319292.Button_module_contained__cb319292:hover {\n opacity: 0.85;\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_danger__cb319292.Button_module_outlined__cb319292 {\n background-color: transparent;\n border-color: var(--primary-color1);\n color: var(--primary-color1);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_danger__cb319292.Button_module_outlined__cb319292:hover {\n background-color: var(--primary-color1);\n color: var(--white);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_danger__cb319292.Button_module_outlined__cb319292:hover:hover {\n opacity: 0.85;\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_danger__cb319292.Button_module_text__cb319292 {\n color: var(--primary-color1);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_warning__cb319292.Button_module_contained__cb319292 {\n background-color: var(--primary-color3);\n color: var(--light-color3);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_warning__cb319292.Button_module_contained__cb319292:hover {\n opacity: 0.85;\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_warning__cb319292.Button_module_outlined__cb319292 {\n background-color: transparent;\n border-color: var(--primary-color3);\n color: var(--primary-color3);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_warning__cb319292.Button_module_outlined__cb319292:hover {\n background-color: var(--primary-color3);\n color: var(--white);\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_warning__cb319292.Button_module_outlined__cb319292:hover:hover {\n opacity: 0.85;\n}\n.Button_module_root__cb319292[data-elem=base-cell].Button_module_warning__cb319292.Button_module_text__cb319292 {\n color: var(--primary-color3);\n}\n.Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_primary__cb319292.Button_module_contained__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_success__cb319292.Button_module_contained__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_danger__cb319292.Button_module_contained__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_warning__cb319292.Button_module_contained__cb319292 {\n background-color: var(--mono-color3);\n color: var(--mono-color1);\n}\n.Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_primary__cb319292.Button_module_outlined__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_success__cb319292.Button_module_outlined__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_danger__cb319292.Button_module_outlined__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_warning__cb319292.Button_module_outlined__cb319292 {\n background-color: transparent;\n border-color: var(--grey);\n}\n.Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_primary__cb319292.Button_module_outlined__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_primary__cb319292.Button_module_text__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_success__cb319292.Button_module_outlined__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_success__cb319292.Button_module_text__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_danger__cb319292.Button_module_outlined__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_danger__cb319292.Button_module_text__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_warning__cb319292.Button_module_outlined__cb319292, .Button_module_root__cb319292[data-elem=base-cell]:disabled.Button_module_warning__cb319292.Button_module_text__cb319292 {\n color: var(--grey);\n}";
|
|
5248
5249
|
var modules_b0070f27 = {"root":"Button_module_root__cb319292","primary":"Button_module_primary__cb319292","contained":"Button_module_contained__cb319292","text":"Button_module_text__cb319292","outlined":"Button_module_outlined__cb319292","success":"Button_module_success__cb319292","danger":"Button_module_danger__cb319292","warning":"Button_module_warning__cb319292"};
|
|
5249
|
-
n(css$
|
|
5250
|
+
n(css$1z,{});
|
|
5250
5251
|
|
|
5251
5252
|
var Button = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
5252
5253
|
var _props$className = props.className,
|
|
@@ -5294,9 +5295,9 @@ Button.propTypes = _objectSpread2(_objectSpread2({}, BaseButton.propTypes), {},
|
|
|
5294
5295
|
rightComponent: propTypesExports.node
|
|
5295
5296
|
});
|
|
5296
5297
|
|
|
5297
|
-
var css$
|
|
5298
|
+
var css$1y = ".Chip_module_root__9718bcd4[data-elem=base-cell] {\n position: relative;\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell] [data-elem=component2] [data-elem=title] {\n font-weight: 500;\n font-size: 0.875rem;\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_sm__9718bcd4 {\n height: 2rem;\n padding: 0.188rem 0.5rem;\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_md__9718bcd4 {\n height: 2.25rem;\n padding: 0.563rem 1rem;\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_status__9718bcd4.Chip_module_success__9718bcd4 {\n background-color: var(--success-bg);\n color: var(--success);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_status__9718bcd4.Chip_module_info__9718bcd4 {\n background-color: var(--info-bg);\n color: var(--primary-color4);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_status__9718bcd4.Chip_module_danger__9718bcd4 {\n background-color: var(--error-bg);\n color: var(--primary-color1);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_status__9718bcd4.Chip_module_warning__9718bcd4 {\n background-color: var(--warning-bg);\n color: var(--warning);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_status__9718bcd4.Chip_module_default__9718bcd4 {\n background-color: var(--grey5);\n color: var(--grey);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_status__9718bcd4:hover {\n box-shadow: 0px 8px 20px rgba(24, 24, 24, 0.08);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4 {\n border-width: 1px;\n border-style: solid;\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4.Chip_module_success__9718bcd4 {\n background-color: var(--success-bg);\n color: var(--success);\n border-color: var(--success-outline);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4.Chip_module_success__9718bcd4:hover {\n background-color: var(--success-outline);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4.Chip_module_info__9718bcd4 {\n background-color: var(--info-bg);\n color: var(--primary-color4);\n border-color: var(--info-outline);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4.Chip_module_info__9718bcd4:hover {\n background-color: var(--info-outline);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4.Chip_module_danger__9718bcd4 {\n background-color: var(--error-bg);\n color: var(--primary-color1);\n border-color: var(--error-outline);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4.Chip_module_danger__9718bcd4:hover {\n background-color: var(--error-outline);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4.Chip_module_warning__9718bcd4 {\n background-color: var(--warning-bg);\n color: var(--warning);\n border-color: var(--warning-outline);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4.Chip_module_warning__9718bcd4:hover {\n background-color: var(--warning-outline);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4.Chip_module_default__9718bcd4 {\n background-color: var(--grey8);\n color: var(--grey);\n border-color: var(--grey6);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell].Chip_module_input__9718bcd4.Chip_module_default__9718bcd4:hover {\n background-color: var(--grey6);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell]:disabled.Chip_module_status__9718bcd4, .Chip_module_root__9718bcd4[data-elem=base-cell]:disabled.Chip_module_input__9718bcd4 {\n filter: grayscale(1);\n border-color: var(--grey4);\n background-color: var(--grey5);\n color: var(--grey2);\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell]:disabled.Chip_module_status__9718bcd4 [data-elem=component1],\n.Chip_module_root__9718bcd4[data-elem=base-cell]:disabled.Chip_module_status__9718bcd4 [data-elem=component3], .Chip_module_root__9718bcd4[data-elem=base-cell]:disabled.Chip_module_input__9718bcd4 [data-elem=component1],\n.Chip_module_root__9718bcd4[data-elem=base-cell]:disabled.Chip_module_input__9718bcd4 [data-elem=component3] {\n opacity: 0.5;\n}\n.Chip_module_root__9718bcd4[data-elem=base-cell]:disabled.Chip_module_status__9718bcd4:hover, .Chip_module_root__9718bcd4[data-elem=base-cell]:disabled.Chip_module_input__9718bcd4:hover {\n box-shadow: none;\n background-color: var(--grey5);\n}";
|
|
5298
5299
|
var modules_31aa5fd7 = {"root":"Chip_module_root__9718bcd4","sm":"Chip_module_sm__9718bcd4","md":"Chip_module_md__9718bcd4","status":"Chip_module_status__9718bcd4","success":"Chip_module_success__9718bcd4","info":"Chip_module_info__9718bcd4","danger":"Chip_module_danger__9718bcd4","warning":"Chip_module_warning__9718bcd4","default":"Chip_module_default__9718bcd4","input":"Chip_module_input__9718bcd4"};
|
|
5299
|
-
n(css$
|
|
5300
|
+
n(css$1y,{});
|
|
5300
5301
|
|
|
5301
5302
|
var Chip = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
5302
5303
|
var _props$className = props.className,
|
|
@@ -5508,9 +5509,9 @@ AngleDouble.defaultProps = {
|
|
|
5508
5509
|
className: ''
|
|
5509
5510
|
};
|
|
5510
5511
|
|
|
5511
|
-
var css$
|
|
5512
|
+
var css$1x = ".Arrow_module_right__19f08663 {\n transform: rotate(0deg);\n}\n\n.Arrow_module_left__19f08663 {\n transform: rotate(180deg);\n}\n\n.Arrow_module_bottom__19f08663 {\n transform: rotate(90deg);\n}\n\n.Arrow_module_top__19f08663 {\n transform: rotate(270deg);\n}";
|
|
5512
5513
|
var modules_e313d483 = {"right":"Arrow_module_right__19f08663","left":"Arrow_module_left__19f08663","bottom":"Arrow_module_bottom__19f08663","top":"Arrow_module_top__19f08663"};
|
|
5513
|
-
n(css$
|
|
5514
|
+
n(css$1x,{});
|
|
5514
5515
|
|
|
5515
5516
|
var Arrow = function Arrow(props) {
|
|
5516
5517
|
var className = props.className,
|
|
@@ -6392,9 +6393,9 @@ CheckboxIcon.UnChecked.defaultProps = {
|
|
|
6392
6393
|
className: ''
|
|
6393
6394
|
};
|
|
6394
6395
|
|
|
6395
|
-
var css$
|
|
6396
|
+
var css$1w = ".Chevron_module_left__8b1808eb {\n transform: rotate(0deg);\n}\n\n.Chevron_module_bottom__8b1808eb {\n transform: rotate(90deg);\n}\n\n.Chevron_module_right__8b1808eb {\n transform: rotate(180deg);\n}\n\n.Chevron_module_top__8b1808eb {\n transform: rotate(270deg);\n}";
|
|
6396
6397
|
var modules_bf5b0b74 = {"left":"Chevron_module_left__8b1808eb","bottom":"Chevron_module_bottom__8b1808eb","right":"Chevron_module_right__8b1808eb","top":"Chevron_module_top__8b1808eb"};
|
|
6397
|
-
n(css$
|
|
6398
|
+
n(css$1w,{});
|
|
6398
6399
|
|
|
6399
6400
|
var Chevron = function Chevron(props) {
|
|
6400
6401
|
var className = props.className,
|
|
@@ -7494,9 +7495,9 @@ var ViewPasswordIcon = function ViewPasswordIcon(props) {
|
|
|
7494
7495
|
});
|
|
7495
7496
|
};
|
|
7496
7497
|
|
|
7497
|
-
var css$
|
|
7498
|
+
var css$1v = ".Accordion_module_root__ee8e457a {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: stretch;\n width: 100%;\n}\n.Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell] {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n gap: 0.5rem;\n padding: 0.5rem 1rem;\n cursor: pointer;\n}\n.Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell] > [data-elem=component1] .Accordion_module_icon__ee8e457a {\n transition: all 0.3s ease-in-out;\n}\n.Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell] > [data-elem=component1], .Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell] > [data-elem=component3] {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n.Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell] > [data-elem=component1] .Accordion_module_icon__ee8e457a, .Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell] > [data-elem=component3] .Accordion_module_icon__ee8e457a {\n transform: rotate(90deg);\n width: 1rem;\n height: 1rem;\n fill: var(--text-color);\n}\n.Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell] > [data-elem=component3] {\n margin-left: auto;\n}\n.Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell] .Accordion_module_title__ee8e457a {\n flex: 1 1 auto;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n color: var(--text-color);\n}\n.Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell]:hover {\n background: var(--background-color4);\n}\n.Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell]:hover .Accordion_module_icon__ee8e457a,\n.Accordion_module_root__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell]:hover .Accordion_module_title__ee8e457a {\n color: var(--secondary-color1);\n fill: var(--secondary-color1);\n}\n.Accordion_module_root__ee8e457a > .Accordion_module_body__ee8e457a {\n padding: 0.5rem 2.5rem;\n}\n.Accordion_module_root__ee8e457a.Accordion_module_open__ee8e457a > .Accordion_module_header__ee8e457a[data-elem=base-cell] [data-elem=component1] .Accordion_module_icon__ee8e457a {\n transform: none;\n}\n.Accordion_module_root__ee8e457a.Accordion_module_open__ee8e457a > .Accordion_module_body__ee8e457a {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: stretch;\n}\n.Accordion_module_root__ee8e457a.Accordion_module_open__ee8e457a > .Accordion_module_body__ee8e457a > button[data-elem=base-cell] {\n width: -moz-fit-content;\n width: fit-content;\n align-self: flex-end;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-items: center;\n}\n.Accordion_module_root__ee8e457a.Accordion_module_open__ee8e457a > .Accordion_module_body__ee8e457a > button[data-elem=base-cell] .Accordion_module_expand__ee8e457a {\n height: 1.5rem;\n width: 1.5rem;\n}";
|
|
7498
7499
|
var modules_8207625f = {"root":"Accordion_module_root__ee8e457a","header":"Accordion_module_header__ee8e457a","icon":"Accordion_module_icon__ee8e457a","title":"Accordion_module_title__ee8e457a","body":"Accordion_module_body__ee8e457a","open":"Accordion_module_open__ee8e457a","expand":"Accordion_module_expand__ee8e457a"};
|
|
7499
|
-
n(css$
|
|
7500
|
+
n(css$1v,{});
|
|
7500
7501
|
|
|
7501
7502
|
var Accordion = function Accordion(props) {
|
|
7502
7503
|
var open = props.open,
|
|
@@ -11788,13 +11789,13 @@ const useListNavigation = function (_ref, _temp2) {
|
|
|
11788
11789
|
}, [activeId, disabledIndicesRef, listRef, enabled, orientation, rtl, virtual, open, activeIndex, nested, selectedIndex, openOnArrowKeyDown, focusItemOnHover, allowEscape, cols, loop, refs, focusItem, onNavigate, onOpenChange]);
|
|
11789
11790
|
};
|
|
11790
11791
|
|
|
11791
|
-
var css$
|
|
11792
|
+
var css$1u = ".Alert_module_root__67bc0572 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n position: fixed;\n padding: 0.938rem;\n width: 37.5rem;\n opacity: 1;\n}\n.Alert_module_root__67bc0572.Alert_module_positionBottomCenter__67bc0572 {\n left: 50%;\n bottom: 1rem;\n transform: translate(-50%, 0);\n}\n.Alert_module_root__67bc0572.Alert_module_positionTopRight__67bc0572 {\n right: 1rem;\n top: 1rem;\n}\n.Alert_module_root__67bc0572.Alert_module_positionBottomRight__67bc0572 {\n right: 1rem;\n bottom: 1rem;\n}\n.Alert_module_root__67bc0572.Alert_module_positionTopCenter__67bc0572 {\n left: 50%;\n top: 1rem;\n transform: translate(-50%, 0%);\n}\n.Alert_module_root__67bc0572 .Alert_module_left__67bc0572 {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: flex-start;\n}\n.Alert_module_root__67bc0572 .Alert_module_left__67bc0572 .Alert_module_icons__67bc0572 {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 0.25rem 0.938rem 0rem 0rem;\n height: auto;\n}\n.Alert_module_root__67bc0572 .Alert_module_left__67bc0572 .Alert_module_icons__67bc0572 .Alert_module_icon__67bc0572 {\n width: 1.5rem;\n height: 1.5rem;\n}\n.Alert_module_root__67bc0572 .Alert_module_left__67bc0572 .Alert_module_content__67bc0572 {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n padding: 0.188rem 0.938rem 0rem 0rem;\n}\n.Alert_module_root__67bc0572 .Alert_module_left__67bc0572 .Alert_module_content__67bc0572 .Alert_module_title__67bc0572 {\n font-size: 1rem;\n font-weight: 600;\n padding-right: 2px;\n}\n.Alert_module_root__67bc0572 .Alert_module_left__67bc0572 .Alert_module_content__67bc0572 .Alert_module_description__67bc0572 {\n word-wrap: break-word;\n height: auto;\n font-size: 1rem;\n font-weight: 400;\n}\n.Alert_module_root__67bc0572 .Alert_module_actions__67bc0572 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n gap: 5px;\n}\n.Alert_module_root__67bc0572 .Alert_module_actions__67bc0572 .Alert_module_button__67bc0572 {\n padding: 0.313rem 1rem;\n font-weight: 400;\n}\n.Alert_module_root__67bc0572 .Alert_module_actions__67bc0572 .Alert_module_close__67bc0572 {\n height: auto;\n}\n.Alert_module_root__67bc0572 .Alert_module_actions__67bc0572 .Alert_module_close__67bc0572 .Alert_module_icon__67bc0572 {\n width: 1.25rem;\n height: 1.25rem;\n fill: var(--text-color);\n}\n.Alert_module_root__67bc0572.Alert_module_borderDefault__67bc0572 {\n border-width: 0.063rem;\n}\n.Alert_module_root__67bc0572.Alert_module_borderThickLeft__67bc0572 {\n border-width: 0.063rem 0.063rem 0.063rem 0.25rem;\n}\n.Alert_module_root__67bc0572.Alert_module_borderNone__67bc0572 {\n border-width: 0rem 0rem 0rem 0.25rem;\n}\n.Alert_module_root__67bc0572.Alert_module_info__67bc0572 {\n border-style: solid;\n border-color: var(--primary-color4);\n background-color: var(--background-color5);\n}\n.Alert_module_root__67bc0572.Alert_module_info__67bc0572 .Alert_module_icon__67bc0572 {\n fill: var(--primary-color4);\n}\n.Alert_module_root__67bc0572.Alert_module_success__67bc0572 {\n border-style: solid;\n border-color: var(--primary-color2);\n background-color: var(--background-color2);\n}\n.Alert_module_root__67bc0572.Alert_module_success__67bc0572 .Alert_module_icon__67bc0572 {\n fill: var(--primary-color2);\n}\n.Alert_module_root__67bc0572.Alert_module_danger__67bc0572 {\n border-style: solid;\n border-color: var(--primary-color1);\n background-color: var(--background-color1);\n}\n.Alert_module_root__67bc0572.Alert_module_danger__67bc0572 .Alert_module_icon__67bc0572 {\n fill: var(--primary-color1);\n}\n.Alert_module_root__67bc0572.Alert_module_warning__67bc0572 {\n border-style: solid;\n border-color: var(--primary-color3);\n background-color: var(--background-color3);\n}\n.Alert_module_root__67bc0572.Alert_module_warning__67bc0572 .Alert_module_icon__67bc0572 {\n fill: var(--primary-color3);\n}\n.Alert_module_root__67bc0572.Alert_module_shadow__67bc0572 {\n box-shadow: 0.125rem 0.5rem 1rem rgba(60, 60, 60, 0.12);\n}";
|
|
11792
11793
|
var modules_3a764ea3$1 = {"root":"Alert_module_root__67bc0572","position-bottom-center":"Alert_module_positionBottomCenter__67bc0572","position-top-right":"Alert_module_positionTopRight__67bc0572","position-bottom-right":"Alert_module_positionBottomRight__67bc0572","position-top-center":"Alert_module_positionTopCenter__67bc0572","left":"Alert_module_left__67bc0572","icons":"Alert_module_icons__67bc0572","icon":"Alert_module_icon__67bc0572","content":"Alert_module_content__67bc0572","title":"Alert_module_title__67bc0572","description":"Alert_module_description__67bc0572","actions":"Alert_module_actions__67bc0572","button":"Alert_module_button__67bc0572","close":"Alert_module_close__67bc0572","border-default":"Alert_module_borderDefault__67bc0572","border-thick-left":"Alert_module_borderThickLeft__67bc0572","border-none":"Alert_module_borderNone__67bc0572","info":"Alert_module_info__67bc0572","success":"Alert_module_success__67bc0572","danger":"Alert_module_danger__67bc0572","warning":"Alert_module_warning__67bc0572","shadow":"Alert_module_shadow__67bc0572"};
|
|
11793
|
-
n(css$
|
|
11794
|
+
n(css$1u,{});
|
|
11794
11795
|
|
|
11795
|
-
var css$
|
|
11796
|
+
var css$1t = ".Popper_module_backdrop__9fc51220 {\n position: fixed;\n z-index: 100;\n inset: 0;\n background: rgba(var(--black), 0.4);\n}\n.Popper_module_backdrop__9fc51220.Popper_module_transparent__9fc51220 {\n background: none;\n}\n.Popper_module_backdrop__9fc51220.Popper_module_hideBackdrop__9fc51220 {\n position: static !important;\n}";
|
|
11796
11797
|
var modules_fe46b225 = {"backdrop":"Popper_module_backdrop__9fc51220","transparent":"Popper_module_transparent__9fc51220","hide-backdrop":"Popper_module_hideBackdrop__9fc51220"};
|
|
11797
|
-
n(css$
|
|
11798
|
+
n(css$1t,{});
|
|
11798
11799
|
|
|
11799
11800
|
var Popper = function Popper(props) {
|
|
11800
11801
|
var open = props.open,
|
|
@@ -12046,9 +12047,9 @@ Alert$1.defaultProps = {
|
|
|
12046
12047
|
className: ''
|
|
12047
12048
|
};
|
|
12048
12049
|
|
|
12049
|
-
var css$
|
|
12050
|
+
var css$1s = ".Alert_module_root__c6a97f74 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n position: fixed;\n padding: 1rem;\n width: 37.5rem;\n opacity: 1;\n background-color: var(--light-color3);\n border-radius: 0.25rem;\n}\n.Alert_module_root__c6a97f74.Alert_module_info__c6a97f74 {\n background-color: var(--background-color4);\n}\n.Alert_module_root__c6a97f74.Alert_module_error__c6a97f74, .Alert_module_root__c6a97f74.Alert_module_danger__c6a97f74 {\n background-color: var(--background-color1);\n}\n.Alert_module_root__c6a97f74.Alert_module_success__c6a97f74 {\n background-color: var(--background-color2);\n}\n.Alert_module_root__c6a97f74.Alert_module_warning__c6a97f74 {\n background-color: var(--background-color3);\n}\n.Alert_module_root__c6a97f74.Alert_module_positionBottomCenter__c6a97f74 {\n left: 50%;\n bottom: 1rem;\n transform: translate(-50%, 0);\n}\n.Alert_module_root__c6a97f74.Alert_module_positionTopRight__c6a97f74 {\n right: 1rem;\n top: 1rem;\n}\n.Alert_module_root__c6a97f74.Alert_module_positionBottomRight__c6a97f74 {\n right: 1rem;\n bottom: 1rem;\n}\n.Alert_module_root__c6a97f74.Alert_module_positionTopCenter__c6a97f74 {\n left: 50%;\n top: 1rem;\n transform: translate(-50%, 0%);\n}\n.Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: flex-start;\n}\n.Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 .Alert_module_iconContainer__c6a97f74 {\n padding: 0.5rem;\n width: 2.5rem;\n height: 2.5rem;\n border-radius: 0.625rem;\n background: var(--light-color3);\n}\n.Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 .Alert_module_iconContainer__c6a97f74.Alert_module_info__c6a97f74 {\n box-shadow: 0px 0px 0.6rem 0px var(--secondary-color2);\n}\n.Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 .Alert_module_iconContainer__c6a97f74.Alert_module_error__c6a97f74, .Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 .Alert_module_iconContainer__c6a97f74.Alert_module_danger__c6a97f74 {\n box-shadow: 0px 0px 0.6rem 0px var(--primary-color1);\n}\n.Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 .Alert_module_iconContainer__c6a97f74.Alert_module_success__c6a97f74 {\n box-shadow: 0px 0px 0.6rem 0px var(--primary-color2);\n}\n.Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 .Alert_module_iconContainer__c6a97f74.Alert_module_warning__c6a97f74 {\n box-shadow: 0px 0px 0.6rem 0px var(--primary-color3);\n}\n.Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 .Alert_module_iconContainer__c6a97f74 .Alert_module_icon__c6a97f74 {\n width: 1.5rem;\n height: 1.5rem;\n}\n.Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 .Alert_module_content__c6a97f74 {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n margin-left: 1.25rem;\n gap: 0.25rem;\n}\n.Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 .Alert_module_content__c6a97f74 .Alert_module_title__c6a97f74 {\n color: var(--text-color);\n font-size: 1rem;\n font-weight: 600;\n}\n.Alert_module_root__c6a97f74 .Alert_module_left__c6a97f74 .Alert_module_content__c6a97f74 .Alert_module_description__c6a97f74 {\n word-wrap: break-word;\n color: var(--text-color);\n font-size: 1rem;\n line-height: 1.3125rem;\n font-weight: 400;\n}\n.Alert_module_root__c6a97f74 .Alert_module_actions__c6a97f74 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n gap: 0.3125rem;\n}\n.Alert_module_root__c6a97f74 .Alert_module_actions__c6a97f74 .Alert_module_button__c6a97f74 {\n padding: 0.313rem 1rem;\n font-weight: 400;\n}\n.Alert_module_root__c6a97f74 .Alert_module_actions__c6a97f74 .Alert_module_close__c6a97f74 {\n height: auto;\n}\n.Alert_module_root__c6a97f74 .Alert_module_actions__c6a97f74 .Alert_module_close__c6a97f74 .Alert_module_icon__c6a97f74 {\n width: 1.25rem;\n height: 1.25rem;\n fill: var(--text-color);\n}\n.Alert_module_root__c6a97f74.Alert_module_shadow__c6a97f74 {\n box-shadow: 0rem 0rem 0.5rem 0rem rgba(0, 0, 0, 0.25);\n}";
|
|
12050
12051
|
var modules_3a764ea3 = {"root":"Alert_module_root__c6a97f74","info":"Alert_module_info__c6a97f74","error":"Alert_module_error__c6a97f74","danger":"Alert_module_danger__c6a97f74","success":"Alert_module_success__c6a97f74","warning":"Alert_module_warning__c6a97f74","position-bottom-center":"Alert_module_positionBottomCenter__c6a97f74","position-top-right":"Alert_module_positionTopRight__c6a97f74","position-bottom-right":"Alert_module_positionBottomRight__c6a97f74","position-top-center":"Alert_module_positionTopCenter__c6a97f74","left":"Alert_module_left__c6a97f74","icon-container":"Alert_module_iconContainer__c6a97f74","icon":"Alert_module_icon__c6a97f74","content":"Alert_module_content__c6a97f74","title":"Alert_module_title__c6a97f74","description":"Alert_module_description__c6a97f74","actions":"Alert_module_actions__c6a97f74","button":"Alert_module_button__c6a97f74","close":"Alert_module_close__c6a97f74","shadow":"Alert_module_shadow__c6a97f74"};
|
|
12051
|
-
n(css$
|
|
12052
|
+
n(css$1s,{});
|
|
12052
12053
|
|
|
12053
12054
|
var ALERT_DISMISS_TIME = 2000;
|
|
12054
12055
|
var ANIMATION = {
|
|
@@ -12266,9 +12267,9 @@ Alert.propTypes = {
|
|
|
12266
12267
|
className: propTypesExports.string
|
|
12267
12268
|
};
|
|
12268
12269
|
|
|
12269
|
-
var css$
|
|
12270
|
+
var css$1r = ".Popover_module_root__c48bb8a2 {\n padding: 0.5rem;\n border-radius: 0.25rem;\n border: 1px solid var(--grey);\n}\n.Popover_module_root__c48bb8a2.Popover_module_darkTheme__c48bb8a2 {\n box-shadow: 0px dark 20px rgba(24, 24, 24, 0.08);\n background-color: var(--dark-grey);\n color: var(--white);\n border-color: var(--grey);\n}\n.Popover_module_root__c48bb8a2.Popover_module_lightTheme__c48bb8a2 {\n box-shadow: 0px light 20px rgba(24, 24, 24, 0.08);\n background-color: var(--white);\n color: var(--dark-grey);\n border-color: var(--grey4);\n}";
|
|
12270
12271
|
var modules_dfc4608f = {"root":"Popover_module_root__c48bb8a2","dark-theme":"Popover_module_darkTheme__c48bb8a2","light-theme":"Popover_module_lightTheme__c48bb8a2"};
|
|
12271
|
-
n(css$
|
|
12272
|
+
n(css$1r,{});
|
|
12272
12273
|
|
|
12273
12274
|
var Popover = function Popover(props) {
|
|
12274
12275
|
var _middlewareOptions$of, _middlewareOptions$sh, _middlewareOptions$fl;
|
|
@@ -12352,9 +12353,9 @@ Popover.propTypes = {
|
|
|
12352
12353
|
theme: propTypesExports.oneOf(['light', 'dark'])
|
|
12353
12354
|
};
|
|
12354
12355
|
|
|
12355
|
-
var css$
|
|
12356
|
+
var css$1q = ".Text_module_root__d10e5305 {\n color: var(--text-color);\n}\n.Text_module_root__d10e5305.Text_module_h1__d10e5305 {\n font-size: 2.25rem;\n line-height: 2.75rem;\n}\n.Text_module_root__d10e5305.Text_module_h2__d10e5305 {\n font-size: 1.375rem;\n line-height: 1.688rem;\n}\n.Text_module_root__d10e5305.Text_module_b1__d10e5305 {\n font-size: 1rem;\n line-height: 1.188rem;\n}\n.Text_module_root__d10e5305.Text_module_b2__d10e5305 {\n font-size: 0.875rem;\n line-height: 1.188rem;\n}\n.Text_module_root__d10e5305.Text_module_b3__d10e5305 {\n font-size: 0.75rem;\n line-height: 1.063rem;\n}\n.Text_module_root__d10e5305.Text_module_regularStroke__d10e5305 {\n font-weight: 400;\n}\n.Text_module_root__d10e5305.Text_module_mediumStroke__d10e5305 {\n font-weight: 500;\n}\n.Text_module_root__d10e5305.Text_module_semiboldStroke__d10e5305 {\n font-weight: 600;\n}\n.Text_module_root__d10e5305.Text_module_boldStroke__d10e5305 {\n font-weight: 800;\n}";
|
|
12356
12357
|
var modules_22fa3f10 = {"root":"Text_module_root__d10e5305","h1":"Text_module_h1__d10e5305","h2":"Text_module_h2__d10e5305","b1":"Text_module_b1__d10e5305","b2":"Text_module_b2__d10e5305","b3":"Text_module_b3__d10e5305","regular-stroke":"Text_module_regularStroke__d10e5305","medium-stroke":"Text_module_mediumStroke__d10e5305","semibold-stroke":"Text_module_semiboldStroke__d10e5305","bold-stroke":"Text_module_boldStroke__d10e5305"};
|
|
12357
|
-
n(css$
|
|
12358
|
+
n(css$1q,{});
|
|
12358
12359
|
|
|
12359
12360
|
var Text = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
12360
12361
|
var _props$variant = props.variant,
|
|
@@ -12388,9 +12389,9 @@ var Text = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
12388
12389
|
return null;
|
|
12389
12390
|
});
|
|
12390
12391
|
|
|
12391
|
-
var css$
|
|
12392
|
+
var css$1p = ".Link_module_root__349e1c8c {\n color: var(--primary-color4);\n text-decoration: none;\n}\n.Link_module_root__349e1c8c.Link_module_underlineNone__349e1c8c {\n text-decoration: none;\n}\n.Link_module_root__349e1c8c.Link_module_underlineHover__349e1c8c:hover {\n text-decoration: underline;\n}\n.Link_module_root__349e1c8c.Link_module_underlineAlways__349e1c8c {\n text-decoration: underline;\n}";
|
|
12392
12393
|
var modules_475441e2 = {"root":"Link_module_root__349e1c8c","underline-none":"Link_module_underlineNone__349e1c8c","underline-hover":"Link_module_underlineHover__349e1c8c","underline-always":"Link_module_underlineAlways__349e1c8c"};
|
|
12393
|
-
n(css$
|
|
12394
|
+
n(css$1p,{});
|
|
12394
12395
|
|
|
12395
12396
|
var Link = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
12396
12397
|
var _props$variant = props.variant,
|
|
@@ -12438,9 +12439,9 @@ Link.propTypes = _objectSpread2(_objectSpread2({}, Text.propTypes), {}, {
|
|
|
12438
12439
|
underline: propTypesExports.oneOf(['always', 'hover', 'none'])
|
|
12439
12440
|
});
|
|
12440
12441
|
|
|
12441
|
-
var css$
|
|
12442
|
+
var css$1o = ".Breadcrumbs_module_root__b3226ed9 {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n gap: 1rem;\n width: auto;\n overflow: auto;\n width: 100%;\n}\n.Breadcrumbs_module_root__b3226ed9 [data-elem=breadcrumb-separator-icon] {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n stroke: var(--text-color);\n fill: var(--text-color);\n width: 1.5rem;\n height: 1.5rem;\n}\n.Breadcrumbs_module_root__b3226ed9 button.Breadcrumbs_module_expand__b3226ed9[data-elem=base-cell] {\n background: var(--grey6);\n color: var(--text-color);\n height: 0.75rem;\n padding: 0.25rem;\n}\n.Breadcrumbs_module_root__b3226ed9 button.Breadcrumbs_module_expand__b3226ed9[data-elem=base-cell] [data-elem=title] {\n margin-bottom: 0.4rem;\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumbActions__b3226ed9[data-elem=base-cell] {\n height: 2rem;\n width: 2rem;\n background-color: var(--mono-color1) !important;\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumbActions__b3226ed9[data-elem=base-cell] > [data-elem=component1] > svg {\n margin-left: 0.125rem;\n fill: var(--white);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumbActions__b3226ed9[data-elem=base-cell] .Breadcrumbs_module_icon__b3226ed9 {\n width: 1.25rem;\n height: 1.25rem;\n fill: var(--light-color3);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumbActions__b3226ed9[data-elem=base-cell].Breadcrumbs_module_home__b3226ed9 {\n width: -moz-fit-content;\n width: fit-content;\n border-radius: 4px;\n background-color: var(--mono-color2) !important;\n color: var(--text-color);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumbActions__b3226ed9[data-elem=base-cell].Breadcrumbs_module_home__b3226ed9 .Breadcrumbs_module_icon__b3226ed9 {\n width: 1.25rem;\n height: 1.25rem;\n fill: var(--text-color);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumbActions__b3226ed9[data-elem=base-cell].Breadcrumbs_module_home__b3226ed9.Breadcrumbs_module_highlight__b3226ed9 {\n background-color: var(--mono-color1) !important;\n color: var(--light-color3);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumbActions__b3226ed9[data-elem=base-cell].Breadcrumbs_module_home__b3226ed9.Breadcrumbs_module_highlight__b3226ed9 .Breadcrumbs_module_icon__b3226ed9 {\n width: 1.25rem;\n height: 1.25rem;\n fill: var(--light-color3);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumb__b3226ed9 {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n gap: 0.5rem;\n padding: 0.5rem 0.5rem;\n border-radius: 0.25rem;\n background: var(--mono-color2);\n font-weight: 500;\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumb__b3226ed9:hover:not(.Breadcrumbs_module_active__b3226ed9) {\n cursor: pointer;\n background: var(--light-color1);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumb__b3226ed9.Breadcrumbs_module_active__b3226ed9 {\n background-color: var(--mono-color1);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumb__b3226ed9.Breadcrumbs_module_active__b3226ed9 .Breadcrumbs_module_title__b3226ed9 {\n color: var(--white);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumb__b3226ed9.Breadcrumbs_module_active__b3226ed9 .Breadcrumbs_module_value__b3226ed9 {\n color: var(--white);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumb__b3226ed9.Breadcrumbs_module_active__b3226ed9 .Breadcrumbs_module_iconWrapper__b3226ed9 svg {\n fill: var(--white);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumb__b3226ed9 .Breadcrumbs_module_title__b3226ed9 {\n color: var(--text-color);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumb__b3226ed9 .Breadcrumbs_module_value__b3226ed9 {\n color: var(--text-color);\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumb__b3226ed9 .Breadcrumbs_module_iconWrapper__b3226ed9 {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: 1rem;\n height: 1rem;\n}\n.Breadcrumbs_module_root__b3226ed9 .Breadcrumbs_module_crumb__b3226ed9 .Breadcrumbs_module_iconWrapper__b3226ed9 svg {\n fill: var(--primary-color4);\n}\n\ndiv.Breadcrumbs_module_popover__b3226ed9 {\n height: auto;\n width: auto;\n padding: 0.07rem 0.5rem;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n}\ndiv.Breadcrumbs_module_popover__b3226ed9 [data-elem=placeholder] {\n font-size: 0.875rem;\n}\ndiv.Breadcrumbs_module_popover__b3226ed9 .Breadcrumbs_module_crumbList__b3226ed9 {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n gap: 0.5rem;\n padding: 0.5rem 0.5rem;\n border-radius: 0.25rem;\n background: transparent;\n font-weight: 500;\n}\ndiv.Breadcrumbs_module_popover__b3226ed9 .Breadcrumbs_module_crumbList__b3226ed9:hover {\n cursor: pointer;\n background: var(--light-color1);\n}\ndiv.Breadcrumbs_module_popover__b3226ed9 .Breadcrumbs_module_crumbList__b3226ed9 .Breadcrumbs_module_title__b3226ed9 {\n color: var(--text-color);\n}\ndiv.Breadcrumbs_module_popover__b3226ed9 .Breadcrumbs_module_crumbList__b3226ed9 .Breadcrumbs_module_value__b3226ed9 {\n color: var(--text-color);\n}\n\ndiv.Breadcrumbs_module_popoverLight__b3226ed9 {\n background: var(--white) !important;\n border-color: var(--white) !important;\n}\ndiv.Breadcrumbs_module_popoverLight__b3226ed9 [data-elem=placeholder] {\n color: var(--white);\n}\ndiv.Breadcrumbs_module_popoverLight__b3226ed9 > svg {\n fill: var(--dark-grey);\n}\ndiv.Breadcrumbs_module_popoverLight__b3226ed9 .Breadcrumbs_module_bodyLight__b3226ed9 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n}\ndiv.Breadcrumbs_module_popoverLight__b3226ed9 .Breadcrumbs_module_bodyLight__b3226ed9 > [data-elem=component2] {\n flex: 1;\n}\ndiv.Breadcrumbs_module_popoverLight__b3226ed9 .Breadcrumbs_module_bodyLight__b3226ed9 > [data-elem=component2] .Breadcrumbs_module_contentLight__b3226ed9 {\n color: #7c7c7c;\n}\ndiv.Breadcrumbs_module_popoverLight__b3226ed9 .Breadcrumbs_module_bodyLight__b3226ed9 .Breadcrumbs_module_contentLight__b3226ed9 {\n color: #7c7c7c;\n}\ndiv.Breadcrumbs_module_popoverLight__b3226ed9 .Breadcrumbs_module_bodyLight__b3226ed9 .Breadcrumbs_module_contentLight__b3226ed9 button.Breadcrumbs_module_optionLight__b3226ed9 {\n color: #7c7c7c;\n}\ndiv.Breadcrumbs_module_popoverLight__b3226ed9 .Breadcrumbs_module_bodyLight__b3226ed9 .Breadcrumbs_module_contentLight__b3226ed9 .Breadcrumbs_module_expandIconLight__b3226ed9 {\n fill: var(--dark-grey);\n}";
|
|
12442
12443
|
var modules_651f50a9$1 = {"root":"Breadcrumbs_module_root__b3226ed9","expand":"Breadcrumbs_module_expand__b3226ed9","crumb-actions":"Breadcrumbs_module_crumbActions__b3226ed9","icon":"Breadcrumbs_module_icon__b3226ed9","home":"Breadcrumbs_module_home__b3226ed9","highlight":"Breadcrumbs_module_highlight__b3226ed9","crumb":"Breadcrumbs_module_crumb__b3226ed9","active":"Breadcrumbs_module_active__b3226ed9","title":"Breadcrumbs_module_title__b3226ed9","value":"Breadcrumbs_module_value__b3226ed9","iconWrapper":"Breadcrumbs_module_iconWrapper__b3226ed9","popover":"Breadcrumbs_module_popover__b3226ed9","crumb-list":"Breadcrumbs_module_crumbList__b3226ed9","popover-light":"Breadcrumbs_module_popoverLight__b3226ed9","body-light":"Breadcrumbs_module_bodyLight__b3226ed9","content-light":"Breadcrumbs_module_contentLight__b3226ed9","option-light":"Breadcrumbs_module_optionLight__b3226ed9","expand-icon-light":"Breadcrumbs_module_expandIconLight__b3226ed9"};
|
|
12443
|
-
n(css$
|
|
12444
|
+
n(css$1o,{});
|
|
12444
12445
|
|
|
12445
12446
|
var BreadCrumbs$1 = function BreadCrumbs(props) {
|
|
12446
12447
|
var crumbs = props.crumbs,
|
|
@@ -12622,9 +12623,9 @@ BreadCrumbs$1.defaultProps = {
|
|
|
12622
12623
|
className: ''
|
|
12623
12624
|
};
|
|
12624
12625
|
|
|
12625
|
-
var css$
|
|
12626
|
+
var css$1n = ".Breadcrumbs_module_root__a12d45a5 {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n height: 100%;\n width: -moz-fit-content;\n width: fit-content;\n border-radius: 0.25rem;\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit] {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n height: auto;\n width: auto;\n max-width: 17rem;\n border: 0.0313rem solid transparent;\n background: var(--light-color2);\n padding: 0.625rem 0.75rem;\n gap: 0rem;\n border-radius: 0.25rem;\n border: 0.0938rem solid transparent;\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit].Breadcrumbs_module_expand__a12d45a5 {\n border: 0.0938rem solid var(--secondary-color2);\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit] > [data-elem=component1] {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit] > [data-elem=component1] div.Breadcrumbs_module_iconWrapper__a12d45a5 {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit] > [data-elem=component1] div.Breadcrumbs_module_iconWrapper__a12d45a5 > svg {\n width: 1rem;\n height: 1rem;\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit] > [data-elem=component2] {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit] > [data-elem=component2] > [data-elem=title] {\n font-size: 0.875rem;\n color: var(--text-color);\n line-height: 1.3125rem;\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit].Breadcrumbs_module_gap__a12d45a5 > [data-elem=component2] {\n margin-left: 0.7775rem;\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit] > [data-elem=component3] {\n margin-left: 1.785rem;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-items: flex-end;\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit] > [data-elem=component3] .Breadcrumbs_module_icon__a12d45a5 {\n width: 1rem;\n height: 1rem;\n}\n.Breadcrumbs_module_root__a12d45a5 button[data-elem=base-cell].Breadcrumbs_module_selected__a12d45a5[type=submit] > [data-elem=component3] .Breadcrumbs_module_icon__a12d45a5.Breadcrumbs_module_expand__a12d45a5 path {\n stroke: var(--secondary-color2);\n}\n\ndiv.Breadcrumbs_module_popover__a12d45a5 {\n height: auto;\n padding: 0.75rem 0.625rem 0rem 0.625rem;\n background: var(--white) !important;\n border-color: var(--white) !important;\n box-shadow: 0rem 0rem 0.125rem 0rem rgba(0, 0, 0, 0.25);\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: 0.625rem;\n padding: 0.5rem 0.75rem;\n margin-bottom: 0.625rem;\n border-radius: 0.125rem;\n border: 0.0313rem solid var(--side-bar-icon2);\n font-weight: 500;\n color: var(--text-color);\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5:hover {\n cursor: pointer;\n background: var(--light-color2);\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5.Breadcrumbs_module_active__a12d45a5 {\n background: var(--background-color5);\n border: 0.0313rem solid transparent;\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_left__a12d45a5 {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: flex-start;\n gap: 0.625rem;\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_left__a12d45a5 .Breadcrumbs_module_iconWrapper__a12d45a5 {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: flex-start;\n color: var(--text-color);\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_left__a12d45a5 .Breadcrumbs_module_value__a12d45a5 {\n color: var(--text-color);\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_right__a12d45a5 {\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-items: flex-end;\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_right__a12d45a5 .Breadcrumbs_module_circle__a12d45a5 {\n width: 12px;\n height: 12px;\n border: 1.5px solid var(--secondary-color2);\n background-color: white;\n border-radius: 50%;\n z-index: 1000;\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_right__a12d45a5 .Breadcrumbs_module_circleDropdown__a12d45a5 {\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-items: flex-end;\n width: 12px;\n height: 12px;\n border: 1.5px solid var(--secondary-color2);\n background-color: var(--white);\n border-radius: 50%;\n z-index: 101;\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_right__a12d45a5 .Breadcrumbs_module_circleDropdown__a12d45a5 .Breadcrumbs_module_icon__a12d45a5 {\n margin-right: 1.8px;\n margin-bottom: 1.4px;\n transform: rotate(180deg);\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_right__a12d45a5 .Breadcrumbs_module_circleDropdown__a12d45a5 .Breadcrumbs_module_icon__a12d45a5 > path {\n fill: var(--secondary-color2);\n stroke: var(--secondary-color2);\n stroke-width: 0.2rem;\n stroke-linecap: round !important;\n stroke-linejoin: round;\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_right__a12d45a5 .Breadcrumbs_module_circleDropdown__a12d45a5::before {\n content: \"\";\n width: 0%;\n height: 26px;\n border-left: 1.5px dashed var(--secondary-color2);\n position: relative;\n bottom: 100%;\n right: -3.6px;\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_right__a12d45a5 .Breadcrumbs_module_circleFilled__a12d45a5 {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n width: 12px;\n height: 12px;\n border: 1.5px solid var(--secondary-color2);\n background-color: var(--secondary-color2);\n border-radius: 50%;\n z-index: 100;\n}\ndiv.Breadcrumbs_module_popover__a12d45a5 .Breadcrumbs_module_crumbList__a12d45a5 .Breadcrumbs_module_right__a12d45a5 .Breadcrumbs_module_circleFilled__a12d45a5::before {\n content: \"\";\n width: 0%;\n height: 40px;\n border-left: 1.5px solid var(--secondary-color2);\n position: relative;\n bottom: 200%;\n right: -3.6px;\n}";
|
|
12626
12627
|
var modules_651f50a9 = {"root":"Breadcrumbs_module_root__a12d45a5","selected":"Breadcrumbs_module_selected__a12d45a5","expand":"Breadcrumbs_module_expand__a12d45a5","iconWrapper":"Breadcrumbs_module_iconWrapper__a12d45a5","gap":"Breadcrumbs_module_gap__a12d45a5","icon":"Breadcrumbs_module_icon__a12d45a5","popover":"Breadcrumbs_module_popover__a12d45a5","crumb-list":"Breadcrumbs_module_crumbList__a12d45a5","active":"Breadcrumbs_module_active__a12d45a5","left":"Breadcrumbs_module_left__a12d45a5","value":"Breadcrumbs_module_value__a12d45a5","right":"Breadcrumbs_module_right__a12d45a5","circle":"Breadcrumbs_module_circle__a12d45a5","circle-dropdown":"Breadcrumbs_module_circleDropdown__a12d45a5","circle-filled":"Breadcrumbs_module_circleFilled__a12d45a5"};
|
|
12627
|
-
n(css$
|
|
12628
|
+
n(css$1n,{});
|
|
12628
12629
|
|
|
12629
12630
|
var BreadCrumbs = function BreadCrumbs(props) {
|
|
12630
12631
|
var _crumbs, _crumbs2, _crumbs3;
|
|
@@ -12732,9 +12733,9 @@ BreadCrumbs.propTypes = {
|
|
|
12732
12733
|
className: propTypesExports.string
|
|
12733
12734
|
};
|
|
12734
12735
|
|
|
12735
|
-
var css$
|
|
12736
|
+
var css$1m = ".Callout_module_root__6038df42 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n padding: 1rem;\n width: 100%;\n opacity: 1;\n background-color: var(--light-color3);\n border-radius: 0.25rem;\n}\n.Callout_module_root__6038df42 .Callout_module_left__6038df42 {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: flex-start;\n}\n.Callout_module_root__6038df42 .Callout_module_left__6038df42 .Callout_module_iconContainer__6038df42 {\n padding: 0.5rem;\n width: 2.5rem;\n height: 2.5rem;\n border-radius: 0.625rem;\n background: var(--light-color3);\n box-shadow: 0px 0px 0.25rem 0px rgba(0, 0, 0, 0.271);\n transition: box-shadow 0.5s ease-in-out;\n}\n.Callout_module_root__6038df42 .Callout_module_left__6038df42 .Callout_module_iconContainer__6038df42 .Callout_module_icon__6038df42 {\n width: 1.5rem;\n height: 1.5rem;\n}\n.Callout_module_root__6038df42 .Callout_module_left__6038df42 .Callout_module_content__6038df42 {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n gap: 0.25rem;\n margin-left: 1.25rem;\n}\n.Callout_module_root__6038df42 .Callout_module_left__6038df42 .Callout_module_content__6038df42 .Callout_module_title__6038df42 {\n color: var(--text-color);\n font-size: 0.875rem;\n font-weight: 600;\n}\n.Callout_module_root__6038df42 .Callout_module_left__6038df42 .Callout_module_content__6038df42 .Callout_module_description__6038df42 {\n word-wrap: break-word;\n height: auto;\n color: var(--text-color);\n font-size: 0.875rem;\n font-weight: 400;\n}\n.Callout_module_root__6038df42.Callout_module_info__6038df42 {\n box-shadow: 0rem 0rem 0.125rem 0rem rgba(0, 0, 0, 0.25);\n}\n.Callout_module_root__6038df42.Callout_module_info__6038df42 .Callout_module_iconContainer__6038df42 {\n box-shadow: 0rem 0rem 0.4rem 0rem var(--secondary-color2);\n}\n.Callout_module_root__6038df42.Callout_module_success__6038df42 {\n box-shadow: 0rem 0rem 0.125rem 0rem rgba(0, 0, 0, 0.25);\n}\n.Callout_module_root__6038df42.Callout_module_success__6038df42 .Callout_module_iconContainer__6038df42 {\n box-shadow: 0rem 0rem 0.4rem 0rem var(--primary-color2);\n}\n.Callout_module_root__6038df42.Callout_module_danger__6038df42, .Callout_module_root__6038df42.Callout_module_error__6038df42 {\n box-shadow: 0rem 0rem 0.125rem 0rem rgba(0, 0, 0, 0.25);\n}\n.Callout_module_root__6038df42.Callout_module_danger__6038df42 .Callout_module_iconContainer__6038df42, .Callout_module_root__6038df42.Callout_module_error__6038df42 .Callout_module_iconContainer__6038df42 {\n box-shadow: 0rem 0rem 0.4rem 0rem var(--primary-color1);\n}\n.Callout_module_root__6038df42.Callout_module_warning__6038df42 {\n box-shadow: 0rem 0rem 0.125rem 0rem rgba(0, 0, 0, 0.25);\n}\n.Callout_module_root__6038df42.Callout_module_warning__6038df42 .Callout_module_iconContainer__6038df42 {\n box-shadow: 0rem 0rem 0.4rem 0rem var(--primary-color3);\n}\n.Callout_module_root__6038df42.Callout_module_shadow__6038df42 {\n box-shadow: 0rem 0.0625rem 0.25rem 0rem rgba(0, 0, 0, 0.25), 0rem 0.1875rem 0.25rem 0rem rgba(0, 0, 0, 0.25);\n}";
|
|
12736
12737
|
var modules_b6de2704 = {"root":"Callout_module_root__6038df42","left":"Callout_module_left__6038df42","icon-container":"Callout_module_iconContainer__6038df42","icon":"Callout_module_icon__6038df42","content":"Callout_module_content__6038df42","title":"Callout_module_title__6038df42","description":"Callout_module_description__6038df42","info":"Callout_module_info__6038df42","success":"Callout_module_success__6038df42","danger":"Callout_module_danger__6038df42","error":"Callout_module_error__6038df42","warning":"Callout_module_warning__6038df42","shadow":"Callout_module_shadow__6038df42"};
|
|
12737
|
-
n(css$
|
|
12738
|
+
n(css$1m,{});
|
|
12738
12739
|
|
|
12739
12740
|
var Callout = /*#__PURE__*/forwardRef(function (props) {
|
|
12740
12741
|
var _props$showIcon = props.showIcon,
|
|
@@ -12820,9 +12821,9 @@ Callout.propTypes = {
|
|
|
12820
12821
|
className: propTypesExports.string
|
|
12821
12822
|
};
|
|
12822
12823
|
|
|
12823
|
-
var css$
|
|
12824
|
+
var css$1l = ":root {\n --white: #ffffff;\n --black: #141920;\n --dark-grey: #333333;\n --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n --grey: #737373;\n --grey1: #888888;\n --grey2: #a6a6a6;\n --grey3: #bbbbbb;\n --grey4: #c4c4c4;\n --grey5: #dddddd;\n --grey6: #e8e8e8;\n --grey7: #eeeeee;\n --grey8: #f2f2f2;\n --grey9: #eff0f0;\n --grey10: #f7f7f7;\n --skeleton: #e0e1e9;\n --highlight: #0f62fe;\n --dark-blue: #001833;\n --background: #d0e2ff;\n --menu-black: #191b1f;\n --banyan-blue: #00037c;\n --banyan-orange: #ff892a;\n --banyan-pink: #ff1597;\n --banyan-gradient: linear-gradient(\n \t84.71deg,\n \tvar(--banyan-pink) 0.48%,\n \tvar(--banyan-orange) 99.57%\n );\n --error: #ff626a;\n --error-bg: #fff1f1;\n --error-outline: rgba(218, 30, 40, 0.08);\n --success: #24a148;\n --success-bg: #defbe6;\n --success-outline: rgba(36, 161, 72, 0.08);\n --warning: #f1c21b;\n --warning-bg: #fff8e1;\n --warning-outline: rgba(203, 160, 6, 0.08);\n --info: #0043ce;\n --info-bg: #edf5ff;\n --info-outline: #2864db98;\n}\n:root[data-theme=light] {\n --primary-color1: #bd3c45;\n --primary-color2: #487349;\n --primary-color3: #cba006;\n --primary-color4: #0043ce;\n --secondary-color1: #0a15f9;\n --secondary-color2: #0f62fe;\n --secondary-color3: #0fa9ff;\n --secondary-color4: #a91aa3;\n --secondary-color5: #ef87f8;\n --secondary-color6: #fcab0f;\n --secondary-color7: #dce01d;\n --background-color1: #ffebec;\n --background-color2: #edffed;\n --background-color3: #fff6d4;\n --background-color4: #e6edff;\n --background-color5: #cfdfff;\n --mono-color1: #71839b;\n --mono-color2: #b7cadb;\n --mono-color3: #d8dfe5;\n --light-color1: #efeff0;\n --light-color2: #f7f7f8;\n --light-color3: #ffffff;\n --text-color: #141920;\n --side-bar-icon1: #97979f;\n --side-bar-icon2: #d5d5db;\n}\n:root[data-theme=dark] {\n --primary-color1: #b33030;\n --primary-color2: #4e9f3d;\n --primary-color3: #ebb700;\n --primary-color4: #0053ff;\n --secondary-color1: #2e37ff;\n --secondary-color2: #2d76ff;\n --secondary-color3: #39b8ff;\n --secondary-color4: #dc00d3;\n --secondary-color5: #f8a4ff;\n --secondary-color6: #ffbf45;\n --secondary-color7: #fbff42;\n --background-color1: #e5d3d4;\n --background-color2: #d6e5d6;\n --background-color3: #e5ddbe;\n --background-color4: #cfd6e5;\n --background-color5: #bac9e5;\n --mono-color1: #4c5869;\n --mono-color2: #8d9ba8;\n --mono-color3: #a8adb2;\n --light-color1: #1b1b1c;\n --light-color2: #151517;\n --light-color3: #141920;\n --text-color: #fafafa;\n --side-bar-icon1: #96969e;\n --side-bar-icon2: #bcbcc2;\n}";
|
|
12824
12825
|
var modules_1722b0e5 = {"white":"--white","black":"--black","menu-black":"--menu-black","dark-grey":"--dark-grey","dark-grey-o-85":"--dark-grey-o-85","grey":"--grey","grey1":"--grey1","grey2":"--grey2","grey3":"--grey3","grey4":"--grey4","grey5":"--grey5","grey6":"--grey6","grey7":"--grey7","grey8":"--grey8","grey9":"--grey9","grey10":"--grey10","highlight":"--highlight","dark-blue":"--dark-blue","background":"--background","banyan-blue":"--banyan-blue","banyan-orange":"--banyan-orange","banyan-pink":"--banyan-pink","banyan-gradient":"--banyan-gradient","error":"--error","error-bg":"--error-bg","error-outline":"--error-outline","success":"--success","success-bg":"--success-bg","success-outline":"--success-outline","warning":"--warning","warning-bg":"--warning-bg","warning-outline":"--warning-outline","info":"--info","info-bg":"--info-bg","info-outline":"--info-outline","theme-light-primary-color1":"#bd3c45","theme-light-primary-color2":"#487349","theme-light-primary-color3":"#cba006","theme-light-primary-color4":"#0043ce","theme-light-secondary-color1":"#0a15f9","theme-light-secondary-color2":"#0f62fe","theme-light-secondary-color3":"#0fa9ff","theme-light-secondary-color4":"#a91aa3","theme-light-secondary-color5":"#ef87f8","theme-light-secondary-color6":"#fcab0f","theme-light-secondary-color7":"#dce01d","theme-light-background-color1":"#ffebec","theme-light-background-color2":"#edffed","theme-light-background-color3":"#fff6d4","theme-light-background-color4":"#e6edff","theme-light-background-color5":"#cfdfff","theme-light-mono-color1":"#71839b","theme-light-mono-color2":"#b7cadb","theme-light-mono-color3":"#d8dfe5","theme-light-light-color1":"#efeff0","theme-light-light-color2":"#f7f7f8","theme-light-light-color3":"#ffffff","theme-light-side-bar-icon1":"#97979f","theme-light-side-bar-icon2":"#d5d5db","theme-light-text-color":"#141920","theme-dark-primary-color1":"#b33030","theme-dark-primary-color2":"#4e9f3d","theme-dark-primary-color3":"#ebb700","theme-dark-primary-color4":"#0053ff","theme-dark-secondary-color1":"#2e37ff","theme-dark-secondary-color2":"#2d76ff","theme-dark-secondary-color3":"#39b8ff","theme-dark-secondary-color4":"#dc00d3","theme-dark-secondary-color5":"#f8a4ff","theme-dark-secondary-color6":"#ffbf45","theme-dark-secondary-color7":"#fbff42","theme-dark-background-color1":"#e5d3d4","theme-dark-background-color2":"#d6e5d6","theme-dark-background-color3":"#e5ddbe","theme-dark-background-color4":"#cfd6e5","theme-dark-background-color5":"#bac9e5","theme-dark-mono-color1":"#4c5869","theme-dark-mono-color2":"#8d9ba8","theme-dark-mono-color3":"#a8adb2","theme-dark-light-color1":"#000000","theme-dark-light-color2":"#151517","theme-dark-light-color3":"#1b1b1c","theme-dark-side-bar-icon1":"#96969e","theme-dark-side-bar-icon2":"#bcbcc2","theme-dark-text-color":"#fafafa"};
|
|
12825
|
-
n(css$
|
|
12826
|
+
n(css$1l,{});
|
|
12826
12827
|
|
|
12827
12828
|
var COLORS = Object.keys(modules_1722b0e5).reduce(function (acc, curr) {
|
|
12828
12829
|
if (curr !== null && curr !== void 0 && curr.includes('theme')) {
|
|
@@ -12833,9 +12834,9 @@ var COLORS = Object.keys(modules_1722b0e5).reduce(function (acc, curr) {
|
|
|
12833
12834
|
return acc;
|
|
12834
12835
|
}, {});
|
|
12835
12836
|
|
|
12836
|
-
var css$
|
|
12837
|
+
var css$1k = ".BaseAreaChart_module_root__42b6c9fb {\n width: \"100%\";\n}\n\n.BaseAreaChart_module_empty__42b6c9fb {\n gap: 1rem;\n height: 90%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n.BaseAreaChart_module_empty__42b6c9fb .BaseAreaChart_module_text__42b6c9fb {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n gap: 1rem;\n}\n.BaseAreaChart_module_empty__42b6c9fb .BaseAreaChart_module_text__42b6c9fb .BaseAreaChart_module_title__42b6c9fb {\n font-family: Poppins;\n font-size: 1.75rem;\n font-weight: 600;\n line-height: 1.875rem;\n}\n.BaseAreaChart_module_empty__42b6c9fb .BaseAreaChart_module_text__42b6c9fb .BaseAreaChart_module_description__42b6c9fb {\n font-family: Poppins;\n font-size: 1.25rem;\n font-weight: 400;\n line-height: 1.3125rem;\n}";
|
|
12837
12838
|
var modules_6d3781f0 = {"root":"BaseAreaChart_module_root__42b6c9fb","empty":"BaseAreaChart_module_empty__42b6c9fb","text":"BaseAreaChart_module_text__42b6c9fb","title":"BaseAreaChart_module_title__42b6c9fb","description":"BaseAreaChart_module_description__42b6c9fb"};
|
|
12838
|
-
n(css$
|
|
12839
|
+
n(css$1k,{});
|
|
12839
12840
|
|
|
12840
12841
|
echarts.use([TitleComponent, LegendComponent, TooltipComponent, GridComponent, DatasetComponent, LineChart, CanvasRenderer]);
|
|
12841
12842
|
var BaseAreaChart$1 = function BaseAreaChart(props) {
|
|
@@ -13121,9 +13122,9 @@ BaseAreaChart$1.defaultProps = {
|
|
|
13121
13122
|
theme: 'dark'
|
|
13122
13123
|
};
|
|
13123
13124
|
|
|
13124
|
-
var css$
|
|
13125
|
+
var css$1j = ".CapsuleChart_module_root__a4eceb11 {\n width: \"100%\";\n}\n\n.CapsuleChart_module_empty__a4eceb11 {\n gap: 1rem;\n height: 90%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n.CapsuleChart_module_empty__a4eceb11 .CapsuleChart_module_text__a4eceb11 {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n gap: 1rem;\n}\n.CapsuleChart_module_empty__a4eceb11 .CapsuleChart_module_text__a4eceb11 .CapsuleChart_module_title__a4eceb11 {\n font-family: Poppins;\n font-size: 1.75rem;\n font-weight: 600;\n line-height: 1.875rem;\n}\n.CapsuleChart_module_empty__a4eceb11 .CapsuleChart_module_text__a4eceb11 .CapsuleChart_module_description__a4eceb11 {\n font-family: Poppins;\n font-size: 1.25rem;\n font-weight: 400;\n line-height: 1.3125rem;\n}";
|
|
13125
13126
|
var modules_7b350c6d = {"root":"CapsuleChart_module_root__a4eceb11","empty":"CapsuleChart_module_empty__a4eceb11","text":"CapsuleChart_module_text__a4eceb11","title":"CapsuleChart_module_title__a4eceb11","description":"CapsuleChart_module_description__a4eceb11"};
|
|
13126
|
-
n(css$
|
|
13127
|
+
n(css$1j,{});
|
|
13127
13128
|
|
|
13128
13129
|
echarts.use([TitleComponent, DataZoomComponent, DataZoomInsideComponent, DataZoomSliderComponent, TooltipComponent, GridComponent, DatasetComponent, LegendComponent, BarChart, CanvasRenderer]);
|
|
13129
13130
|
var AXIS_COLORS$1 = {
|
|
@@ -13164,7 +13165,7 @@ var determineGradient$2 = function determineGradient(seriesData, objectData, ind
|
|
|
13164
13165
|
}
|
|
13165
13166
|
return '';
|
|
13166
13167
|
};
|
|
13167
|
-
var CapsuleChart = function CapsuleChart(props) {
|
|
13168
|
+
var CapsuleChart$1 = function CapsuleChart(props) {
|
|
13168
13169
|
var _Object$keys, _seriesData$chartData2, _seriesData$metaData$, _seriesData$metaData, _seriesData$chartData4, _seriesData$chartData18;
|
|
13169
13170
|
var _props$title = props.title,
|
|
13170
13171
|
title = _props$title === void 0 ? '' : _props$title,
|
|
@@ -13439,13 +13440,13 @@ var CapsuleChart = function CapsuleChart(props) {
|
|
|
13439
13440
|
});
|
|
13440
13441
|
};
|
|
13441
13442
|
|
|
13442
|
-
var css$
|
|
13443
|
+
var css$1i = ".HeatMapChart_module_root__41cf6ace {\n width: \"100%\";\n}";
|
|
13443
13444
|
var modules_0ba85659 = {"root":"HeatMapChart_module_root__41cf6ace"};
|
|
13444
|
-
n(css$
|
|
13445
|
+
n(css$1i,{});
|
|
13445
13446
|
|
|
13446
|
-
var css$
|
|
13447
|
-
var modules_37a5ff73$
|
|
13448
|
-
n(css$
|
|
13447
|
+
var css$1h = ".Skeleton_module_root__ad62f983 {\n width: 100%;\n height: 100%;\n background: var(--grey6);\n background-repeat: no-repeat;\n background-size: cover;\n display: inline-block;\n}\n.Skeleton_module_root__ad62f983.Skeleton_module_lightTheme__ad62f983 {\n background-color: var(--skeleton);\n}\n.Skeleton_module_root__ad62f983.Skeleton_module_darkTheme__ad62f983 {\n background-color: var(--grey2);\n opacity: 0.2;\n}\n.Skeleton_module_root__ad62f983.Skeleton_module_animated__ad62f983 {\n animation-duration: 1.25s;\n animation-fill-mode: forwards;\n animation-iteration-count: infinite;\n animation-name: Skeleton_module_shimmer__ad62f983;\n animation-timing-function: linear;\n -webkit-animation-fill-mode: forwards;\n -webkit-animation-iteration-count: infinite;\n -webkit-animation-name: Skeleton_module_shimmer__ad62f983;\n -webkit-animation-timing-function: linear;\n}\n.Skeleton_module_root__ad62f983.Skeleton_module_animated__ad62f983.Skeleton_module_lightTheme__ad62f983 {\n background-image: linear-gradient(to right, var(--skeleton) 0%, var(--grey8) 20%, var(--skeleton) 40%, var(--skeleton) 100%);\n}\n.Skeleton_module_root__ad62f983.Skeleton_module_animated__ad62f983.Skeleton_module_darkTheme__ad62f983 {\n background-image: linear-gradient(to right, var(--grey2) 0%, var(--grey4) 20%, var(--grey2) 40%, var(--grey2) 100%);\n}\n.Skeleton_module_root__ad62f983.Skeleton_module_text__ad62f983 {\n height: 1.5rem;\n}\n.Skeleton_module_root__ad62f983.Skeleton_module_circle__ad62f983 {\n border-radius: 50%;\n}\n.Skeleton_module_root__ad62f983.Skeleton_module_rounded__ad62f983 {\n border-radius: 0.25rem;\n}\n.Skeleton_module_root__ad62f983.Skeleton_module_ellipse__ad62f983 {\n border-radius: 1.5rem;\n}\n\n@keyframes Skeleton_module_shimmer__ad62f983 {\n 0% {\n background-position: -50rem 0;\n }\n 100% {\n background-position: 50rem 0;\n }\n}";
|
|
13448
|
+
var modules_37a5ff73$d = {"root":"Skeleton_module_root__ad62f983","light-theme":"Skeleton_module_lightTheme__ad62f983","dark-theme":"Skeleton_module_darkTheme__ad62f983","animated":"Skeleton_module_animated__ad62f983","shimmer":"Skeleton_module_shimmer__ad62f983","text":"Skeleton_module_text__ad62f983","circle":"Skeleton_module_circle__ad62f983","rounded":"Skeleton_module_rounded__ad62f983","ellipse":"Skeleton_module_ellipse__ad62f983"};
|
|
13449
|
+
n(css$1h,{});
|
|
13449
13450
|
|
|
13450
13451
|
var Skeleton = function Skeleton(props) {
|
|
13451
13452
|
var height = props.height,
|
|
@@ -13457,7 +13458,7 @@ var Skeleton = function Skeleton(props) {
|
|
|
13457
13458
|
style = props.style;
|
|
13458
13459
|
return /*#__PURE__*/jsx("span", {
|
|
13459
13460
|
"data-elem": "skeleton",
|
|
13460
|
-
className: classes(modules_37a5ff73$
|
|
13461
|
+
className: classes(modules_37a5ff73$d.root, modules_37a5ff73$d[variant], modules_37a5ff73$d["".concat(theme, "-theme")], noAnimation ? '' : modules_37a5ff73$d.animated, className),
|
|
13461
13462
|
style: _objectSpread2({
|
|
13462
13463
|
height: height,
|
|
13463
13464
|
width: width
|
|
@@ -13484,22 +13485,22 @@ Skeleton.defaultProps = {
|
|
|
13484
13485
|
style: {}
|
|
13485
13486
|
};
|
|
13486
13487
|
|
|
13487
|
-
var css$
|
|
13488
|
-
var modules_37a5ff73$
|
|
13489
|
-
n(css$
|
|
13488
|
+
var css$1g = ".Skeleton_module_root__79bb2358 {\n display: grid;\n grid-template-rows: auto;\n grid-template-columns: repeat(6, 1fr);\n row-gap: 0.25rem;\n -moz-column-gap: 0.25rem;\n column-gap: 0.25rem;\n height: 100%;\n}";
|
|
13489
|
+
var modules_37a5ff73$c = {"root":"Skeleton_module_root__79bb2358"};
|
|
13490
|
+
n(css$1g,{});
|
|
13490
13491
|
|
|
13491
13492
|
var BOXES = _toConsumableArray(Array(36).keys()).map(function () {
|
|
13492
13493
|
return Math.random() * 80 + 20;
|
|
13493
13494
|
});
|
|
13494
|
-
var ChartSkeleton$
|
|
13495
|
+
var ChartSkeleton$9 = function ChartSkeleton(_ref) {
|
|
13495
13496
|
var theme = _ref.theme,
|
|
13496
13497
|
fallback = _ref.fallback;
|
|
13497
13498
|
return /*#__PURE__*/jsx("div", {
|
|
13498
|
-
className: modules_37a5ff73$
|
|
13499
|
+
className: modules_37a5ff73$c.root,
|
|
13499
13500
|
children: BOXES.map(function (box) {
|
|
13500
13501
|
return /*#__PURE__*/jsx(Skeleton, {
|
|
13501
13502
|
theme: theme,
|
|
13502
|
-
className: modules_37a5ff73$
|
|
13503
|
+
className: modules_37a5ff73$c.box,
|
|
13503
13504
|
height: "100%",
|
|
13504
13505
|
noAnimation: fallback
|
|
13505
13506
|
}, box);
|
|
@@ -13535,7 +13536,7 @@ var HeatMapChart = function HeatMapChart(props) {
|
|
|
13535
13536
|
theme = props.theme,
|
|
13536
13537
|
fallback = props.fallback;
|
|
13537
13538
|
if (loading || fallback) {
|
|
13538
|
-
return /*#__PURE__*/jsx(ChartSkeleton$
|
|
13539
|
+
return /*#__PURE__*/jsx(ChartSkeleton$9, {
|
|
13539
13540
|
theme: theme,
|
|
13540
13541
|
fallback: !loading && fallback
|
|
13541
13542
|
});
|
|
@@ -13732,23 +13733,23 @@ HeatMapChart.defaultProps = {
|
|
|
13732
13733
|
theme: 'dark'
|
|
13733
13734
|
};
|
|
13734
13735
|
|
|
13735
|
-
var css$
|
|
13736
|
+
var css$1f = ".BaseHorizontalBarChart_module_root__75f8867a {\n width: \"100%\";\n}";
|
|
13736
13737
|
var modules_8904c6a0 = {"root":"BaseHorizontalBarChart_module_root__75f8867a"};
|
|
13737
|
-
n(css$
|
|
13738
|
+
n(css$1f,{});
|
|
13738
13739
|
|
|
13739
|
-
var css$
|
|
13740
|
-
var modules_37a5ff73$
|
|
13741
|
-
n(css$
|
|
13740
|
+
var css$1e = ".Skeleton_module_root__daf92a10 {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: flex-start;\n height: 100%;\n width: 100%;\n gap: 1rem;\n padding: 2rem;\n}";
|
|
13741
|
+
var modules_37a5ff73$b = {"root":"Skeleton_module_root__daf92a10"};
|
|
13742
|
+
n(css$1e,{});
|
|
13742
13743
|
|
|
13743
|
-
var BARS$
|
|
13744
|
+
var BARS$2 = _toConsumableArray(Array(8).keys()).map(function () {
|
|
13744
13745
|
return Math.random() * 80 + 20;
|
|
13745
13746
|
});
|
|
13746
|
-
var ChartSkeleton$
|
|
13747
|
+
var ChartSkeleton$8 = function ChartSkeleton(_ref) {
|
|
13747
13748
|
var theme = _ref.theme,
|
|
13748
13749
|
fallback = _ref.fallback;
|
|
13749
13750
|
return /*#__PURE__*/jsx("div", {
|
|
13750
|
-
className: modules_37a5ff73$
|
|
13751
|
-
children: BARS$
|
|
13751
|
+
className: modules_37a5ff73$b.root,
|
|
13752
|
+
children: BARS$2.map(function (bar) {
|
|
13752
13753
|
return /*#__PURE__*/jsx(Skeleton, {
|
|
13753
13754
|
theme: theme,
|
|
13754
13755
|
variant: "rounded",
|
|
@@ -13791,7 +13792,7 @@ var BaseHorizontalBarChart = function BaseHorizontalBarChart(props) {
|
|
|
13791
13792
|
_props$sort = props.sort,
|
|
13792
13793
|
sort = _props$sort === void 0 ? false : _props$sort;
|
|
13793
13794
|
if (loading || fallback) {
|
|
13794
|
-
return /*#__PURE__*/jsx(ChartSkeleton$
|
|
13795
|
+
return /*#__PURE__*/jsx(ChartSkeleton$8, {
|
|
13795
13796
|
theme: theme,
|
|
13796
13797
|
fallback: !loading && fallback
|
|
13797
13798
|
});
|
|
@@ -14031,43 +14032,43 @@ BaseHorizontalBarChart.defaultProps = {
|
|
|
14031
14032
|
theme: 'dark'
|
|
14032
14033
|
};
|
|
14033
14034
|
|
|
14034
|
-
var css$
|
|
14035
|
+
var css$1d = ".NestedPieChart_module_root__c8f30b3e {\n width: 100%;\n}";
|
|
14035
14036
|
var modules_23ba650c = {"root":"NestedPieChart_module_root__c8f30b3e"};
|
|
14036
|
-
n(css$
|
|
14037
|
+
n(css$1d,{});
|
|
14037
14038
|
|
|
14038
|
-
var css$
|
|
14039
|
-
var modules_37a5ff73$
|
|
14040
|
-
n(css$
|
|
14039
|
+
var css$1c = ".Skeleton_module_root__ecbd3e3d {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n overflow: hidden;\n position: relative;\n}\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_outer__ecbd3e3d,\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n max-width: 100%;\n max-height: 100%;\n}\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n position: absolute;\n opacity: 1;\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n opacity: 1;\n height: 0.5rem;\n position: absolute;\n transform-origin: left;\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(1) {\n transform: translateX(3.25rem) rotate(45deg);\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(2) {\n transform: translateX(3.25rem) rotate(-75deg);\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(3) {\n transform: translateX(3.25rem) rotate(-10deg);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_lightTheme__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n background: var(--white);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_lightTheme__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n background: var(--white);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_darkTheme__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n background: var(--menu-black);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_darkTheme__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n background: var(--menu-black);\n}";
|
|
14040
|
+
var modules_37a5ff73$a = {"root":"Skeleton_module_root__ecbd3e3d","outer":"Skeleton_module_outer__ecbd3e3d","inner":"Skeleton_module_inner__ecbd3e3d","line":"Skeleton_module_line__ecbd3e3d","light-theme":"Skeleton_module_lightTheme__ecbd3e3d","dark-theme":"Skeleton_module_darkTheme__ecbd3e3d"};
|
|
14041
|
+
n(css$1c,{});
|
|
14041
14042
|
|
|
14042
|
-
var ChartSkeleton$
|
|
14043
|
+
var ChartSkeleton$7 = function ChartSkeleton(_ref) {
|
|
14043
14044
|
var theme = _ref.theme,
|
|
14044
14045
|
fallback = _ref.fallback;
|
|
14045
14046
|
return /*#__PURE__*/jsxs("div", {
|
|
14046
|
-
className: classes(modules_37a5ff73$
|
|
14047
|
+
className: classes(modules_37a5ff73$a.root, modules_37a5ff73$a["".concat(theme, "-theme")]),
|
|
14047
14048
|
children: [/*#__PURE__*/jsx(Skeleton, {
|
|
14048
14049
|
theme: theme,
|
|
14049
|
-
className: modules_37a5ff73$
|
|
14050
|
+
className: modules_37a5ff73$a.outer,
|
|
14050
14051
|
width: "12.5rem",
|
|
14051
14052
|
height: "12.5rem",
|
|
14052
14053
|
variant: "circle",
|
|
14053
14054
|
noAnimation: fallback
|
|
14054
14055
|
}), /*#__PURE__*/jsx(Skeleton, {
|
|
14055
14056
|
noAnimation: true,
|
|
14056
|
-
className: modules_37a5ff73$
|
|
14057
|
+
className: modules_37a5ff73$a.inner,
|
|
14057
14058
|
width: "7.5rem",
|
|
14058
14059
|
height: "7.5rem",
|
|
14059
14060
|
variant: "circle"
|
|
14060
14061
|
}), /*#__PURE__*/jsx(Skeleton, {
|
|
14061
14062
|
noAnimation: true,
|
|
14062
|
-
className: modules_37a5ff73$
|
|
14063
|
+
className: modules_37a5ff73$a.line,
|
|
14063
14064
|
width: "6.25rem"
|
|
14064
14065
|
}), /*#__PURE__*/jsx(Skeleton, {
|
|
14065
14066
|
noAnimation: true,
|
|
14066
|
-
className: modules_37a5ff73$
|
|
14067
|
+
className: modules_37a5ff73$a.line,
|
|
14067
14068
|
width: "6.25rem"
|
|
14068
14069
|
}), /*#__PURE__*/jsx(Skeleton, {
|
|
14069
14070
|
noAnimation: true,
|
|
14070
|
-
className: modules_37a5ff73$
|
|
14071
|
+
className: modules_37a5ff73$a.line,
|
|
14071
14072
|
width: "6.25rem"
|
|
14072
14073
|
})]
|
|
14073
14074
|
});
|
|
@@ -14093,7 +14094,7 @@ var NestedPieChart = function NestedPieChart(props) {
|
|
|
14093
14094
|
theme = props.theme,
|
|
14094
14095
|
fallback = props.fallback;
|
|
14095
14096
|
if (loading || fallback) {
|
|
14096
|
-
return /*#__PURE__*/jsx(ChartSkeleton$
|
|
14097
|
+
return /*#__PURE__*/jsx(ChartSkeleton$7, {
|
|
14097
14098
|
theme: theme,
|
|
14098
14099
|
fallback: !loading && fallback
|
|
14099
14100
|
});
|
|
@@ -14261,9 +14262,9 @@ NestedPieChart.defaultProps = {
|
|
|
14261
14262
|
theme: 'dark'
|
|
14262
14263
|
};
|
|
14263
14264
|
|
|
14264
|
-
var css$
|
|
14265
|
+
var css$1b = ".BasePieChart_module_root__231fde9b {\n width: \"100%\";\n}\n\n.BasePieChart_module_empty__231fde9b {\n gap: 1rem;\n height: 90%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n.BasePieChart_module_empty__231fde9b .BasePieChart_module_text__231fde9b {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n gap: 1rem;\n}\n.BasePieChart_module_empty__231fde9b .BasePieChart_module_text__231fde9b .BasePieChart_module_title__231fde9b {\n font-family: Poppins;\n font-size: 1.75rem;\n font-weight: 600;\n line-height: 1.875rem;\n}\n.BasePieChart_module_empty__231fde9b .BasePieChart_module_text__231fde9b .BasePieChart_module_description__231fde9b {\n font-family: Poppins;\n font-size: 1.25rem;\n font-weight: 400;\n line-height: 1.3125rem;\n}";
|
|
14265
14266
|
var modules_c20882aa$1 = {"root":"BasePieChart_module_root__231fde9b","empty":"BasePieChart_module_empty__231fde9b","text":"BasePieChart_module_text__231fde9b","title":"BasePieChart_module_title__231fde9b","description":"BasePieChart_module_description__231fde9b"};
|
|
14266
|
-
n(css$
|
|
14267
|
+
n(css$1b,{});
|
|
14267
14268
|
|
|
14268
14269
|
echarts.use([TitleComponent, TooltipComponent, GridComponent, DatasetComponent, PieChart, CanvasRenderer, LegendComponent]);
|
|
14269
14270
|
var BasePieChart$1 = function BasePieChart(props) {
|
|
@@ -14460,9 +14461,9 @@ BasePieChart$1.propTypes = {
|
|
|
14460
14461
|
className: propTypesExports.string
|
|
14461
14462
|
};
|
|
14462
14463
|
|
|
14463
|
-
var css$
|
|
14464
|
+
var css$1a = ".BaseRegionChart_module_root__617af265 {\n width: \"100%\";\n}";
|
|
14464
14465
|
var modules_459dfe63 = {"root":"BaseRegionChart_module_root__617af265"};
|
|
14465
|
-
n(css$
|
|
14466
|
+
n(css$1a,{});
|
|
14466
14467
|
|
|
14467
14468
|
echarts.use([TitleComponent, TooltipComponent, GridComponent, DatasetComponent, MapChart, VisualMapComponent, GeoComponent, LegendComponent, CanvasRenderer]);
|
|
14468
14469
|
var BaseRegionChart = function BaseRegionChart(props) {
|
|
@@ -14551,9 +14552,9 @@ BaseRegionChart.defaultProps = {
|
|
|
14551
14552
|
className: ''
|
|
14552
14553
|
};
|
|
14553
14554
|
|
|
14554
|
-
var css$
|
|
14555
|
+
var css$19 = ".StackedPieChart_module_root__6de8b3dd {\n width: \"100%\";\n}\n\n.StackedPieChart_module_empty__6de8b3dd {\n gap: 1rem;\n height: 90%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n.StackedPieChart_module_empty__6de8b3dd .StackedPieChart_module_text__6de8b3dd {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n gap: 1rem;\n}\n.StackedPieChart_module_empty__6de8b3dd .StackedPieChart_module_text__6de8b3dd .StackedPieChart_module_title__6de8b3dd {\n font-family: Poppins;\n font-size: 1.75rem;\n font-weight: 600;\n line-height: 1.875rem;\n}\n.StackedPieChart_module_empty__6de8b3dd .StackedPieChart_module_text__6de8b3dd .StackedPieChart_module_description__6de8b3dd {\n font-family: Poppins;\n font-size: 1.25rem;\n font-weight: 400;\n line-height: 1.3125rem;\n}";
|
|
14555
14556
|
var modules_6ce6a45d = {"root":"StackedPieChart_module_root__6de8b3dd","empty":"StackedPieChart_module_empty__6de8b3dd","text":"StackedPieChart_module_text__6de8b3dd","title":"StackedPieChart_module_title__6de8b3dd","description":"StackedPieChart_module_description__6de8b3dd"};
|
|
14556
|
-
n(css$
|
|
14557
|
+
n(css$19,{});
|
|
14557
14558
|
|
|
14558
14559
|
echarts.use([TitleComponent, TooltipComponent, GridComponent, LegendComponent, PolarComponent, BarChart, CanvasRenderer]);
|
|
14559
14560
|
var determineGradient$1 = function determineGradient(seriesData, objectData, index, subIndex, key) {
|
|
@@ -14780,9 +14781,9 @@ var StackedPieChart = function StackedPieChart(props) {
|
|
|
14780
14781
|
});
|
|
14781
14782
|
};
|
|
14782
14783
|
|
|
14783
|
-
var css$
|
|
14784
|
+
var css$18 = ".BaseVerticalBarChart_module_root__f21e92e0 {\n width: \"100%\";\n}\n\n.BaseVerticalBarChart_module_empty__f21e92e0 {\n gap: 1rem;\n height: 90%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n.BaseVerticalBarChart_module_empty__f21e92e0 .BaseVerticalBarChart_module_text__f21e92e0 {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n gap: 1rem;\n}\n.BaseVerticalBarChart_module_empty__f21e92e0 .BaseVerticalBarChart_module_text__f21e92e0 .BaseVerticalBarChart_module_title__f21e92e0 {\n font-family: Poppins;\n font-size: 1.75rem;\n font-weight: 600;\n line-height: 1.875rem;\n}\n.BaseVerticalBarChart_module_empty__f21e92e0 .BaseVerticalBarChart_module_text__f21e92e0 .BaseVerticalBarChart_module_description__f21e92e0 {\n font-family: Poppins;\n font-size: 1.25rem;\n font-weight: 400;\n line-height: 1.3125rem;\n}";
|
|
14784
14785
|
var modules_8757388c = {"root":"BaseVerticalBarChart_module_root__f21e92e0","empty":"BaseVerticalBarChart_module_empty__f21e92e0","text":"BaseVerticalBarChart_module_text__f21e92e0","title":"BaseVerticalBarChart_module_title__f21e92e0","description":"BaseVerticalBarChart_module_description__f21e92e0"};
|
|
14785
|
-
n(css$
|
|
14786
|
+
n(css$18,{});
|
|
14786
14787
|
|
|
14787
14788
|
echarts.use([TitleComponent, DataZoomComponent, DataZoomInsideComponent, DataZoomSliderComponent, TooltipComponent, GridComponent, DatasetComponent, LegendComponent, BarChart, CanvasRenderer]);
|
|
14788
14789
|
var AXIS_COLORS = {
|
|
@@ -15136,518 +15137,660 @@ BaseVerticalBarChart.defaultProps = {
|
|
|
15136
15137
|
theme: 'dark'
|
|
15137
15138
|
};
|
|
15138
15139
|
|
|
15139
|
-
var css$
|
|
15140
|
-
var
|
|
15141
|
-
n(css$
|
|
15142
|
-
|
|
15143
|
-
var css$14 = ".Skeleton_module_root__ecbd3e3d {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n overflow: hidden;\n position: relative;\n}\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_outer__ecbd3e3d,\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n max-width: 100%;\n max-height: 100%;\n}\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n position: absolute;\n opacity: 1;\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n opacity: 1;\n height: 0.5rem;\n position: absolute;\n transform-origin: left;\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(1) {\n transform: translateX(3.25rem) rotate(45deg);\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(2) {\n transform: translateX(3.25rem) rotate(-75deg);\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(3) {\n transform: translateX(3.25rem) rotate(-10deg);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_lightTheme__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n background: var(--white);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_lightTheme__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n background: var(--white);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_darkTheme__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n background: var(--menu-black);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_darkTheme__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n background: var(--menu-black);\n}";
|
|
15144
|
-
var modules_37a5ff73$7 = {"root":"Skeleton_module_root__ecbd3e3d","outer":"Skeleton_module_outer__ecbd3e3d","inner":"Skeleton_module_inner__ecbd3e3d","line":"Skeleton_module_line__ecbd3e3d","light-theme":"Skeleton_module_lightTheme__ecbd3e3d","dark-theme":"Skeleton_module_darkTheme__ecbd3e3d"};
|
|
15145
|
-
n(css$14,{});
|
|
15140
|
+
var css$17 = ".Skeleton_module_root__cca72340 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-end;\n gap: 1rem;\n height: 100%;\n width: 100%;\n padding: 2rem;\n}";
|
|
15141
|
+
var modules_37a5ff73$9 = {"root":"Skeleton_module_root__cca72340"};
|
|
15142
|
+
n(css$17,{});
|
|
15146
15143
|
|
|
15147
|
-
var
|
|
15144
|
+
var BARS$1 = _toConsumableArray(Array(10).keys()).map(function () {
|
|
15145
|
+
return Math.random() * 80 + 20;
|
|
15146
|
+
});
|
|
15147
|
+
var ChartSkeleton$6 = function ChartSkeleton(_ref) {
|
|
15148
15148
|
var theme = _ref.theme,
|
|
15149
15149
|
fallback = _ref.fallback;
|
|
15150
|
-
return /*#__PURE__*/
|
|
15151
|
-
className:
|
|
15152
|
-
children:
|
|
15153
|
-
|
|
15154
|
-
|
|
15155
|
-
|
|
15156
|
-
|
|
15157
|
-
|
|
15158
|
-
|
|
15159
|
-
|
|
15160
|
-
|
|
15161
|
-
|
|
15162
|
-
|
|
15163
|
-
|
|
15164
|
-
variant: "circle"
|
|
15165
|
-
}), /*#__PURE__*/jsx(Skeleton, {
|
|
15166
|
-
noAnimation: true,
|
|
15167
|
-
className: modules_37a5ff73$7.line,
|
|
15168
|
-
width: "6.25rem"
|
|
15169
|
-
}), /*#__PURE__*/jsx(Skeleton, {
|
|
15170
|
-
noAnimation: true,
|
|
15171
|
-
className: modules_37a5ff73$7.line,
|
|
15172
|
-
width: "6.25rem"
|
|
15173
|
-
}), /*#__PURE__*/jsx(Skeleton, {
|
|
15174
|
-
noAnimation: true,
|
|
15175
|
-
className: modules_37a5ff73$7.line,
|
|
15176
|
-
width: "6.25rem"
|
|
15177
|
-
})]
|
|
15150
|
+
return /*#__PURE__*/jsx("div", {
|
|
15151
|
+
className: modules_37a5ff73$9.root,
|
|
15152
|
+
children: BARS$1.map(function (bar) {
|
|
15153
|
+
return /*#__PURE__*/jsx(Skeleton, {
|
|
15154
|
+
theme: theme,
|
|
15155
|
+
width: "3rem",
|
|
15156
|
+
height: "".concat(bar, "%"),
|
|
15157
|
+
variant: "rounded",
|
|
15158
|
+
style: {
|
|
15159
|
+
animationDuration: '4s'
|
|
15160
|
+
},
|
|
15161
|
+
noAnimation: fallback
|
|
15162
|
+
}, bar);
|
|
15163
|
+
})
|
|
15178
15164
|
});
|
|
15179
15165
|
};
|
|
15180
15166
|
|
|
15181
|
-
Chart.register(
|
|
15182
|
-
var
|
|
15183
|
-
var
|
|
15184
|
-
var loading =
|
|
15185
|
-
|
|
15186
|
-
|
|
15187
|
-
|
|
15188
|
-
|
|
15189
|
-
|
|
15190
|
-
|
|
15191
|
-
|
|
15192
|
-
|
|
15193
|
-
|
|
15194
|
-
|
|
15195
|
-
|
|
15196
|
-
|
|
15197
|
-
|
|
15198
|
-
|
|
15199
|
-
|
|
15200
|
-
|
|
15201
|
-
|
|
15202
|
-
|
|
15203
|
-
|
|
15204
|
-
|
|
15205
|
-
|
|
15206
|
-
|
|
15207
|
-
|
|
15208
|
-
|
|
15209
|
-
|
|
15210
|
-
|
|
15211
|
-
|
|
15212
|
-
|
|
15213
|
-
|
|
15214
|
-
setHoveredIndex = _useState4[1]; // Track the hovered legend index
|
|
15215
|
-
var legendRef = useRef(null); // Reference to hold the custom legend
|
|
15216
|
-
|
|
15217
|
-
if (loading || fallback) {
|
|
15218
|
-
return /*#__PURE__*/jsx(ChartSkeleton$4, {
|
|
15219
|
-
theme: theme,
|
|
15220
|
-
fallback: !loading && fallback
|
|
15167
|
+
Chart.register(BarElement, CategoryScale, LinearScale, Tooltip$1, Legend, ChartDataLabels);
|
|
15168
|
+
var BaseBarChart = function BaseBarChart(_ref) {
|
|
15169
|
+
var _title$textStyle, _tooltip$borderWidth, _tooltip$bodySpacing, _tooltip$displayColor, _tooltip$colorBoxWidt, _tooltip$colorBoxHeig, _tooltip$usePointStyl, _tooltip$bodyFont$tit, _tooltip$bodyFont, _tooltip$bodyFont$col, _tooltip$bodyFont2;
|
|
15170
|
+
var loading = _ref.loading,
|
|
15171
|
+
seriesData = _ref.seriesData,
|
|
15172
|
+
title = _ref.title,
|
|
15173
|
+
gridOptions = _ref.gridOptions,
|
|
15174
|
+
_ref$width = _ref.width,
|
|
15175
|
+
width = _ref$width === void 0 ? '100%' : _ref$width,
|
|
15176
|
+
_ref$height = _ref.height,
|
|
15177
|
+
height = _ref$height === void 0 ? '100%' : _ref$height,
|
|
15178
|
+
_ref$barThickness = _ref.barThickness,
|
|
15179
|
+
barThickness = _ref$barThickness === void 0 ? 50 : _ref$barThickness,
|
|
15180
|
+
_ref$borderRadius = _ref.borderRadius,
|
|
15181
|
+
borderRadius = _ref$borderRadius === void 0 ? 5 : _ref$borderRadius,
|
|
15182
|
+
barColor1 = _ref.barColor1,
|
|
15183
|
+
barColor2 = _ref.barColor2,
|
|
15184
|
+
xAxisTitle = _ref.xAxisTitle,
|
|
15185
|
+
yAxisTitle = _ref.yAxisTitle,
|
|
15186
|
+
tooltip = _ref.tooltip,
|
|
15187
|
+
legends = _ref.legends,
|
|
15188
|
+
chartOptions = _ref.chartOptions,
|
|
15189
|
+
chartDatasets = _ref.chartDatasets,
|
|
15190
|
+
xAxis = _ref.xAxis,
|
|
15191
|
+
yAxis = _ref.yAxis,
|
|
15192
|
+
styles = _ref.styles,
|
|
15193
|
+
_ref$vertical = _ref.vertical,
|
|
15194
|
+
vertical = _ref$vertical === void 0 ? true : _ref$vertical,
|
|
15195
|
+
stacked = _ref.stacked,
|
|
15196
|
+
extra = _ref.extra;
|
|
15197
|
+
if (loading) {
|
|
15198
|
+
return /*#__PURE__*/jsx(ChartSkeleton$6, {
|
|
15199
|
+
vertical: vertical
|
|
15221
15200
|
});
|
|
15222
15201
|
}
|
|
15223
15202
|
|
|
15224
|
-
//
|
|
15225
|
-
var
|
|
15226
|
-
|
|
15227
|
-
|
|
15228
|
-
|
|
15229
|
-
|
|
15230
|
-
newIndices.splice(newIndices.indexOf(index), 1); // Un-exclude
|
|
15231
|
-
} else {
|
|
15232
|
-
newIndices.push(index); // Exclude
|
|
15233
|
-
}
|
|
15234
|
-
return newIndices;
|
|
15203
|
+
// Mapping the data for Chart.js
|
|
15204
|
+
var labels = Object.keys(seriesData.chartData);
|
|
15205
|
+
var allKeys = new Set();
|
|
15206
|
+
Object.values(seriesData.chartData).forEach(function (data) {
|
|
15207
|
+
Object.keys(data).forEach(function (key) {
|
|
15208
|
+
allKeys.add(key);
|
|
15235
15209
|
});
|
|
15236
|
-
}
|
|
15237
|
-
|
|
15238
|
-
|
|
15239
|
-
|
|
15240
|
-
|
|
15241
|
-
|
|
15242
|
-
|
|
15243
|
-
datasets: [{
|
|
15244
|
-
data: Object.keys((_seriesData$chartData = seriesData === null || seriesData === void 0 ? void 0 : seriesData.chartData) !== null && _seriesData$chartData !== void 0 ? _seriesData$chartData : {}).map(function (key) {
|
|
15245
|
-
var _seriesData$chartData2;
|
|
15246
|
-
return seriesData === null || seriesData === void 0 || (_seriesData$chartData2 = seriesData.chartData) === null || _seriesData$chartData2 === void 0 ? void 0 : _seriesData$chartData2[key];
|
|
15210
|
+
});
|
|
15211
|
+
var barDatasets = Array.from(allKeys).map(function (key) {
|
|
15212
|
+
return _objectSpread2({
|
|
15213
|
+
label: key,
|
|
15214
|
+
backgroundColor: key === 'x1' ? barColor1 !== null && barColor1 !== void 0 ? barColor1 : COLORS.success : key === 'x2' ? barColor2 !== null && barColor2 !== void 0 ? barColor2 : COLORS.error : COLORS.warning,
|
|
15215
|
+
data: labels.map(function (label) {
|
|
15216
|
+
return seriesData.chartData[label][key] !== undefined ? seriesData.chartData[label][key] : null;
|
|
15247
15217
|
}),
|
|
15248
|
-
|
|
15249
|
-
|
|
15250
|
-
|
|
15251
|
-
|
|
15252
|
-
|
|
15253
|
-
|
|
15254
|
-
|
|
15255
|
-
|
|
15256
|
-
|
|
15257
|
-
|
|
15218
|
+
borderRadius: borderRadius,
|
|
15219
|
+
barThickness: barThickness
|
|
15220
|
+
}, chartDatasets);
|
|
15221
|
+
});
|
|
15222
|
+
var datasets = stacked ? [].concat(_toConsumableArray(barDatasets), [stacked]) : _toConsumableArray(barDatasets);
|
|
15223
|
+
var options = {
|
|
15224
|
+
responsive: true,
|
|
15225
|
+
maintainAspectRatio: false,
|
|
15226
|
+
// To allow custom height and width
|
|
15227
|
+
indexAxis: !vertical && 'y',
|
|
15228
|
+
plugins: _objectSpread2({
|
|
15229
|
+
title: {
|
|
15230
|
+
display: true,
|
|
15231
|
+
font: {
|
|
15232
|
+
size: (title === null || title === void 0 || (_title$textStyle = title.textStyle) === null || _title$textStyle === void 0 ? void 0 : _title$textStyle.fontSize) || 12,
|
|
15233
|
+
family: 'Poppins'
|
|
15234
|
+
},
|
|
15235
|
+
align: 'start',
|
|
15236
|
+
padding: {
|
|
15237
|
+
left: (title === null || title === void 0 ? void 0 : title.left) || 0
|
|
15258
15238
|
}
|
|
15259
|
-
return excludedIndices.includes(index) ? '#D3D3D3' // Grey for excluded items
|
|
15260
|
-
: defaultColors[index % defaultColors.length]; // Normal color for other slices
|
|
15261
|
-
}),
|
|
15262
|
-
borderColor: seriesOption ? seriesOption.map(function (option, index) {
|
|
15263
|
-
return excludedIndices.includes(index) ? '#D3D3D3' // Grey for excluded items
|
|
15264
|
-
: option.itemStyle.color; // Normal color for other borders
|
|
15265
|
-
}) : Object.keys((_seriesData$chartData4 = seriesData === null || seriesData === void 0 ? void 0 : seriesData.chartData) !== null && _seriesData$chartData4 !== void 0 ? _seriesData$chartData4 : {}).map(function (_, index) {
|
|
15266
|
-
var defaultColors = ['#FF6384', '#36A2EB', '#FFCE56', '#4BC0C0', '#9966FF', '#FF9F40'];
|
|
15267
|
-
return excludedIndices.includes(index) ? '#D3D3D3' // Grey for excluded items
|
|
15268
|
-
: defaultColors[index % defaultColors.length]; // Normal color for other borders
|
|
15269
|
-
}),
|
|
15270
|
-
hoverBorderWidth: hoverBorderWidth,
|
|
15271
|
-
hoverOffset: function hoverOffset(context) {
|
|
15272
|
-
var index = context.dataIndex;
|
|
15273
|
-
// Set hoverOffset to 30 for the hovered pie slice, whether from the legend or chart hover
|
|
15274
|
-
return hoveredIndex === index ? 30 : 0;
|
|
15275
15239
|
},
|
|
15276
|
-
|
|
15277
|
-
|
|
15278
|
-
|
|
15279
|
-
|
|
15280
|
-
|
|
15281
|
-
|
|
15282
|
-
|
|
15283
|
-
|
|
15284
|
-
|
|
15285
|
-
|
|
15286
|
-
|
|
15287
|
-
|
|
15288
|
-
|
|
15289
|
-
|
|
15290
|
-
|
|
15240
|
+
tooltip: _objectSpread2({
|
|
15241
|
+
borderWidth: (_tooltip$borderWidth = tooltip === null || tooltip === void 0 ? void 0 : tooltip.borderWidth) !== null && _tooltip$borderWidth !== void 0 ? _tooltip$borderWidth : 1,
|
|
15242
|
+
backgroundColor: 'rgba(255, 255, 255, 1)',
|
|
15243
|
+
bodySpacing: (_tooltip$bodySpacing = tooltip === null || tooltip === void 0 ? void 0 : tooltip.bodySpacing) !== null && _tooltip$bodySpacing !== void 0 ? _tooltip$bodySpacing : 5,
|
|
15244
|
+
displayColors: (_tooltip$displayColor = tooltip === null || tooltip === void 0 ? void 0 : tooltip.displayColors) !== null && _tooltip$displayColor !== void 0 ? _tooltip$displayColor : true,
|
|
15245
|
+
boxWidth: (_tooltip$colorBoxWidt = tooltip === null || tooltip === void 0 ? void 0 : tooltip.colorBoxWidth) !== null && _tooltip$colorBoxWidt !== void 0 ? _tooltip$colorBoxWidt : 5,
|
|
15246
|
+
boxHeight: (_tooltip$colorBoxHeig = tooltip === null || tooltip === void 0 ? void 0 : tooltip.colorBoxHeight) !== null && _tooltip$colorBoxHeig !== void 0 ? _tooltip$colorBoxHeig : 5,
|
|
15247
|
+
boxPadding: 5,
|
|
15248
|
+
usePointStyle: (_tooltip$usePointStyl = tooltip === null || tooltip === void 0 ? void 0 : tooltip.usePointStyle) !== null && _tooltip$usePointStyl !== void 0 ? _tooltip$usePointStyl : true,
|
|
15249
|
+
titleColor: (_tooltip$bodyFont$tit = tooltip === null || tooltip === void 0 || (_tooltip$bodyFont = tooltip.bodyFont) === null || _tooltip$bodyFont === void 0 ? void 0 : _tooltip$bodyFont.titleColor) !== null && _tooltip$bodyFont$tit !== void 0 ? _tooltip$bodyFont$tit : '#000',
|
|
15250
|
+
bodyColor: (_tooltip$bodyFont$col = tooltip === null || tooltip === void 0 || (_tooltip$bodyFont2 = tooltip.bodyFont) === null || _tooltip$bodyFont2 === void 0 ? void 0 : _tooltip$bodyFont2.color) !== null && _tooltip$bodyFont$col !== void 0 ? _tooltip$bodyFont$col : '#000',
|
|
15251
|
+
bodyFont: _objectSpread2(_objectSpread2({}, tooltip.bodyFont), {}, {
|
|
15252
|
+
family: 'Poppins'
|
|
15253
|
+
})
|
|
15254
|
+
}, tooltip),
|
|
15255
|
+
legend: _objectSpread2({
|
|
15291
15256
|
display: false
|
|
15292
|
-
}
|
|
15293
|
-
|
|
15294
|
-
|
|
15295
|
-
|
|
15296
|
-
|
|
15297
|
-
|
|
15298
|
-
|
|
15299
|
-
|
|
15300
|
-
//
|
|
15301
|
-
|
|
15302
|
-
|
|
15303
|
-
|
|
15257
|
+
}, legends),
|
|
15258
|
+
// Enable the datalabels plugin
|
|
15259
|
+
datalabels: {
|
|
15260
|
+
anchor: 'end',
|
|
15261
|
+
align: 'top',
|
|
15262
|
+
// Align the labels above the bars
|
|
15263
|
+
color: 'black',
|
|
15264
|
+
font: {
|
|
15265
|
+
// weight: 'bold',
|
|
15266
|
+
size: 12,
|
|
15267
|
+
family: 'Poppins'
|
|
15268
|
+
},
|
|
15269
|
+
offset: 4,
|
|
15270
|
+
// Space between the bar and the label
|
|
15271
|
+
formatter: function formatter(value, context) {
|
|
15272
|
+
return context.chart.data.labels[context.dataIndex];
|
|
15273
|
+
}
|
|
15274
|
+
}
|
|
15275
|
+
}, chartOptions),
|
|
15276
|
+
scales: {
|
|
15277
|
+
x: _objectSpread2({
|
|
15278
|
+
grid: {
|
|
15279
|
+
display: (gridOptions === null || gridOptions === void 0 ? void 0 : gridOptions.gridContainLabel) || true,
|
|
15280
|
+
color: 'rgba(255, 255, 255, 0.2)'
|
|
15281
|
+
},
|
|
15282
|
+
ticks: {
|
|
15283
|
+
color: 'black',
|
|
15284
|
+
callback: function callback(value, index) {
|
|
15285
|
+
var _seriesData$chartData;
|
|
15286
|
+
return (_seriesData$chartData = seriesData.chartData[labels[index]]) === null || _seriesData$chartData === void 0 ? void 0 : _seriesData$chartData.x1;
|
|
15304
15287
|
},
|
|
15305
15288
|
font: {
|
|
15306
15289
|
family: 'Poppins'
|
|
15307
15290
|
}
|
|
15308
15291
|
},
|
|
15309
|
-
|
|
15310
|
-
|
|
15311
|
-
|
|
15292
|
+
title: {
|
|
15293
|
+
display: true,
|
|
15294
|
+
text: xAxisTitle,
|
|
15295
|
+
color: 'black',
|
|
15296
|
+
font: {
|
|
15297
|
+
family: 'Poppins'
|
|
15298
|
+
}
|
|
15299
|
+
}
|
|
15300
|
+
}, xAxis),
|
|
15301
|
+
y: _objectSpread2({
|
|
15302
|
+
grid: {
|
|
15303
|
+
display: true,
|
|
15304
|
+
color: 'rgba(255, 255, 255, 0.2)'
|
|
15312
15305
|
},
|
|
15313
|
-
|
|
15314
|
-
|
|
15306
|
+
ticks: {
|
|
15307
|
+
color: 'black',
|
|
15308
|
+
beginAtZero: true,
|
|
15309
|
+
font: {
|
|
15310
|
+
family: 'Poppins'
|
|
15311
|
+
}
|
|
15315
15312
|
},
|
|
15316
|
-
|
|
15317
|
-
|
|
15313
|
+
title: {
|
|
15314
|
+
display: true,
|
|
15315
|
+
text: yAxisTitle,
|
|
15316
|
+
color: 'black',
|
|
15317
|
+
font: {
|
|
15318
|
+
family: 'Poppins'
|
|
15319
|
+
}
|
|
15318
15320
|
}
|
|
15319
|
-
},
|
|
15320
|
-
|
|
15321
|
-
|
|
15322
|
-
|
|
15323
|
-
|
|
15324
|
-
|
|
15325
|
-
|
|
15321
|
+
}, yAxis)
|
|
15322
|
+
}
|
|
15323
|
+
};
|
|
15324
|
+
return /*#__PURE__*/jsx("div", {
|
|
15325
|
+
style: _objectSpread2({
|
|
15326
|
+
width: width || '100%',
|
|
15327
|
+
// Default to full width if not provided
|
|
15328
|
+
height: height || '100%'
|
|
15329
|
+
}, styles),
|
|
15330
|
+
children: /*#__PURE__*/jsx(Bar, _objectSpread2({
|
|
15331
|
+
data: {
|
|
15332
|
+
labels: labels,
|
|
15333
|
+
datasets: datasets
|
|
15334
|
+
},
|
|
15335
|
+
options: options
|
|
15336
|
+
}, extra))
|
|
15337
|
+
});
|
|
15338
|
+
};
|
|
15339
|
+
|
|
15340
|
+
var css$16 = ".Skeleton_module_root__35678706 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: 1rem;\n height: 100%;\n width: 100%;\n padding: 3rem;\n}";
|
|
15341
|
+
var modules_37a5ff73$8 = {"root":"Skeleton_module_root__35678706"};
|
|
15342
|
+
n(css$16,{});
|
|
15343
|
+
|
|
15344
|
+
var BARS = _toConsumableArray(Array(10).keys()).map(function () {
|
|
15345
|
+
return Math.random() * 80 + 20;
|
|
15346
|
+
});
|
|
15347
|
+
var ChartSkeleton$5 = function ChartSkeleton(_ref) {
|
|
15348
|
+
var theme = _ref.theme,
|
|
15349
|
+
fallback = _ref.fallback;
|
|
15350
|
+
return /*#__PURE__*/jsx("div", {
|
|
15351
|
+
className: modules_37a5ff73$8.root,
|
|
15352
|
+
children: BARS.map(function (bar) {
|
|
15353
|
+
return /*#__PURE__*/jsx(Skeleton, {
|
|
15354
|
+
theme: theme,
|
|
15355
|
+
width: "3rem",
|
|
15356
|
+
height: "".concat(bar, "%"),
|
|
15357
|
+
variant: "ellipse",
|
|
15358
|
+
style: {
|
|
15359
|
+
animationDuration: '4s'
|
|
15326
15360
|
},
|
|
15327
|
-
|
|
15328
|
-
|
|
15329
|
-
|
|
15361
|
+
noAnimation: fallback
|
|
15362
|
+
}, bar);
|
|
15363
|
+
})
|
|
15364
|
+
});
|
|
15365
|
+
};
|
|
15366
|
+
|
|
15367
|
+
Chart.register(Title$1, Tooltip$1, Legend, BarElement, CategoryScale, LinearScale, annotationPlugin, ChartDataLabels);
|
|
15368
|
+
var CapsuleChart = function CapsuleChart(props) {
|
|
15369
|
+
var _seriesData$metaData, _seriesData$metaData2, _tooltip$bodySpacing, _tooltip$displayColor, _tooltip$colorBoxWidt, _tooltip$colorBoxHeig, _tooltip$usePointStyl, _tooltip$bodyFont$tit, _tooltip$bodyFont, _tooltip$bodyFont$col, _tooltip$bodyFont2, _tooltip$borderWidth;
|
|
15370
|
+
var _props$loading = props.loading,
|
|
15371
|
+
loading = _props$loading === void 0 ? false : _props$loading,
|
|
15372
|
+
fallback = props.fallback,
|
|
15373
|
+
_props$seriesData = props.seriesData,
|
|
15374
|
+
seriesData = _props$seriesData === void 0 ? {} : _props$seriesData,
|
|
15375
|
+
_props$showLegends = props.showLegends,
|
|
15376
|
+
showLegends = _props$showLegends === void 0 ? false : _props$showLegends,
|
|
15377
|
+
tooltip = props.tooltip,
|
|
15378
|
+
dataSetsOptions = props.dataSetsOptions,
|
|
15379
|
+
chartOptions = props.chartOptions,
|
|
15380
|
+
xAxis = props.xAxis,
|
|
15381
|
+
yAxis = props.yAxis,
|
|
15382
|
+
extra = props.extra,
|
|
15383
|
+
styles = props.styles;
|
|
15384
|
+
if (loading || fallback) {
|
|
15385
|
+
return /*#__PURE__*/jsx(ChartSkeleton$5, {
|
|
15386
|
+
theme: "dark",
|
|
15387
|
+
fallback: !loading && fallback
|
|
15388
|
+
});
|
|
15389
|
+
}
|
|
15390
|
+
|
|
15391
|
+
// Prepare labels and data
|
|
15392
|
+
var labels = Object.keys(seriesData.chartData);
|
|
15393
|
+
var dataX1 = labels.map(function (label) {
|
|
15394
|
+
var _seriesData$chartData;
|
|
15395
|
+
return ((_seriesData$chartData = seriesData.chartData[label]) === null || _seriesData$chartData === void 0 ? void 0 : _seriesData$chartData.x1) || 0;
|
|
15396
|
+
});
|
|
15397
|
+
var dataX2 = labels.map(function (label) {
|
|
15398
|
+
var _seriesData$chartData2;
|
|
15399
|
+
return ((_seriesData$chartData2 = seriesData.chartData[label]) === null || _seriesData$chartData2 === void 0 ? void 0 : _seriesData$chartData2.x2) || 0;
|
|
15400
|
+
});
|
|
15401
|
+
|
|
15402
|
+
// Chart data structure
|
|
15403
|
+
var _useState = useState([true, true]),
|
|
15404
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
15405
|
+
activeDatasets = _useState2[0],
|
|
15406
|
+
setActiveDatasets = _useState2[1]; // Track active datasets
|
|
15407
|
+
|
|
15408
|
+
var data = _objectSpread2({
|
|
15409
|
+
labels: labels,
|
|
15410
|
+
datasets: [{
|
|
15411
|
+
label: seriesData === null || seriesData === void 0 || (_seriesData$metaData = seriesData.metaData) === null || _seriesData$metaData === void 0 || (_seriesData$metaData = _seriesData$metaData.keyData) === null || _seriesData$metaData === void 0 ? void 0 : _seriesData$metaData.x1,
|
|
15412
|
+
data: dataX1,
|
|
15413
|
+
backgroundColor: activeDatasets[0] ? 'green' : 'grey',
|
|
15414
|
+
// Change to grey if not active
|
|
15415
|
+
stack: 'Stack 0',
|
|
15416
|
+
borderRadius: 18,
|
|
15417
|
+
barThickness: 30
|
|
15418
|
+
}, {
|
|
15419
|
+
label: seriesData === null || seriesData === void 0 || (_seriesData$metaData2 = seriesData.metaData) === null || _seriesData$metaData2 === void 0 || (_seriesData$metaData2 = _seriesData$metaData2.keyData) === null || _seriesData$metaData2 === void 0 ? void 0 : _seriesData$metaData2.x2,
|
|
15420
|
+
data: dataX2.map(function (value) {
|
|
15421
|
+
return -value;
|
|
15422
|
+
}),
|
|
15423
|
+
// Negate values to stack downwards
|
|
15424
|
+
backgroundColor: activeDatasets[1] ? 'red' : 'grey',
|
|
15425
|
+
// Change to grey if not active
|
|
15426
|
+
stack: 'Stack 0',
|
|
15427
|
+
borderRadius: 18,
|
|
15428
|
+
barThickness: 30
|
|
15429
|
+
}]
|
|
15430
|
+
}, dataSetsOptions);
|
|
15431
|
+
|
|
15432
|
+
// Chart options configuration
|
|
15433
|
+
var options = _objectSpread2({
|
|
15434
|
+
indexAxis: 'x',
|
|
15435
|
+
plugins: {
|
|
15436
|
+
legend: {
|
|
15437
|
+
display: showLegends,
|
|
15438
|
+
// Conditionally display legends based on showLegends prop
|
|
15439
|
+
position: 'top',
|
|
15440
|
+
labels: {
|
|
15441
|
+
color: '#000',
|
|
15442
|
+
font: {
|
|
15443
|
+
family: 'Poppins'
|
|
15444
|
+
}
|
|
15445
|
+
},
|
|
15446
|
+
onClick: function onClick(e, legendItem) {
|
|
15447
|
+
var index = legendItem.datasetIndex;
|
|
15448
|
+
var newActiveDatasets = _toConsumableArray(activeDatasets);
|
|
15449
|
+
newActiveDatasets[index] = !newActiveDatasets[index]; // Toggle active state
|
|
15450
|
+
|
|
15451
|
+
setActiveDatasets(newActiveDatasets); // Update state to trigger re-render
|
|
15330
15452
|
}
|
|
15331
15453
|
},
|
|
15332
15454
|
tooltip: _objectSpread2({
|
|
15455
|
+
backgroundColor: 'rgba(255, 255, 255, 1)',
|
|
15456
|
+
bodySpacing: (_tooltip$bodySpacing = tooltip === null || tooltip === void 0 ? void 0 : tooltip.bodySpacing) !== null && _tooltip$bodySpacing !== void 0 ? _tooltip$bodySpacing : 5,
|
|
15457
|
+
displayColors: (_tooltip$displayColor = tooltip === null || tooltip === void 0 ? void 0 : tooltip.displayColors) !== null && _tooltip$displayColor !== void 0 ? _tooltip$displayColor : true,
|
|
15458
|
+
boxWidth: (_tooltip$colorBoxWidt = tooltip === null || tooltip === void 0 ? void 0 : tooltip.colorBoxWidth) !== null && _tooltip$colorBoxWidt !== void 0 ? _tooltip$colorBoxWidt : 5,
|
|
15459
|
+
boxHeight: (_tooltip$colorBoxHeig = tooltip === null || tooltip === void 0 ? void 0 : tooltip.colorBoxHeight) !== null && _tooltip$colorBoxHeig !== void 0 ? _tooltip$colorBoxHeig : 5,
|
|
15460
|
+
boxPadding: 5,
|
|
15461
|
+
usePointStyle: (_tooltip$usePointStyl = tooltip === null || tooltip === void 0 ? void 0 : tooltip.usePointStyle) !== null && _tooltip$usePointStyl !== void 0 ? _tooltip$usePointStyl : true,
|
|
15462
|
+
titleColor: (_tooltip$bodyFont$tit = tooltip === null || tooltip === void 0 || (_tooltip$bodyFont = tooltip.bodyFont) === null || _tooltip$bodyFont === void 0 ? void 0 : _tooltip$bodyFont.titleColor) !== null && _tooltip$bodyFont$tit !== void 0 ? _tooltip$bodyFont$tit : '#000',
|
|
15463
|
+
bodyColor: (_tooltip$bodyFont$col = tooltip === null || tooltip === void 0 || (_tooltip$bodyFont2 = tooltip.bodyFont) === null || _tooltip$bodyFont2 === void 0 ? void 0 : _tooltip$bodyFont2.color) !== null && _tooltip$bodyFont$col !== void 0 ? _tooltip$bodyFont$col : '#000',
|
|
15464
|
+
bodyFont: _objectSpread2({}, tooltip.bodyFont),
|
|
15333
15465
|
borderWidth: (_tooltip$borderWidth = tooltip === null || tooltip === void 0 ? void 0 : tooltip.borderWidth) !== null && _tooltip$borderWidth !== void 0 ? _tooltip$borderWidth : 1,
|
|
15334
15466
|
borderColor: function borderColor(context) {
|
|
15335
|
-
var _context$tooltipItems
|
|
15336
|
-
var
|
|
15337
|
-
var segmentColor = context === null || context === void 0 || (_context$tooltipItems2 = context.tooltipItems[0]) === null || _context$tooltipItems2 === void 0 || (_context$tooltipItems2 = _context$tooltipItems2.dataset) === null || _context$tooltipItems2 === void 0 ? void 0 : _context$tooltipItems2.borderColor[index];
|
|
15467
|
+
var _context$tooltipItems;
|
|
15468
|
+
var segmentColor = context === null || context === void 0 || (_context$tooltipItems = context.tooltipItems[0]) === null || _context$tooltipItems === void 0 || (_context$tooltipItems = _context$tooltipItems.dataset) === null || _context$tooltipItems === void 0 ? void 0 : _context$tooltipItems.backgroundColor;
|
|
15338
15469
|
return segmentColor || 'black';
|
|
15339
15470
|
},
|
|
15340
|
-
|
|
15341
|
-
callbacks: (_tooltip$callbacks = tooltip === null || tooltip === void 0 ? void 0 : tooltip.callbacks) !== null && _tooltip$callbacks !== void 0 ? _tooltip$callbacks : {
|
|
15342
|
-
label: function label(context) {
|
|
15343
|
-
var label = context.label || '';
|
|
15344
|
-
var value = context.raw;
|
|
15345
|
-
return "".concat(label, ": ").concat(value);
|
|
15346
|
-
},
|
|
15471
|
+
callbacks: {
|
|
15347
15472
|
title: tooltip.displayTitle ? function (tooltipItems) {
|
|
15348
15473
|
var _tooltipItems$;
|
|
15349
15474
|
return ((_tooltipItems$ = tooltipItems[0]) === null || _tooltipItems$ === void 0 ? void 0 : _tooltipItems$.label) || '';
|
|
15350
15475
|
} : function () {
|
|
15351
15476
|
return '';
|
|
15477
|
+
},
|
|
15478
|
+
label: function label(tooltipItem) {
|
|
15479
|
+
var datasetLabel = tooltipItem.dataset.label || '';
|
|
15480
|
+
var value = tooltipItem.raw;
|
|
15481
|
+
return "".concat(datasetLabel, ": ").concat(value >= 0 ? value : -value);
|
|
15352
15482
|
}
|
|
15483
|
+
}
|
|
15484
|
+
}, tooltip),
|
|
15485
|
+
annotation: {
|
|
15486
|
+
annotations: {
|
|
15487
|
+
horizontalLine: {
|
|
15488
|
+
type: 'line',
|
|
15489
|
+
yMin: 0,
|
|
15490
|
+
yMax: 0,
|
|
15491
|
+
borderColor: '#d5d5db',
|
|
15492
|
+
borderWidth: 1
|
|
15493
|
+
}
|
|
15494
|
+
}
|
|
15495
|
+
},
|
|
15496
|
+
datalabels: {
|
|
15497
|
+
color: 'black',
|
|
15498
|
+
font: {
|
|
15499
|
+
size: 14,
|
|
15500
|
+
family: 'Poppins'
|
|
15353
15501
|
},
|
|
15354
|
-
|
|
15355
|
-
|
|
15356
|
-
|
|
15357
|
-
|
|
15358
|
-
|
|
15359
|
-
|
|
15360
|
-
|
|
15361
|
-
|
|
15362
|
-
|
|
15363
|
-
|
|
15502
|
+
formatter: function formatter(value, context) {
|
|
15503
|
+
if (context.datasetIndex === 0) {
|
|
15504
|
+
return "".concat(value, "%"); // Show the value for x1 with a percentage
|
|
15505
|
+
}
|
|
15506
|
+
if (context.datasetIndex === 1) {
|
|
15507
|
+
return context.chart.data.labels[context.dataIndex]; // Display the database name
|
|
15508
|
+
}
|
|
15509
|
+
return ''; // Don't show for other cases
|
|
15510
|
+
},
|
|
15511
|
+
anchor: function anchor(context) {
|
|
15512
|
+
return context.datasetIndex === 0 ? 'end' : 'start';
|
|
15513
|
+
},
|
|
15514
|
+
align: function align(context) {
|
|
15515
|
+
return context.datasetIndex === 0 ? 'end' : 'start';
|
|
15516
|
+
},
|
|
15517
|
+
offset: 5,
|
|
15518
|
+
padding: 5,
|
|
15519
|
+
shadowColor: 'black',
|
|
15520
|
+
shadowBlur: 18,
|
|
15521
|
+
shadowOffsetX: 4,
|
|
15522
|
+
shadowOffsetY: 4
|
|
15523
|
+
}
|
|
15364
15524
|
},
|
|
15365
|
-
|
|
15366
|
-
|
|
15367
|
-
|
|
15368
|
-
|
|
15369
|
-
|
|
15370
|
-
|
|
15371
|
-
|
|
15372
|
-
|
|
15373
|
-
|
|
15374
|
-
|
|
15375
|
-
|
|
15376
|
-
|
|
15377
|
-
|
|
15378
|
-
|
|
15379
|
-
|
|
15380
|
-
|
|
15381
|
-
|
|
15382
|
-
|
|
15383
|
-
|
|
15384
|
-
|
|
15385
|
-
|
|
15386
|
-
|
|
15387
|
-
|
|
15388
|
-
|
|
15389
|
-
|
|
15390
|
-
|
|
15391
|
-
|
|
15392
|
-
|
|
15393
|
-
|
|
15394
|
-
|
|
15395
|
-
|
|
15396
|
-
|
|
15397
|
-
}
|
|
15525
|
+
scales: {
|
|
15526
|
+
x: _objectSpread2({
|
|
15527
|
+
stacked: true,
|
|
15528
|
+
ticks: {
|
|
15529
|
+
display: true,
|
|
15530
|
+
color: '#000',
|
|
15531
|
+
padding: 5,
|
|
15532
|
+
font: {
|
|
15533
|
+
family: 'Poppins'
|
|
15534
|
+
}
|
|
15535
|
+
},
|
|
15536
|
+
grid: {
|
|
15537
|
+
display: false,
|
|
15538
|
+
drawBorder: false
|
|
15539
|
+
},
|
|
15540
|
+
display: false
|
|
15541
|
+
}, xAxis),
|
|
15542
|
+
y: _objectSpread2({
|
|
15543
|
+
stacked: true,
|
|
15544
|
+
min: -200,
|
|
15545
|
+
max: 200,
|
|
15546
|
+
ticks: {
|
|
15547
|
+
display: false,
|
|
15548
|
+
font: {
|
|
15549
|
+
family: 'Poppins'
|
|
15550
|
+
}
|
|
15551
|
+
},
|
|
15552
|
+
grid: {
|
|
15553
|
+
display: false,
|
|
15554
|
+
drawBorder: false
|
|
15555
|
+
},
|
|
15556
|
+
display: false
|
|
15557
|
+
}, yAxis)
|
|
15398
15558
|
}
|
|
15399
15559
|
}, chartOptions);
|
|
15400
|
-
|
|
15401
|
-
|
|
15402
|
-
|
|
15403
|
-
|
|
15404
|
-
|
|
15405
|
-
|
|
15406
|
-
|
|
15407
|
-
|
|
15408
|
-
|
|
15409
|
-
|
|
15410
|
-
|
|
15411
|
-
|
|
15412
|
-
// Center text styling and positioning
|
|
15413
|
-
ctx.font = "".concat(customLabel === null || customLabel === void 0 || (_customLabel$valueSty = customLabel.valueStyles) === null || _customLabel$valueSty === void 0 ? void 0 : _customLabel$valueSty.fontStyle, " ").concat(customLabel === null || customLabel === void 0 || (_customLabel$valueSty2 = customLabel.valueStyles) === null || _customLabel$valueSty2 === void 0 ? void 0 : _customLabel$valueSty2.fontSize, " Poppins");
|
|
15414
|
-
ctx.textAlign = 'center';
|
|
15415
|
-
ctx.textBaseline = 'middle';
|
|
15416
|
-
ctx.fillStyle = customLabel === null || customLabel === void 0 || (_customLabel$valueSty3 = customLabel.valueStyles) === null || _customLabel$valueSty3 === void 0 ? void 0 : _customLabel$valueSty3.color;
|
|
15417
|
-
|
|
15418
|
-
// Calculate the center position of the chart
|
|
15419
|
-
var centerX = (left + right) / 2;
|
|
15420
|
-
var centerY = (top + bottom) / 2;
|
|
15421
|
-
|
|
15422
|
-
// Render the center text
|
|
15423
|
-
ctx.fillText("".concat(customLabel === null || customLabel === void 0 ? void 0 : customLabel.id), centerX, centerY);
|
|
15424
|
-
|
|
15425
|
-
// Render the compliance title with bottom margin
|
|
15426
|
-
var titleBottomMargin = (_customLabel$margin = customLabel.margin) !== null && _customLabel$margin !== void 0 ? _customLabel$margin : 10; // Adjust this value for bottom margin
|
|
15427
|
-
var position = (_customLabel$labelSty = customLabel === null || customLabel === void 0 || (_customLabel$labelSty2 = customLabel.labelStyles) === null || _customLabel$labelSty2 === void 0 ? void 0 : _customLabel$labelSty2.position) !== null && _customLabel$labelSty !== void 0 ? _customLabel$labelSty : 5;
|
|
15428
|
-
var titleYPosition = centerY + position; // Default title Y position
|
|
15429
|
-
ctx.font = "".concat(customLabel === null || customLabel === void 0 || (_customLabel$labelSty3 = customLabel.labelStyles) === null || _customLabel$labelSty3 === void 0 ? void 0 : _customLabel$labelSty3.fontStyle, " ").concat(customLabel === null || customLabel === void 0 || (_customLabel$labelSty4 = customLabel.labelStyles) === null || _customLabel$labelSty4 === void 0 ? void 0 : _customLabel$labelSty4.fontSize, " Poppins"); // Title font style
|
|
15430
|
-
ctx.fillStyle = "".concat(customLabel === null || customLabel === void 0 || (_customLabel$labelSty5 = customLabel.labelStyles) === null || _customLabel$labelSty5 === void 0 ? void 0 : _customLabel$labelSty5.color); // Title text color (gray)
|
|
15431
|
-
ctx.fillText("".concat(customLabel === null || customLabel === void 0 ? void 0 : customLabel.title), centerX, titleYPosition + titleBottomMargin);
|
|
15432
|
-
|
|
15433
|
-
// Render compliance strip if `complianceStrip` is true
|
|
15434
|
-
if (strip) {
|
|
15435
|
-
var _strip$stripSize, _strip$stripWidth, _strip$startColor, _strip$endColor;
|
|
15436
|
-
var stripRadius = (_strip$stripSize = strip === null || strip === void 0 ? void 0 : strip.stripSize) !== null && _strip$stripSize !== void 0 ? _strip$stripSize : 35; // Radius for the outer ring
|
|
15437
|
-
var stripThickness = (_strip$stripWidth = strip === null || strip === void 0 ? void 0 : strip.stripWidth) !== null && _strip$stripWidth !== void 0 ? _strip$stripWidth : 7; // Thickness of the strip
|
|
15438
|
-
var compliancePercentage = customLabel === null || customLabel === void 0 ? void 0 : customLabel.value; // Set compliance percentage
|
|
15439
|
-
|
|
15440
|
-
// Fixed start and end angles
|
|
15441
|
-
var startAngle = 130 * Math.PI / 180; // Convert degrees to radians
|
|
15442
|
-
var endAngle = 55 * Math.PI / 180; // Convert degrees to radians
|
|
15443
|
-
|
|
15444
|
-
// Total angle of the arc (adjusting for crossing 360 degrees)
|
|
15445
|
-
var totalAngle = endAngle - startAngle;
|
|
15446
|
-
if (totalAngle < 0) {
|
|
15447
|
-
totalAngle += 2 * Math.PI; // Ensure positive value for angles crossing 360
|
|
15448
|
-
}
|
|
15449
|
-
|
|
15450
|
-
// Calculate the compliance angle based on the percentage
|
|
15451
|
-
var complianceAngle = compliancePercentage / 100 * totalAngle;
|
|
15452
|
-
var complianceEndAngle = startAngle + complianceAngle;
|
|
15560
|
+
return /*#__PURE__*/jsx("div", {
|
|
15561
|
+
style: _objectSpread2({
|
|
15562
|
+
position: 'relative'
|
|
15563
|
+
}, styles),
|
|
15564
|
+
children: /*#__PURE__*/jsx(Bar, _objectSpread2({
|
|
15565
|
+
data: data,
|
|
15566
|
+
options: options,
|
|
15567
|
+
plugins: [ChartDataLabels]
|
|
15568
|
+
}, extra))
|
|
15569
|
+
});
|
|
15570
|
+
};
|
|
15453
15571
|
|
|
15454
|
-
|
|
15455
|
-
|
|
15572
|
+
var css$15 = ".Skeleton_module_root__13b12cf6 {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n height: 100%;\n width: 100%;\n padding: 2rem;\n}\n.Skeleton_module_root__13b12cf6 .Skeleton_module_line__13b12cf6 {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: 100%;\n}\n.Skeleton_module_root__13b12cf6 .Skeleton_module_line__13b12cf6 .Skeleton_module_bump__13b12cf6 {\n transform: rotate(30deg);\n}\n.Skeleton_module_root__13b12cf6 .Skeleton_module_line__13b12cf6 .Skeleton_module_bump__13b12cf6:not(:nth-child(1)) {\n margin-left: -1.75rem;\n}\n.Skeleton_module_root__13b12cf6 .Skeleton_module_line__13b12cf6 .Skeleton_module_bump__13b12cf6:nth-child(2n) {\n transform: rotate(-30deg);\n}\n.Skeleton_module_root__13b12cf6.Skeleton_module_filled__13b12cf6 {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: stretch;\n}\n.Skeleton_module_root__13b12cf6.Skeleton_module_filled__13b12cf6 .Skeleton_module_bumps__13b12cf6 {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: flex-end;\n flex: 1 1 50%;\n}\n.Skeleton_module_root__13b12cf6.Skeleton_module_filled__13b12cf6 .Skeleton_module_bumps__13b12cf6 .Skeleton_module_triangle__13b12cf6 {\n height: 10rem;\n}\n.Skeleton_module_root__13b12cf6.Skeleton_module_filled__13b12cf6 .Skeleton_module_bumps__13b12cf6 .Skeleton_module_triangle__13b12cf6:nth-child(2n) {\n transform: rotate3d(0, 1, 0, 180deg);\n}\n.Skeleton_module_root__13b12cf6.Skeleton_module_filled__13b12cf6.Skeleton_module_lightTheme__13b12cf6 .Skeleton_module_bumps__13b12cf6 .Skeleton_module_triangle__13b12cf6 {\n background: linear-gradient(to bottom right, var(--white) 0%, var(--white) 50%, var(--grey6) 50%, var(--grey6) 100%);\n}\n.Skeleton_module_root__13b12cf6.Skeleton_module_filled__13b12cf6.Skeleton_module_darkTheme__13b12cf6 .Skeleton_module_bumps__13b12cf6 .Skeleton_module_triangle__13b12cf6 {\n background: linear-gradient(to bottom right, var(--dark-grey) 0%, var(--dark-grey) 50%, var(--grey2) 50%, var(--grey2) 100%);\n}\n.Skeleton_module_root__13b12cf6.Skeleton_module_filled__13b12cf6 .Skeleton_module_base__13b12cf6 {\n flex: 1 1 50%;\n}";
|
|
15573
|
+
var modules_37a5ff73$7 = {"root":"Skeleton_module_root__13b12cf6","line":"Skeleton_module_line__13b12cf6","bump":"Skeleton_module_bump__13b12cf6","filled":"Skeleton_module_filled__13b12cf6","bumps":"Skeleton_module_bumps__13b12cf6","triangle":"Skeleton_module_triangle__13b12cf6","light-theme":"Skeleton_module_lightTheme__13b12cf6","dark-theme":"Skeleton_module_darkTheme__13b12cf6","base":"Skeleton_module_base__13b12cf6"};
|
|
15574
|
+
n(css$15,{});
|
|
15456
15575
|
|
|
15457
|
-
|
|
15458
|
-
|
|
15459
|
-
|
|
15460
|
-
|
|
15576
|
+
var BUMPS = _toConsumableArray(Array(10).keys()).map(function () {
|
|
15577
|
+
return Math.random() * 80 + 20;
|
|
15578
|
+
});
|
|
15579
|
+
var TRIANGLES = _toConsumableArray(Array(7).keys()).map(function () {
|
|
15580
|
+
return Math.random() * 80 + 20;
|
|
15581
|
+
});
|
|
15582
|
+
var ChartSkeleton$4 = function ChartSkeleton(_ref) {
|
|
15583
|
+
var filled = _ref.filled,
|
|
15584
|
+
theme = _ref.theme,
|
|
15585
|
+
fallback = _ref.fallback;
|
|
15586
|
+
if (filled) {
|
|
15587
|
+
return /*#__PURE__*/jsxs("div", {
|
|
15588
|
+
className: classes(modules_37a5ff73$7.root, modules_37a5ff73$7.filled, modules_37a5ff73$7["".concat(theme, "-theme")]),
|
|
15589
|
+
children: [/*#__PURE__*/jsx("div", {
|
|
15590
|
+
className: modules_37a5ff73$7.bumps,
|
|
15591
|
+
children: TRIANGLES.map(function (bump) {
|
|
15592
|
+
return /*#__PURE__*/jsx(Skeleton, {
|
|
15593
|
+
theme: theme,
|
|
15594
|
+
className: modules_37a5ff73$7.triangle,
|
|
15595
|
+
noAnimation: true
|
|
15596
|
+
}, bump);
|
|
15597
|
+
})
|
|
15598
|
+
}), /*#__PURE__*/jsx(Skeleton, {
|
|
15599
|
+
className: modules_37a5ff73$7.base,
|
|
15600
|
+
theme: theme
|
|
15601
|
+
})]
|
|
15602
|
+
});
|
|
15603
|
+
}
|
|
15604
|
+
return /*#__PURE__*/jsx("div", {
|
|
15605
|
+
className: modules_37a5ff73$7.root,
|
|
15606
|
+
children: /*#__PURE__*/jsx("div", {
|
|
15607
|
+
className: modules_37a5ff73$7.line,
|
|
15608
|
+
children: BUMPS.map(function (bump) {
|
|
15609
|
+
return /*#__PURE__*/jsx(Skeleton, {
|
|
15610
|
+
theme: theme,
|
|
15611
|
+
className: modules_37a5ff73$7.bump,
|
|
15612
|
+
height: "0.5rem",
|
|
15613
|
+
noAnimation: fallback
|
|
15614
|
+
}, bump);
|
|
15615
|
+
})
|
|
15616
|
+
})
|
|
15617
|
+
});
|
|
15618
|
+
};
|
|
15461
15619
|
|
|
15462
|
-
|
|
15463
|
-
|
|
15464
|
-
|
|
15465
|
-
|
|
15466
|
-
|
|
15620
|
+
Chart.register(CategoryScale, LinearScale, PointElement, LineElement, Title$1, Tooltip$1, Legend, Filler);
|
|
15621
|
+
var BaseAreaChart = function BaseAreaChart(props) {
|
|
15622
|
+
var _seriesData$metaData$, _seriesData$metaData, _seriesData$chartData, _legend$display, _legend$position, _tooltip$borderWidth, _tooltip$callbacks, _tooltip$bodySpacing, _tooltip$displayColor, _tooltip$colorBoxWidt, _tooltip$colorBoxHeig, _tooltip$usePointStyl, _tooltip$bodyFont$tit, _tooltip$bodyFont, _tooltip$bodyFont$col, _tooltip$bodyFont2, _yAxis$callback;
|
|
15623
|
+
var loading = props.loading,
|
|
15624
|
+
title = props.title,
|
|
15625
|
+
seriesData = props.seriesData,
|
|
15626
|
+
tooltip = props.tooltip,
|
|
15627
|
+
legend = props.legend,
|
|
15628
|
+
xAxisLabelShow = props.xAxisLabelShow,
|
|
15629
|
+
yAxisLabelShow = props.yAxisLabelShow,
|
|
15630
|
+
xAxisLabel = props.xAxisLabel,
|
|
15631
|
+
yAxisLabel = props.yAxisLabel,
|
|
15632
|
+
axisLabelColor = props.axisLabelColor,
|
|
15633
|
+
stacked = props.stacked,
|
|
15634
|
+
smooth = props.smooth,
|
|
15635
|
+
theme = props.theme,
|
|
15636
|
+
fallback = props.fallback,
|
|
15637
|
+
isLineChart = props.isLineChart,
|
|
15638
|
+
xAxisPosition = props.xAxisPosition,
|
|
15639
|
+
xSplitLineShow = props.xSplitLineShow,
|
|
15640
|
+
xAxisLineShow = props.xAxisLineShow,
|
|
15641
|
+
axisSplitColor = props.axisSplitColor,
|
|
15642
|
+
cursor = props.cursor,
|
|
15643
|
+
yAxis = props.yAxis,
|
|
15644
|
+
xAxis = props.xAxis,
|
|
15645
|
+
width = props.width,
|
|
15646
|
+
height = props.height,
|
|
15647
|
+
chartOptionsProps = props.chartOptionsProps,
|
|
15648
|
+
_props$lineColors = props.lineColors,
|
|
15649
|
+
lineColors = _props$lineColors === void 0 ? ['rgba(255, 99, 132, 0.5)', 'rgba(54, 162, 235, 0.5)', 'rgba(75, 192, 192, 0.5)', 'rgba(153, 102, 255, 0.5)', 'rgba(255, 159, 64, 0.5)'] : _props$lineColors,
|
|
15650
|
+
_props$borderColors = props.borderColors,
|
|
15651
|
+
borderColors = _props$borderColors === void 0 ? ['rgba(255, 99, 132, 1)', 'rgba(54, 162, 235, 1)', 'rgba(75, 192, 192, 1)', 'rgba(153, 102, 255, 1)', 'rgba(255, 159, 64, 1)'] : _props$borderColors,
|
|
15652
|
+
style = props.style,
|
|
15653
|
+
extra = props.extra;
|
|
15654
|
+
if (loading || fallback) {
|
|
15655
|
+
return /*#__PURE__*/jsx(ChartSkeleton$4, {
|
|
15656
|
+
theme: theme,
|
|
15657
|
+
fallback: !loading && fallback
|
|
15658
|
+
});
|
|
15659
|
+
}
|
|
15660
|
+
var legendRef = useRef(null);
|
|
15661
|
+
var _useState = useState([]),
|
|
15662
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
15663
|
+
hiddenDatasets = _useState2[0],
|
|
15664
|
+
setHiddenDatasets = _useState2[1];
|
|
15665
|
+
var toggleDatasetVisibility = function toggleDatasetVisibility(index, chart) {
|
|
15666
|
+
setHiddenDatasets(function (prevHidden) {
|
|
15667
|
+
var newHidden = prevHidden.includes(index) ? prevHidden.filter(function (i) {
|
|
15668
|
+
return i !== index;
|
|
15669
|
+
}) : [].concat(_toConsumableArray(prevHidden), [index]);
|
|
15467
15670
|
|
|
15468
|
-
|
|
15469
|
-
|
|
15470
|
-
|
|
15471
|
-
|
|
15472
|
-
|
|
15473
|
-
ctx.stroke();
|
|
15474
|
-
}
|
|
15475
|
-
ctx.restore();
|
|
15476
|
-
}
|
|
15671
|
+
// Update the chart visibility
|
|
15672
|
+
chart.data.datasets[index].hidden = newHidden.includes(index);
|
|
15673
|
+
chart.update();
|
|
15674
|
+
return newHidden;
|
|
15675
|
+
});
|
|
15477
15676
|
};
|
|
15478
15677
|
var customLegendPlugin = {
|
|
15479
15678
|
id: 'customLegend',
|
|
15480
15679
|
afterUpdate: function afterUpdate(chart) {
|
|
15680
|
+
// Clear existing legend items
|
|
15481
15681
|
var ul = legendRef.current;
|
|
15482
15682
|
while (ul !== null && ul !== void 0 && ul.firstChild) {
|
|
15483
15683
|
ul.firstChild.remove();
|
|
15484
15684
|
}
|
|
15485
|
-
|
|
15685
|
+
|
|
15686
|
+
// Loop through the datasets and create legend items
|
|
15687
|
+
chart.data.datasets.forEach(function (dataset, index) {
|
|
15486
15688
|
var li = document.createElement('li');
|
|
15487
15689
|
li.style.display = 'flex';
|
|
15488
15690
|
li.style.alignItems = 'center';
|
|
15489
15691
|
li.style.cursor = 'pointer';
|
|
15692
|
+
li.style.opacity = hiddenDatasets.includes(index) ? '0.5' : '1';
|
|
15693
|
+
li.style.margin = '5px 10px';
|
|
15694
|
+
li.style.maxWidth = '120px';
|
|
15695
|
+
li.style.whiteSpace = 'nowrap';
|
|
15696
|
+
li.style.overflow = 'hidden';
|
|
15697
|
+
li.style.textOverflow = 'ellipsis';
|
|
15698
|
+
var textColor = hiddenDatasets.includes(index) ? 'grey' : 'inherit';
|
|
15699
|
+
var circleColor = hiddenDatasets.includes(index) ? 'grey' : dataset.backgroundColor;
|
|
15700
|
+
li.onclick = function () {
|
|
15701
|
+
// Toggle visibility of the dataset
|
|
15702
|
+
toggleDatasetVisibility(index, chart);
|
|
15490
15703
|
|
|
15491
|
-
|
|
15492
|
-
|
|
15493
|
-
|
|
15494
|
-
|
|
15495
|
-
|
|
15496
|
-
|
|
15497
|
-
|
|
15498
|
-
|
|
15499
|
-
|
|
15500
|
-
|
|
15501
|
-
|
|
15502
|
-
|
|
15503
|
-
|
|
15504
|
-
|
|
15505
|
-
li.onmouseenter = function () {
|
|
15506
|
-
handleHover(index); // Set hover on legend hover
|
|
15507
|
-
chart.update('none'); // Update the chart without animation
|
|
15508
|
-
};
|
|
15509
|
-
|
|
15510
|
-
// Handle leave event to remove hover effect
|
|
15511
|
-
li.onmouseleave = function () {
|
|
15512
|
-
setHoveredIndex(null);
|
|
15513
|
-
chart.update('none');
|
|
15704
|
+
// Apply grey-out effect on click
|
|
15705
|
+
if (li.style.color === 'grey') {
|
|
15706
|
+
li.style.color = 'inherit';
|
|
15707
|
+
} else {
|
|
15708
|
+
li.style.color = 'grey';
|
|
15709
|
+
}
|
|
15710
|
+
var circle = li.querySelector('circle');
|
|
15711
|
+
if (circle) {
|
|
15712
|
+
if (circle.getAttribute('stroke') === 'grey') {
|
|
15713
|
+
circle.setAttribute('stroke', dataset.backgroundColor);
|
|
15714
|
+
} else {
|
|
15715
|
+
circle.setAttribute('stroke', 'grey');
|
|
15716
|
+
}
|
|
15717
|
+
}
|
|
15514
15718
|
};
|
|
15515
|
-
|
|
15516
|
-
|
|
15517
|
-
var isGreyedOut = hoveredIndex !== null && hoveredIndex !== index;
|
|
15518
|
-
var displayColor = isGreyedOut ? '#D3D3D3' : sliceColor;
|
|
15519
|
-
li.innerHTML = "\n\t\t\t\t<svg width=\"15\" height=\"15\" viewBox=\"0 0 30 30\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t\t\t<circle cx=\"15\" cy=\"15\" r=\"12\" stroke=\"".concat(displayColor, "\" stroke-width=\"6\"/>\n\t\t\t\t</svg>\n\t\t\t\t<span style=\"margin-left: 10px;\">").concat(label, "</span>\n\t\t\t");
|
|
15520
|
-
ul.appendChild(li);
|
|
15719
|
+
li.innerHTML = "\n\t\t\t\t\t<svg width=\"15\" height=\"15\" viewBox=\"0 0 30 30\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t\t\t\t<circle cx=\"15\" cy=\"15\" r=\"12\" stroke=\"".concat(circleColor, "\" stroke-width=\"6\"/>\n\t\t\t\t\t</svg>\n\t\t\t\t<span style=\"margin-left: 10px; color: ").concat(textColor, ";\">").concat(dataset.label, "</span>\n\t\t\t\t");
|
|
15720
|
+
ul === null || ul === void 0 || ul.appendChild(li);
|
|
15521
15721
|
});
|
|
15522
15722
|
}
|
|
15523
15723
|
};
|
|
15524
|
-
|
|
15525
|
-
|
|
15526
|
-
|
|
15527
|
-
|
|
15528
|
-
|
|
15529
|
-
|
|
15530
|
-
|
|
15531
|
-
|
|
15532
|
-
|
|
15533
|
-
|
|
15534
|
-
|
|
15535
|
-
|
|
15536
|
-
|
|
15537
|
-
|
|
15538
|
-
|
|
15539
|
-
|
|
15540
|
-
|
|
15541
|
-
|
|
15542
|
-
|
|
15543
|
-
|
|
15544
|
-
})]
|
|
15545
|
-
});
|
|
15546
|
-
};
|
|
15547
|
-
|
|
15548
|
-
var css$13 = ".Skeleton_module_root__cca72340 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-end;\n gap: 1rem;\n height: 100%;\n width: 100%;\n padding: 2rem;\n}";
|
|
15549
|
-
var modules_37a5ff73$6 = {"root":"Skeleton_module_root__cca72340"};
|
|
15550
|
-
n(css$13,{});
|
|
15551
|
-
|
|
15552
|
-
var BARS = _toConsumableArray(Array(10).keys()).map(function () {
|
|
15553
|
-
return Math.random() * 80 + 20;
|
|
15554
|
-
});
|
|
15555
|
-
var ChartSkeleton$3 = function ChartSkeleton(_ref) {
|
|
15556
|
-
var theme = _ref.theme,
|
|
15557
|
-
fallback = _ref.fallback;
|
|
15558
|
-
return /*#__PURE__*/jsx("div", {
|
|
15559
|
-
className: modules_37a5ff73$6.root,
|
|
15560
|
-
children: BARS.map(function (bar) {
|
|
15561
|
-
return /*#__PURE__*/jsx(Skeleton, {
|
|
15562
|
-
theme: theme,
|
|
15563
|
-
width: "3rem",
|
|
15564
|
-
height: "".concat(bar, "%"),
|
|
15565
|
-
variant: "rounded",
|
|
15566
|
-
style: {
|
|
15567
|
-
animationDuration: '4s'
|
|
15568
|
-
},
|
|
15569
|
-
noAnimation: fallback
|
|
15570
|
-
}, bar);
|
|
15724
|
+
var chartData = {
|
|
15725
|
+
labels: (_seriesData$metaData$ = seriesData === null || seriesData === void 0 || (_seriesData$metaData = seriesData.metaData) === null || _seriesData$metaData === void 0 ? void 0 : _seriesData$metaData.xAxisData) !== null && _seriesData$metaData$ !== void 0 ? _seriesData$metaData$ : [],
|
|
15726
|
+
datasets: Object.keys((_seriesData$chartData = seriesData === null || seriesData === void 0 ? void 0 : seriesData.chartData) !== null && _seriesData$chartData !== void 0 ? _seriesData$chartData : {}).map(function (key, index) {
|
|
15727
|
+
var _seriesData$chartData2, _chartOptionsProps$bo, _chartOptionsProps$po, _chartOptionsProps$po2, _chartOptionsProps$po3;
|
|
15728
|
+
return {
|
|
15729
|
+
label: key,
|
|
15730
|
+
data: (_seriesData$chartData2 = seriesData === null || seriesData === void 0 ? void 0 : seriesData.chartData[key]) !== null && _seriesData$chartData2 !== void 0 ? _seriesData$chartData2 : [],
|
|
15731
|
+
fill: !isLineChart,
|
|
15732
|
+
backgroundColor: isLineChart ? 'transparent' : lineColors[index % lineColors.length],
|
|
15733
|
+
borderColor: borderColors[index % borderColors.length],
|
|
15734
|
+
tension: smooth ? 0.4 : 0,
|
|
15735
|
+
borderWidth: (_chartOptionsProps$bo = chartOptionsProps === null || chartOptionsProps === void 0 ? void 0 : chartOptionsProps.borderWidth) !== null && _chartOptionsProps$bo !== void 0 ? _chartOptionsProps$bo : 2,
|
|
15736
|
+
pointRadius: (_chartOptionsProps$po = chartOptionsProps === null || chartOptionsProps === void 0 ? void 0 : chartOptionsProps.pointRadius) !== null && _chartOptionsProps$po !== void 0 ? _chartOptionsProps$po : 4,
|
|
15737
|
+
pointHoverRadius: (_chartOptionsProps$po2 = chartOptionsProps === null || chartOptionsProps === void 0 ? void 0 : chartOptionsProps.pointHoverRadius) !== null && _chartOptionsProps$po2 !== void 0 ? _chartOptionsProps$po2 : 6,
|
|
15738
|
+
pointBackgroundColor: borderColors[index % borderColors.length],
|
|
15739
|
+
pointStyle: (_chartOptionsProps$po3 = chartOptionsProps === null || chartOptionsProps === void 0 ? void 0 : chartOptionsProps.pointStyle) !== null && _chartOptionsProps$po3 !== void 0 ? _chartOptionsProps$po3 : 'rectRot',
|
|
15740
|
+
datalabels: {
|
|
15741
|
+
display: false // Disable data labels on points
|
|
15742
|
+
}
|
|
15743
|
+
};
|
|
15571
15744
|
})
|
|
15572
|
-
}
|
|
15573
|
-
|
|
15574
|
-
|
|
15575
|
-
Chart.register(BarElement, CategoryScale, LinearScale, Tooltip$1, Legend, ChartDataLabels);
|
|
15576
|
-
var BaseBarChart = function BaseBarChart(_ref) {
|
|
15577
|
-
var _title$textStyle, _tooltip$borderWidth, _tooltip$bodySpacing, _tooltip$displayColor, _tooltip$colorBoxWidt, _tooltip$colorBoxHeig, _tooltip$usePointStyl, _tooltip$bodyFont$tit, _tooltip$bodyFont, _tooltip$bodyFont$col, _tooltip$bodyFont2;
|
|
15578
|
-
var loading = _ref.loading,
|
|
15579
|
-
seriesData = _ref.seriesData,
|
|
15580
|
-
title = _ref.title,
|
|
15581
|
-
gridOptions = _ref.gridOptions,
|
|
15582
|
-
_ref$width = _ref.width,
|
|
15583
|
-
width = _ref$width === void 0 ? '100%' : _ref$width,
|
|
15584
|
-
_ref$height = _ref.height,
|
|
15585
|
-
height = _ref$height === void 0 ? '100%' : _ref$height,
|
|
15586
|
-
_ref$barThickness = _ref.barThickness,
|
|
15587
|
-
barThickness = _ref$barThickness === void 0 ? 50 : _ref$barThickness,
|
|
15588
|
-
_ref$borderRadius = _ref.borderRadius,
|
|
15589
|
-
borderRadius = _ref$borderRadius === void 0 ? 5 : _ref$borderRadius,
|
|
15590
|
-
barColor1 = _ref.barColor1,
|
|
15591
|
-
barColor2 = _ref.barColor2,
|
|
15592
|
-
xAxisTitle = _ref.xAxisTitle,
|
|
15593
|
-
yAxisTitle = _ref.yAxisTitle,
|
|
15594
|
-
tooltip = _ref.tooltip,
|
|
15595
|
-
legends = _ref.legends,
|
|
15596
|
-
chartOptions = _ref.chartOptions,
|
|
15597
|
-
chartDatasets = _ref.chartDatasets,
|
|
15598
|
-
xAxis = _ref.xAxis,
|
|
15599
|
-
yAxis = _ref.yAxis,
|
|
15600
|
-
styles = _ref.styles,
|
|
15601
|
-
_ref$vertical = _ref.vertical,
|
|
15602
|
-
vertical = _ref$vertical === void 0 ? true : _ref$vertical,
|
|
15603
|
-
stacked = _ref.stacked,
|
|
15604
|
-
extra = _ref.extra;
|
|
15605
|
-
if (loading) {
|
|
15606
|
-
return /*#__PURE__*/jsx(ChartSkeleton$3, {
|
|
15607
|
-
vertical: vertical
|
|
15608
|
-
});
|
|
15609
|
-
}
|
|
15610
|
-
|
|
15611
|
-
// Mapping the data for Chart.js
|
|
15612
|
-
var labels = Object.keys(seriesData.chartData);
|
|
15613
|
-
var allKeys = new Set();
|
|
15614
|
-
Object.values(seriesData.chartData).forEach(function (data) {
|
|
15615
|
-
Object.keys(data).forEach(function (key) {
|
|
15616
|
-
allKeys.add(key);
|
|
15617
|
-
});
|
|
15618
|
-
});
|
|
15619
|
-
var barDatasets = Array.from(allKeys).map(function (key) {
|
|
15620
|
-
return _objectSpread2({
|
|
15621
|
-
label: key,
|
|
15622
|
-
backgroundColor: key === 'x1' ? barColor1 !== null && barColor1 !== void 0 ? barColor1 : COLORS.success : key === 'x2' ? barColor2 !== null && barColor2 !== void 0 ? barColor2 : COLORS.error : COLORS.warning,
|
|
15623
|
-
data: labels.map(function (label) {
|
|
15624
|
-
return seriesData.chartData[label][key] !== undefined ? seriesData.chartData[label][key] : null;
|
|
15625
|
-
}),
|
|
15626
|
-
borderRadius: borderRadius,
|
|
15627
|
-
barThickness: barThickness
|
|
15628
|
-
}, chartDatasets);
|
|
15629
|
-
});
|
|
15630
|
-
var datasets = stacked ? [].concat(_toConsumableArray(barDatasets), [stacked]) : _toConsumableArray(barDatasets);
|
|
15631
|
-
var options = {
|
|
15745
|
+
};
|
|
15746
|
+
var chartOptions = _objectSpread2({
|
|
15632
15747
|
responsive: true,
|
|
15633
15748
|
maintainAspectRatio: false,
|
|
15634
|
-
|
|
15635
|
-
|
|
15636
|
-
|
|
15637
|
-
|
|
15638
|
-
display: true,
|
|
15639
|
-
|
|
15640
|
-
|
|
15641
|
-
|
|
15642
|
-
|
|
15643
|
-
|
|
15644
|
-
|
|
15645
|
-
|
|
15749
|
+
plugins: {
|
|
15750
|
+
legend: legend !== null && legend !== void 0 && legend.icon ? {
|
|
15751
|
+
display: false
|
|
15752
|
+
} : _objectSpread2({
|
|
15753
|
+
display: (_legend$display = legend === null || legend === void 0 ? void 0 : legend.display) !== null && _legend$display !== void 0 ? _legend$display : true,
|
|
15754
|
+
position: (_legend$position = legend === null || legend === void 0 ? void 0 : legend.position) !== null && _legend$position !== void 0 ? _legend$position : 'bottom',
|
|
15755
|
+
labels: {
|
|
15756
|
+
color: axisLabelColor || COLORS.grey,
|
|
15757
|
+
boxWidth: 9,
|
|
15758
|
+
// Adjust width for a circular appearance
|
|
15759
|
+
boxHeight: 9,
|
|
15760
|
+
// Adjust height for a circular appearance
|
|
15761
|
+
borderRadius: 50,
|
|
15762
|
+
// Ensure the shape is circular
|
|
15763
|
+
padding: 10,
|
|
15764
|
+
// Padding around legend items
|
|
15765
|
+
usePointStyle: true,
|
|
15766
|
+
// Use circular point style for legends
|
|
15767
|
+
font: {
|
|
15768
|
+
family: 'Poppins'
|
|
15769
|
+
}
|
|
15646
15770
|
}
|
|
15647
|
-
},
|
|
15771
|
+
}, legend),
|
|
15648
15772
|
tooltip: _objectSpread2({
|
|
15649
15773
|
borderWidth: (_tooltip$borderWidth = tooltip === null || tooltip === void 0 ? void 0 : tooltip.borderWidth) !== null && _tooltip$borderWidth !== void 0 ? _tooltip$borderWidth : 1,
|
|
15774
|
+
borderColor: function borderColor(context) {
|
|
15775
|
+
var _context$tooltipItems;
|
|
15776
|
+
var segmentColor = context === null || context === void 0 || (_context$tooltipItems = context.tooltipItems[0]) === null || _context$tooltipItems === void 0 || (_context$tooltipItems = _context$tooltipItems.dataset) === null || _context$tooltipItems === void 0 ? void 0 : _context$tooltipItems.backgroundColor;
|
|
15777
|
+
return segmentColor || 'black';
|
|
15778
|
+
},
|
|
15650
15779
|
backgroundColor: 'rgba(255, 255, 255, 1)',
|
|
15780
|
+
callbacks: (_tooltip$callbacks = tooltip === null || tooltip === void 0 ? void 0 : tooltip.callbacks) !== null && _tooltip$callbacks !== void 0 ? _tooltip$callbacks : {
|
|
15781
|
+
label: function label(context) {
|
|
15782
|
+
var _context$dataset;
|
|
15783
|
+
var label = (context === null || context === void 0 || (_context$dataset = context.dataset) === null || _context$dataset === void 0 ? void 0 : _context$dataset.label) || '';
|
|
15784
|
+
var value = context === null || context === void 0 ? void 0 : context.formattedValue;
|
|
15785
|
+
return "".concat(label, ": ").concat(value);
|
|
15786
|
+
},
|
|
15787
|
+
title: tooltip.displayTitle ? function (tooltipItems) {
|
|
15788
|
+
var _tooltipItems$;
|
|
15789
|
+
return ((_tooltipItems$ = tooltipItems[0]) === null || _tooltipItems$ === void 0 ? void 0 : _tooltipItems$.label) || '';
|
|
15790
|
+
} : function () {
|
|
15791
|
+
return '';
|
|
15792
|
+
}
|
|
15793
|
+
},
|
|
15651
15794
|
bodySpacing: (_tooltip$bodySpacing = tooltip === null || tooltip === void 0 ? void 0 : tooltip.bodySpacing) !== null && _tooltip$bodySpacing !== void 0 ? _tooltip$bodySpacing : 5,
|
|
15652
15795
|
displayColors: (_tooltip$displayColor = tooltip === null || tooltip === void 0 ? void 0 : tooltip.displayColors) !== null && _tooltip$displayColor !== void 0 ? _tooltip$displayColor : true,
|
|
15653
15796
|
boxWidth: (_tooltip$colorBoxWidt = tooltip === null || tooltip === void 0 ? void 0 : tooltip.colorBoxWidth) !== null && _tooltip$colorBoxWidt !== void 0 ? _tooltip$colorBoxWidt : 5,
|
|
@@ -15656,308 +15799,521 @@ var BaseBarChart = function BaseBarChart(_ref) {
|
|
|
15656
15799
|
usePointStyle: (_tooltip$usePointStyl = tooltip === null || tooltip === void 0 ? void 0 : tooltip.usePointStyle) !== null && _tooltip$usePointStyl !== void 0 ? _tooltip$usePointStyl : true,
|
|
15657
15800
|
titleColor: (_tooltip$bodyFont$tit = tooltip === null || tooltip === void 0 || (_tooltip$bodyFont = tooltip.bodyFont) === null || _tooltip$bodyFont === void 0 ? void 0 : _tooltip$bodyFont.titleColor) !== null && _tooltip$bodyFont$tit !== void 0 ? _tooltip$bodyFont$tit : '#000',
|
|
15658
15801
|
bodyColor: (_tooltip$bodyFont$col = tooltip === null || tooltip === void 0 || (_tooltip$bodyFont2 = tooltip.bodyFont) === null || _tooltip$bodyFont2 === void 0 ? void 0 : _tooltip$bodyFont2.color) !== null && _tooltip$bodyFont$col !== void 0 ? _tooltip$bodyFont$col : '#000',
|
|
15659
|
-
bodyFont: _objectSpread2(
|
|
15660
|
-
family: 'Poppins'
|
|
15661
|
-
})
|
|
15802
|
+
bodyFont: _objectSpread2({}, tooltip.bodyFont)
|
|
15662
15803
|
}, tooltip),
|
|
15663
|
-
|
|
15664
|
-
display:
|
|
15665
|
-
|
|
15666
|
-
|
|
15667
|
-
datalabels: {
|
|
15668
|
-
anchor: 'end',
|
|
15669
|
-
align: 'top',
|
|
15670
|
-
// Align the labels above the bars
|
|
15671
|
-
color: 'black',
|
|
15804
|
+
title: {
|
|
15805
|
+
display: !!title,
|
|
15806
|
+
text: title,
|
|
15807
|
+
color: axisLabelColor || COLORS.grey,
|
|
15672
15808
|
font: {
|
|
15673
|
-
|
|
15674
|
-
|
|
15809
|
+
size: 16,
|
|
15810
|
+
weight: 'bold',
|
|
15675
15811
|
family: 'Poppins'
|
|
15676
|
-
},
|
|
15677
|
-
offset: 4,
|
|
15678
|
-
// Space between the bar and the label
|
|
15679
|
-
formatter: function formatter(value, context) {
|
|
15680
|
-
return context.chart.data.labels[context.dataIndex];
|
|
15681
15812
|
}
|
|
15682
15813
|
}
|
|
15683
|
-
},
|
|
15814
|
+
},
|
|
15684
15815
|
scales: {
|
|
15685
15816
|
x: _objectSpread2({
|
|
15686
|
-
|
|
15687
|
-
|
|
15688
|
-
|
|
15817
|
+
display: xAxisLabelShow,
|
|
15818
|
+
position: xAxisPosition,
|
|
15819
|
+
stacked: stacked,
|
|
15820
|
+
// Stack bars if applicable
|
|
15821
|
+
title: {
|
|
15822
|
+
display: !!xAxisLabel,
|
|
15823
|
+
text: xAxisLabel,
|
|
15824
|
+
color: axisLabelColor || COLORS.grey,
|
|
15825
|
+
font: {
|
|
15826
|
+
size: 14,
|
|
15827
|
+
family: 'Poppins'
|
|
15828
|
+
}
|
|
15689
15829
|
},
|
|
15690
|
-
|
|
15691
|
-
|
|
15692
|
-
|
|
15693
|
-
|
|
15694
|
-
|
|
15695
|
-
|
|
15830
|
+
grid: {
|
|
15831
|
+
display: xSplitLineShow,
|
|
15832
|
+
color: axisSplitColor,
|
|
15833
|
+
lineWidth: 1,
|
|
15834
|
+
drawOnChartArea: true,
|
|
15835
|
+
drawBorder: false,
|
|
15836
|
+
// Disable drawing grid lines on the border to allow full-length lines
|
|
15837
|
+
tickLength: 30 // Adjust this value to control the length of the grid lines
|
|
15838
|
+
},
|
|
15839
|
+
ticks: {
|
|
15840
|
+
color: axisLabelColor || COLORS.grey,
|
|
15696
15841
|
font: {
|
|
15697
15842
|
family: 'Poppins'
|
|
15698
|
-
}
|
|
15843
|
+
},
|
|
15844
|
+
stepSize: 100
|
|
15699
15845
|
},
|
|
15846
|
+
borderColor: xAxisLineShow ? 'rgba(0, 0, 0, 0)' : 'rgba(0, 0, 0, 0)',
|
|
15847
|
+
borderWidth: xAxisLineShow ? 1 : 0
|
|
15848
|
+
}, xAxis),
|
|
15849
|
+
y: _objectSpread2({
|
|
15850
|
+
display: yAxisLabelShow,
|
|
15851
|
+
// Whether to display y-axis labels
|
|
15852
|
+
stacked: stacked,
|
|
15853
|
+
// Stack bars if applicable
|
|
15700
15854
|
title: {
|
|
15701
|
-
display:
|
|
15702
|
-
|
|
15703
|
-
|
|
15855
|
+
display: !!yAxisLabel,
|
|
15856
|
+
// Display y-axis title if set
|
|
15857
|
+
text: yAxisLabel,
|
|
15858
|
+
color: axisLabelColor || COLORS.grey,
|
|
15704
15859
|
font: {
|
|
15860
|
+
size: 14,
|
|
15705
15861
|
family: 'Poppins'
|
|
15706
15862
|
}
|
|
15707
|
-
}
|
|
15708
|
-
}, xAxis),
|
|
15709
|
-
y: _objectSpread2({
|
|
15863
|
+
},
|
|
15710
15864
|
grid: {
|
|
15711
15865
|
display: true,
|
|
15712
|
-
color:
|
|
15866
|
+
color: axisSplitColor
|
|
15713
15867
|
},
|
|
15714
15868
|
ticks: {
|
|
15715
|
-
color:
|
|
15716
|
-
|
|
15717
|
-
font: {
|
|
15718
|
-
family: 'Poppins'
|
|
15719
|
-
}
|
|
15720
|
-
},
|
|
15721
|
-
title: {
|
|
15722
|
-
display: true,
|
|
15723
|
-
text: yAxisTitle,
|
|
15724
|
-
color: 'black',
|
|
15869
|
+
color: axisLabelColor || COLORS.grey,
|
|
15870
|
+
stepSize: 100,
|
|
15725
15871
|
font: {
|
|
15726
15872
|
family: 'Poppins'
|
|
15873
|
+
},
|
|
15874
|
+
callback: (_yAxis$callback = yAxis === null || yAxis === void 0 ? void 0 : yAxis.callback) !== null && _yAxis$callback !== void 0 ? _yAxis$callback : function (value) {
|
|
15875
|
+
return value;
|
|
15727
15876
|
}
|
|
15728
15877
|
}
|
|
15729
15878
|
}, yAxis)
|
|
15879
|
+
},
|
|
15880
|
+
elements: {
|
|
15881
|
+
display: false,
|
|
15882
|
+
line: {
|
|
15883
|
+
tension: smooth ? 0.4 : 0
|
|
15884
|
+
},
|
|
15885
|
+
point: {
|
|
15886
|
+
display: false,
|
|
15887
|
+
radius: 0
|
|
15888
|
+
}
|
|
15889
|
+
},
|
|
15890
|
+
cursor: cursor !== null && cursor !== void 0 ? cursor : 'default'
|
|
15891
|
+
}, chartOptionsProps);
|
|
15892
|
+
var legendStyle = _objectSpread2({
|
|
15893
|
+
display: 'flex',
|
|
15894
|
+
listStyle: 'none',
|
|
15895
|
+
padding: '0px'
|
|
15896
|
+
}, legend === null || legend === void 0 ? void 0 : legend.legendStyles);
|
|
15897
|
+
return /*#__PURE__*/jsxs("div", {
|
|
15898
|
+
style: _objectSpread2({
|
|
15899
|
+
width: width !== null && width !== void 0 ? width : '100%',
|
|
15900
|
+
height: height !== null && height !== void 0 ? height : '300px',
|
|
15901
|
+
display: 'flex',
|
|
15902
|
+
alignItems: 'center'
|
|
15903
|
+
}, style),
|
|
15904
|
+
children: [/*#__PURE__*/jsx(Line, _objectSpread2({
|
|
15905
|
+
data: chartData,
|
|
15906
|
+
options: chartOptions,
|
|
15907
|
+
plugins: [customLegendPlugin]
|
|
15908
|
+
}, extra)), (legend === null || legend === void 0 ? void 0 : legend.icon) && (legend === null || legend === void 0 ? void 0 : legend.display) && /*#__PURE__*/jsx("ul", {
|
|
15909
|
+
ref: legendRef,
|
|
15910
|
+
style: legendStyle
|
|
15911
|
+
})]
|
|
15912
|
+
});
|
|
15913
|
+
};
|
|
15914
|
+
|
|
15915
|
+
var css$14 = ".Skeleton_module_root__ecbd3e3d {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n overflow: hidden;\n position: relative;\n}\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_outer__ecbd3e3d,\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n max-width: 100%;\n max-height: 100%;\n}\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n position: absolute;\n opacity: 1;\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n opacity: 1;\n height: 0.5rem;\n position: absolute;\n transform-origin: left;\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(1) {\n transform: translateX(3.25rem) rotate(45deg);\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(2) {\n transform: translateX(3.25rem) rotate(-75deg);\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(3) {\n transform: translateX(3.25rem) rotate(-10deg);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_lightTheme__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n background: var(--white);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_lightTheme__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n background: var(--white);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_darkTheme__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n background: var(--menu-black);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_darkTheme__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n background: var(--menu-black);\n}";
|
|
15916
|
+
var modules_37a5ff73$6 = {"root":"Skeleton_module_root__ecbd3e3d","outer":"Skeleton_module_outer__ecbd3e3d","inner":"Skeleton_module_inner__ecbd3e3d","line":"Skeleton_module_line__ecbd3e3d","light-theme":"Skeleton_module_lightTheme__ecbd3e3d","dark-theme":"Skeleton_module_darkTheme__ecbd3e3d"};
|
|
15917
|
+
n(css$14,{});
|
|
15918
|
+
|
|
15919
|
+
var ChartSkeleton$3 = function ChartSkeleton(_ref) {
|
|
15920
|
+
var theme = _ref.theme,
|
|
15921
|
+
fallback = _ref.fallback;
|
|
15922
|
+
return /*#__PURE__*/jsxs("div", {
|
|
15923
|
+
className: classes(modules_37a5ff73$6.root, modules_37a5ff73$6["".concat(theme, "-theme")]),
|
|
15924
|
+
children: [/*#__PURE__*/jsx(Skeleton, {
|
|
15925
|
+
theme: theme,
|
|
15926
|
+
className: modules_37a5ff73$6.outer,
|
|
15927
|
+
width: "12.5rem",
|
|
15928
|
+
height: "12.5rem",
|
|
15929
|
+
variant: "circle",
|
|
15930
|
+
noAnimation: fallback
|
|
15931
|
+
}), /*#__PURE__*/jsx(Skeleton, {
|
|
15932
|
+
noAnimation: true,
|
|
15933
|
+
className: modules_37a5ff73$6.inner,
|
|
15934
|
+
width: "7.5rem",
|
|
15935
|
+
height: "7.5rem",
|
|
15936
|
+
variant: "circle"
|
|
15937
|
+
}), /*#__PURE__*/jsx(Skeleton, {
|
|
15938
|
+
noAnimation: true,
|
|
15939
|
+
className: modules_37a5ff73$6.line,
|
|
15940
|
+
width: "6.25rem"
|
|
15941
|
+
}), /*#__PURE__*/jsx(Skeleton, {
|
|
15942
|
+
noAnimation: true,
|
|
15943
|
+
className: modules_37a5ff73$6.line,
|
|
15944
|
+
width: "6.25rem"
|
|
15945
|
+
}), /*#__PURE__*/jsx(Skeleton, {
|
|
15946
|
+
noAnimation: true,
|
|
15947
|
+
className: modules_37a5ff73$6.line,
|
|
15948
|
+
width: "6.25rem"
|
|
15949
|
+
})]
|
|
15950
|
+
});
|
|
15951
|
+
};
|
|
15952
|
+
|
|
15953
|
+
Chart.register(RadialLinearScale, ArcElement, Tooltip$1, Legend, ChartDataLabels);
|
|
15954
|
+
var CapsulePolarChart = function CapsulePolarChart(_ref) {
|
|
15955
|
+
var loading = _ref.loading,
|
|
15956
|
+
fallback = _ref.fallback,
|
|
15957
|
+
_ref$seriesData = _ref.seriesData,
|
|
15958
|
+
seriesData = _ref$seriesData === void 0 ? {} : _ref$seriesData,
|
|
15959
|
+
_ref$showLegends = _ref.showLegends,
|
|
15960
|
+
showLegends = _ref$showLegends === void 0 ? false : _ref$showLegends,
|
|
15961
|
+
chartDataOptions = _ref.chartDataOptions,
|
|
15962
|
+
chartOptions = _ref.chartOptions,
|
|
15963
|
+
dataLabel = _ref.dataLabel,
|
|
15964
|
+
styles = _ref.styles,
|
|
15965
|
+
donutProps = _ref.donutProps,
|
|
15966
|
+
extra = _ref.extra,
|
|
15967
|
+
dataSetoptions = _ref.dataSetoptions,
|
|
15968
|
+
tooltip = _ref.tooltip;
|
|
15969
|
+
var labels = Array.from(new Set(Object.keys(seriesData.chartData))); // Ensure unique labels
|
|
15970
|
+
|
|
15971
|
+
var compliantData = [];
|
|
15972
|
+
var nonCompliantData = [];
|
|
15973
|
+
var minThreshold = 1;
|
|
15974
|
+
|
|
15975
|
+
// Prepare the datasets
|
|
15976
|
+
labels.forEach(function (label) {
|
|
15977
|
+
var _seriesData$chartData, _seriesData$chartData2;
|
|
15978
|
+
var x1 = ((_seriesData$chartData = seriesData.chartData[label]) === null || _seriesData$chartData === void 0 ? void 0 : _seriesData$chartData.x1) || 0; // Compliant
|
|
15979
|
+
var x2 = ((_seriesData$chartData2 = seriesData.chartData[label]) === null || _seriesData$chartData2 === void 0 ? void 0 : _seriesData$chartData2.x2) || 0; // Non-Compliant
|
|
15980
|
+
|
|
15981
|
+
// Ensure both values are above the minimum threshold
|
|
15982
|
+
compliantData.push(Math.max(x1, minThreshold));
|
|
15983
|
+
nonCompliantData.push(Math.max(x2, minThreshold));
|
|
15984
|
+
});
|
|
15985
|
+
|
|
15986
|
+
// Chart.js configuration
|
|
15987
|
+
var chartData = _objectSpread2({
|
|
15988
|
+
labels: labels,
|
|
15989
|
+
datasets: [_objectSpread2({
|
|
15990
|
+
// label: 'Compliant',
|
|
15991
|
+
data: compliantData
|
|
15992
|
+
}, chartDataOptions), {
|
|
15993
|
+
label: 'Non-Compliant',
|
|
15994
|
+
data: nonCompliantData,
|
|
15995
|
+
backgroundColor: 'rgba(255, 0, 0, 0.6)',
|
|
15996
|
+
borderColor: '#fff',
|
|
15997
|
+
borderWidth: 2
|
|
15998
|
+
}]
|
|
15999
|
+
}, dataSetoptions);
|
|
16000
|
+
var options = _objectSpread2({
|
|
16001
|
+
responsive: true,
|
|
16002
|
+
maintainAspectRatio: false,
|
|
16003
|
+
plugins: {
|
|
16004
|
+
legend: {
|
|
16005
|
+
display: showLegends,
|
|
16006
|
+
position: 'top',
|
|
16007
|
+
labels: {
|
|
16008
|
+
color: '#000'
|
|
16009
|
+
}
|
|
16010
|
+
},
|
|
16011
|
+
tooltip: _objectSpread2({
|
|
16012
|
+
position: 'nearest',
|
|
16013
|
+
// Try to keep it near the point
|
|
16014
|
+
yAlign: 'top',
|
|
16015
|
+
callbacks: {
|
|
16016
|
+
label: function label(context) {
|
|
16017
|
+
var label = context.label || '';
|
|
16018
|
+
var value = context.formattedValue || '';
|
|
16019
|
+
return "".concat(label, ": ").concat(value);
|
|
16020
|
+
}
|
|
16021
|
+
},
|
|
16022
|
+
displayColors: false,
|
|
16023
|
+
padding: 10,
|
|
16024
|
+
bodyFont: {
|
|
16025
|
+
size: 14
|
|
16026
|
+
}
|
|
16027
|
+
}, tooltip),
|
|
16028
|
+
datalabels: _objectSpread2({
|
|
16029
|
+
display: function display(context) {
|
|
16030
|
+
var datasetIndex = context.datasetIndex,
|
|
16031
|
+
dataIndex = context.dataIndex;
|
|
16032
|
+
var compliantValue = compliantData[dataIndex];
|
|
16033
|
+
var nonCompliantValue = nonCompliantData[dataIndex];
|
|
16034
|
+
|
|
16035
|
+
// Only display label for the larger value in the slice
|
|
16036
|
+
if (datasetIndex === 0 && compliantValue >= nonCompliantValue || datasetIndex === 1 && nonCompliantValue > compliantValue) {
|
|
16037
|
+
return true;
|
|
16038
|
+
}
|
|
16039
|
+
return false;
|
|
16040
|
+
},
|
|
16041
|
+
formatter: function formatter(value, context) {
|
|
16042
|
+
var label = context.chart.data.labels[context.dataIndex];
|
|
16043
|
+
return label;
|
|
16044
|
+
},
|
|
16045
|
+
borderColor: 'grey',
|
|
16046
|
+
borderWidth: 1,
|
|
16047
|
+
borderRadius: 4,
|
|
16048
|
+
color: 'black',
|
|
16049
|
+
font: {
|
|
16050
|
+
size: 14
|
|
16051
|
+
},
|
|
16052
|
+
anchor: 'end',
|
|
16053
|
+
align: 'end',
|
|
16054
|
+
offset: 10
|
|
16055
|
+
}, dataLabel)
|
|
16056
|
+
},
|
|
16057
|
+
scales: {
|
|
16058
|
+
r: {
|
|
16059
|
+
display: false // Hides the radial scale
|
|
16060
|
+
}
|
|
16061
|
+
},
|
|
16062
|
+
layout: {
|
|
16063
|
+
padding: {
|
|
16064
|
+
top: 20,
|
|
16065
|
+
// Add padding on top
|
|
16066
|
+
right: 20,
|
|
16067
|
+
// Add padding on the right
|
|
16068
|
+
bottom: 20,
|
|
16069
|
+
// Add padding at the bottom
|
|
16070
|
+
left: 20 // Add padding on the left
|
|
16071
|
+
}
|
|
16072
|
+
},
|
|
16073
|
+
rotation: -Math.PI / 2
|
|
16074
|
+
}, chartOptions);
|
|
16075
|
+
if (loading || fallback) {
|
|
16076
|
+
return /*#__PURE__*/jsx(ChartSkeleton$3, {
|
|
16077
|
+
fallback: !loading && fallback
|
|
16078
|
+
});
|
|
16079
|
+
}
|
|
16080
|
+
var centerHolePlugin = {
|
|
16081
|
+
id: 'centerHolePlugin',
|
|
16082
|
+
afterDatasetsDraw: function afterDatasetsDraw(chart) {
|
|
16083
|
+
var _donutProps$radius;
|
|
16084
|
+
var ctx = chart.ctx,
|
|
16085
|
+
chartArea = chart.chartArea;
|
|
16086
|
+
var centerX = (chartArea.left + chartArea.right) / 2;
|
|
16087
|
+
var centerY = (chartArea.top + chartArea.bottom) / 2;
|
|
16088
|
+
var radius = Math.min(chartArea.right - chartArea.left, chartArea.bottom - chartArea.top) / ((_donutProps$radius = donutProps === null || donutProps === void 0 ? void 0 : donutProps.radius) !== null && _donutProps$radius !== void 0 ? _donutProps$radius : 15);
|
|
16089
|
+
ctx.save();
|
|
16090
|
+
ctx.beginPath();
|
|
16091
|
+
ctx.arc(centerX, centerY, radius, 0, 2 * Math.PI);
|
|
16092
|
+
ctx.fillStyle = donutProps === null || donutProps === void 0 ? void 0 : donutProps.backgroundColor;
|
|
16093
|
+
ctx.fill();
|
|
16094
|
+
ctx.restore();
|
|
15730
16095
|
}
|
|
15731
16096
|
};
|
|
15732
16097
|
return /*#__PURE__*/jsx("div", {
|
|
15733
16098
|
style: _objectSpread2({
|
|
15734
|
-
width:
|
|
15735
|
-
|
|
15736
|
-
|
|
16099
|
+
width: '100%',
|
|
16100
|
+
height: '100%',
|
|
16101
|
+
padding: '0px'
|
|
15737
16102
|
}, styles),
|
|
15738
|
-
children: /*#__PURE__*/jsx(
|
|
15739
|
-
data:
|
|
15740
|
-
|
|
15741
|
-
|
|
15742
|
-
},
|
|
15743
|
-
options: options
|
|
16103
|
+
children: /*#__PURE__*/jsx(PolarArea, _objectSpread2({
|
|
16104
|
+
data: chartData,
|
|
16105
|
+
options: options,
|
|
16106
|
+
plugins: [ChartDataLabels, !!donutProps && centerHolePlugin]
|
|
15744
16107
|
}, extra))
|
|
15745
16108
|
});
|
|
15746
16109
|
};
|
|
15747
16110
|
|
|
15748
|
-
var css$
|
|
15749
|
-
var
|
|
16111
|
+
var css$13 = ".BasePieChart_module_root__1ce331ae {\n width: 100%;\n contain-intrinsic-height: 90%;\n font-family: Poppins !important;\n}\n.BasePieChart_module_root__1ce331ae > canvas {\n width: -moz-fit-content !important;\n width: fit-content !important;\n}";
|
|
16112
|
+
var modules_c20882aa = {"root":"BasePieChart_module_root__1ce331ae"};
|
|
16113
|
+
n(css$13,{});
|
|
16114
|
+
|
|
16115
|
+
var css$12 = ".Skeleton_module_root__ecbd3e3d {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n overflow: hidden;\n position: relative;\n}\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_outer__ecbd3e3d,\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n max-width: 100%;\n max-height: 100%;\n}\n.Skeleton_module_root__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n position: absolute;\n opacity: 1;\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n opacity: 1;\n height: 0.5rem;\n position: absolute;\n transform-origin: left;\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(1) {\n transform: translateX(3.25rem) rotate(45deg);\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(2) {\n transform: translateX(3.25rem) rotate(-75deg);\n}\n.Skeleton_module_root__ecbd3e3d span.Skeleton_module_line__ecbd3e3d:nth-last-of-type(3) {\n transform: translateX(3.25rem) rotate(-10deg);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_lightTheme__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n background: var(--white);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_lightTheme__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n background: var(--white);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_darkTheme__ecbd3e3d > .Skeleton_module_inner__ecbd3e3d {\n background: var(--menu-black);\n}\n.Skeleton_module_root__ecbd3e3d.Skeleton_module_darkTheme__ecbd3e3d span.Skeleton_module_line__ecbd3e3d {\n background: var(--menu-black);\n}";
|
|
16116
|
+
var modules_37a5ff73$5 = {"root":"Skeleton_module_root__ecbd3e3d","outer":"Skeleton_module_outer__ecbd3e3d","inner":"Skeleton_module_inner__ecbd3e3d","line":"Skeleton_module_line__ecbd3e3d","light-theme":"Skeleton_module_lightTheme__ecbd3e3d","dark-theme":"Skeleton_module_darkTheme__ecbd3e3d"};
|
|
15750
16117
|
n(css$12,{});
|
|
15751
16118
|
|
|
15752
|
-
var BUMPS = _toConsumableArray(Array(10).keys()).map(function () {
|
|
15753
|
-
return Math.random() * 80 + 20;
|
|
15754
|
-
});
|
|
15755
|
-
var TRIANGLES = _toConsumableArray(Array(7).keys()).map(function () {
|
|
15756
|
-
return Math.random() * 80 + 20;
|
|
15757
|
-
});
|
|
15758
16119
|
var ChartSkeleton$2 = function ChartSkeleton(_ref) {
|
|
15759
|
-
var
|
|
15760
|
-
theme = _ref.theme,
|
|
16120
|
+
var theme = _ref.theme,
|
|
15761
16121
|
fallback = _ref.fallback;
|
|
15762
|
-
|
|
15763
|
-
|
|
15764
|
-
|
|
15765
|
-
|
|
15766
|
-
|
|
15767
|
-
|
|
15768
|
-
|
|
15769
|
-
|
|
15770
|
-
|
|
15771
|
-
|
|
15772
|
-
|
|
15773
|
-
|
|
15774
|
-
|
|
15775
|
-
|
|
15776
|
-
|
|
15777
|
-
|
|
15778
|
-
|
|
15779
|
-
}
|
|
15780
|
-
return /*#__PURE__*/jsx("div", {
|
|
15781
|
-
className: modules_37a5ff73$5.root,
|
|
15782
|
-
children: /*#__PURE__*/jsx("div", {
|
|
16122
|
+
return /*#__PURE__*/jsxs("div", {
|
|
16123
|
+
className: classes(modules_37a5ff73$5.root, modules_37a5ff73$5["".concat(theme, "-theme")]),
|
|
16124
|
+
children: [/*#__PURE__*/jsx(Skeleton, {
|
|
16125
|
+
theme: theme,
|
|
16126
|
+
className: modules_37a5ff73$5.outer,
|
|
16127
|
+
width: "12.5rem",
|
|
16128
|
+
height: "12.5rem",
|
|
16129
|
+
variant: "circle",
|
|
16130
|
+
noAnimation: fallback
|
|
16131
|
+
}), /*#__PURE__*/jsx(Skeleton, {
|
|
16132
|
+
noAnimation: true,
|
|
16133
|
+
className: modules_37a5ff73$5.inner,
|
|
16134
|
+
width: "7.5rem",
|
|
16135
|
+
height: "7.5rem",
|
|
16136
|
+
variant: "circle"
|
|
16137
|
+
}), /*#__PURE__*/jsx(Skeleton, {
|
|
16138
|
+
noAnimation: true,
|
|
15783
16139
|
className: modules_37a5ff73$5.line,
|
|
15784
|
-
|
|
15785
|
-
|
|
15786
|
-
|
|
15787
|
-
|
|
15788
|
-
|
|
15789
|
-
|
|
15790
|
-
|
|
15791
|
-
|
|
15792
|
-
|
|
16140
|
+
width: "6.25rem"
|
|
16141
|
+
}), /*#__PURE__*/jsx(Skeleton, {
|
|
16142
|
+
noAnimation: true,
|
|
16143
|
+
className: modules_37a5ff73$5.line,
|
|
16144
|
+
width: "6.25rem"
|
|
16145
|
+
}), /*#__PURE__*/jsx(Skeleton, {
|
|
16146
|
+
noAnimation: true,
|
|
16147
|
+
className: modules_37a5ff73$5.line,
|
|
16148
|
+
width: "6.25rem"
|
|
16149
|
+
})]
|
|
15793
16150
|
});
|
|
15794
16151
|
};
|
|
15795
16152
|
|
|
15796
|
-
Chart.register(
|
|
15797
|
-
var
|
|
15798
|
-
var _seriesData$metaData
|
|
16153
|
+
Chart.register(ArcElement, Tooltip$1, Legend, Title$1);
|
|
16154
|
+
var BasePieChart = function BasePieChart(props) {
|
|
16155
|
+
var _seriesData$metaData, _seriesData$chartData, _seriesData$chartData3, _seriesData$chartData4, _doughnut$, _doughnut$2, _chartOptions$respons, _legend$display, _tooltip$borderWidth, _tooltip$callbacks, _tooltip$bodySpacing, _tooltip$displayColor, _tooltip$colorBoxWidt, _tooltip$colorBoxHeig, _tooltip$usePointStyl, _tooltip$bodyFont$tit, _tooltip$bodyFont, _tooltip$bodyFont$col, _tooltip$bodyFont2;
|
|
15799
16156
|
var loading = props.loading,
|
|
15800
16157
|
title = props.title,
|
|
16158
|
+
tittleSize = props.tittleSize,
|
|
15801
16159
|
seriesData = props.seriesData,
|
|
15802
|
-
|
|
16160
|
+
cursor = props.cursor,
|
|
15803
16161
|
legend = props.legend,
|
|
15804
|
-
|
|
15805
|
-
|
|
15806
|
-
xAxisLabel = props.xAxisLabel,
|
|
15807
|
-
yAxisLabel = props.yAxisLabel,
|
|
15808
|
-
axisLabelColor = props.axisLabelColor,
|
|
15809
|
-
stacked = props.stacked,
|
|
15810
|
-
smooth = props.smooth,
|
|
16162
|
+
style = props.style,
|
|
16163
|
+
className = props.className,
|
|
15811
16164
|
theme = props.theme,
|
|
15812
16165
|
fallback = props.fallback,
|
|
15813
|
-
|
|
15814
|
-
|
|
15815
|
-
|
|
15816
|
-
|
|
15817
|
-
|
|
15818
|
-
|
|
15819
|
-
|
|
15820
|
-
|
|
15821
|
-
|
|
15822
|
-
|
|
15823
|
-
|
|
15824
|
-
|
|
15825
|
-
lineColors = _props$lineColors === void 0 ? ['rgba(255, 99, 132, 0.5)', 'rgba(54, 162, 235, 0.5)', 'rgba(75, 192, 192, 0.5)', 'rgba(153, 102, 255, 0.5)', 'rgba(255, 159, 64, 0.5)'] : _props$lineColors,
|
|
15826
|
-
_props$borderColors = props.borderColors,
|
|
15827
|
-
borderColors = _props$borderColors === void 0 ? ['rgba(255, 99, 132, 1)', 'rgba(54, 162, 235, 1)', 'rgba(75, 192, 192, 1)', 'rgba(153, 102, 255, 1)', 'rgba(255, 159, 64, 1)'] : _props$borderColors,
|
|
15828
|
-
style = props.style,
|
|
16166
|
+
seriesOption = props.seriesOption,
|
|
16167
|
+
chartOptions = props.options,
|
|
16168
|
+
tooltip = props.tooltip,
|
|
16169
|
+
_props$width = props.width,
|
|
16170
|
+
width = _props$width === void 0 ? '100%' : _props$width,
|
|
16171
|
+
_props$height = props.height,
|
|
16172
|
+
height = _props$height === void 0 ? '100%' : _props$height,
|
|
16173
|
+
customLabel = props.customLabel,
|
|
16174
|
+
strip = props.strip,
|
|
16175
|
+
_props$doughnut = props.doughnut,
|
|
16176
|
+
doughnut = _props$doughnut === void 0 ? ['90%', '0%'] : _props$doughnut,
|
|
16177
|
+
hoverBorderWidth = props.hoverBorderWidth,
|
|
15829
16178
|
extra = props.extra;
|
|
16179
|
+
var _useState = useState([]),
|
|
16180
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
16181
|
+
excludedIndices = _useState2[0],
|
|
16182
|
+
setExcludedIndices = _useState2[1];
|
|
16183
|
+
var _useState3 = useState(null),
|
|
16184
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
16185
|
+
hoveredIndex = _useState4[0],
|
|
16186
|
+
setHoveredIndex = _useState4[1]; // Track the hovered legend index
|
|
16187
|
+
var legendRef = useRef(null); // Reference to hold the custom legend
|
|
16188
|
+
|
|
15830
16189
|
if (loading || fallback) {
|
|
15831
16190
|
return /*#__PURE__*/jsx(ChartSkeleton$2, {
|
|
15832
16191
|
theme: theme,
|
|
15833
16192
|
fallback: !loading && fallback
|
|
15834
16193
|
});
|
|
15835
16194
|
}
|
|
15836
|
-
var legendRef = useRef(null);
|
|
15837
|
-
var _useState = useState([]),
|
|
15838
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
15839
|
-
hiddenDatasets = _useState2[0],
|
|
15840
|
-
setHiddenDatasets = _useState2[1];
|
|
15841
|
-
var toggleDatasetVisibility = function toggleDatasetVisibility(index, chart) {
|
|
15842
|
-
setHiddenDatasets(function (prevHidden) {
|
|
15843
|
-
var newHidden = prevHidden.includes(index) ? prevHidden.filter(function (i) {
|
|
15844
|
-
return i !== index;
|
|
15845
|
-
}) : [].concat(_toConsumableArray(prevHidden), [index]);
|
|
15846
16195
|
|
|
15847
|
-
|
|
15848
|
-
|
|
15849
|
-
|
|
15850
|
-
|
|
15851
|
-
|
|
15852
|
-
|
|
15853
|
-
|
|
15854
|
-
|
|
15855
|
-
|
|
15856
|
-
// Clear existing legend items
|
|
15857
|
-
var ul = legendRef.current;
|
|
15858
|
-
while (ul !== null && ul !== void 0 && ul.firstChild) {
|
|
15859
|
-
ul.firstChild.remove();
|
|
16196
|
+
// Handle legend item click (exclude or un-exclude)
|
|
16197
|
+
var handleLegendClick = useCallback(function (event, legendItem) {
|
|
16198
|
+
var index = legendItem.index;
|
|
16199
|
+
setExcludedIndices(function (prevIndices) {
|
|
16200
|
+
var newIndices = _toConsumableArray(prevIndices);
|
|
16201
|
+
if (newIndices.includes(index)) {
|
|
16202
|
+
newIndices.splice(newIndices.indexOf(index), 1); // Un-exclude
|
|
16203
|
+
} else {
|
|
16204
|
+
newIndices.push(index); // Exclude
|
|
15860
16205
|
}
|
|
16206
|
+
return newIndices;
|
|
16207
|
+
});
|
|
16208
|
+
}, []);
|
|
15861
16209
|
|
|
15862
|
-
|
|
15863
|
-
|
|
15864
|
-
|
|
15865
|
-
|
|
15866
|
-
|
|
15867
|
-
|
|
15868
|
-
|
|
15869
|
-
|
|
15870
|
-
|
|
15871
|
-
|
|
15872
|
-
|
|
15873
|
-
|
|
15874
|
-
|
|
15875
|
-
var circleColor = hiddenDatasets.includes(index) ? 'grey' : dataset.backgroundColor;
|
|
15876
|
-
li.onclick = function () {
|
|
15877
|
-
// Toggle visibility of the dataset
|
|
15878
|
-
toggleDatasetVisibility(index, chart);
|
|
15879
|
-
|
|
15880
|
-
// Apply grey-out effect on click
|
|
15881
|
-
if (li.style.color === 'grey') {
|
|
15882
|
-
li.style.color = 'inherit';
|
|
15883
|
-
} else {
|
|
15884
|
-
li.style.color = 'grey';
|
|
15885
|
-
}
|
|
15886
|
-
var circle = li.querySelector('circle');
|
|
15887
|
-
if (circle) {
|
|
15888
|
-
if (circle.getAttribute('stroke') === 'grey') {
|
|
15889
|
-
circle.setAttribute('stroke', dataset.backgroundColor);
|
|
15890
|
-
} else {
|
|
15891
|
-
circle.setAttribute('stroke', 'grey');
|
|
15892
|
-
}
|
|
15893
|
-
}
|
|
15894
|
-
};
|
|
15895
|
-
li.innerHTML = "\n\t\t\t\t\t<svg width=\"15\" height=\"15\" viewBox=\"0 0 30 30\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t\t\t\t<circle cx=\"15\" cy=\"15\" r=\"12\" stroke=\"".concat(circleColor, "\" stroke-width=\"6\"/>\n\t\t\t\t\t</svg>\n\t\t\t\t<span style=\"margin-left: 10px; color: ").concat(textColor, ";\">").concat(dataset.label, "</span>\n\t\t\t\t");
|
|
15896
|
-
ul === null || ul === void 0 || ul.appendChild(li);
|
|
15897
|
-
});
|
|
15898
|
-
}
|
|
15899
|
-
};
|
|
15900
|
-
var chartData = {
|
|
15901
|
-
labels: (_seriesData$metaData$ = seriesData === null || seriesData === void 0 || (_seriesData$metaData = seriesData.metaData) === null || _seriesData$metaData === void 0 ? void 0 : _seriesData$metaData.xAxisData) !== null && _seriesData$metaData$ !== void 0 ? _seriesData$metaData$ : [],
|
|
15902
|
-
datasets: Object.keys((_seriesData$chartData = seriesData === null || seriesData === void 0 ? void 0 : seriesData.chartData) !== null && _seriesData$chartData !== void 0 ? _seriesData$chartData : {}).map(function (key, index) {
|
|
15903
|
-
var _seriesData$chartData2, _chartOptionsProps$bo, _chartOptionsProps$po, _chartOptionsProps$po2, _chartOptionsProps$po3;
|
|
15904
|
-
return {
|
|
15905
|
-
label: key,
|
|
15906
|
-
data: (_seriesData$chartData2 = seriesData === null || seriesData === void 0 ? void 0 : seriesData.chartData[key]) !== null && _seriesData$chartData2 !== void 0 ? _seriesData$chartData2 : [],
|
|
15907
|
-
fill: !isLineChart,
|
|
15908
|
-
backgroundColor: isLineChart ? 'transparent' : lineColors[index % lineColors.length],
|
|
15909
|
-
borderColor: borderColors[index % borderColors.length],
|
|
15910
|
-
tension: smooth ? 0.4 : 0,
|
|
15911
|
-
borderWidth: (_chartOptionsProps$bo = chartOptionsProps === null || chartOptionsProps === void 0 ? void 0 : chartOptionsProps.borderWidth) !== null && _chartOptionsProps$bo !== void 0 ? _chartOptionsProps$bo : 2,
|
|
15912
|
-
pointRadius: (_chartOptionsProps$po = chartOptionsProps === null || chartOptionsProps === void 0 ? void 0 : chartOptionsProps.pointRadius) !== null && _chartOptionsProps$po !== void 0 ? _chartOptionsProps$po : 4,
|
|
15913
|
-
pointHoverRadius: (_chartOptionsProps$po2 = chartOptionsProps === null || chartOptionsProps === void 0 ? void 0 : chartOptionsProps.pointHoverRadius) !== null && _chartOptionsProps$po2 !== void 0 ? _chartOptionsProps$po2 : 6,
|
|
15914
|
-
pointBackgroundColor: borderColors[index % borderColors.length],
|
|
15915
|
-
pointStyle: (_chartOptionsProps$po3 = chartOptionsProps === null || chartOptionsProps === void 0 ? void 0 : chartOptionsProps.pointStyle) !== null && _chartOptionsProps$po3 !== void 0 ? _chartOptionsProps$po3 : 'rectRot',
|
|
15916
|
-
datalabels: {
|
|
15917
|
-
display: false // Disable data labels on points
|
|
16210
|
+
// Data for the Pie Chart
|
|
16211
|
+
var data = {
|
|
16212
|
+
labels: seriesData !== null && seriesData !== void 0 && (_seriesData$metaData = seriesData.metaData) !== null && _seriesData$metaData !== void 0 && _seriesData$metaData.keyData ? Object.keys(seriesData.chartData).map(function (key) {
|
|
16213
|
+
return seriesData.metaData.keyData[key];
|
|
16214
|
+
}) : [],
|
|
16215
|
+
datasets: [{
|
|
16216
|
+
data: Object.keys((_seriesData$chartData = seriesData === null || seriesData === void 0 ? void 0 : seriesData.chartData) !== null && _seriesData$chartData !== void 0 ? _seriesData$chartData : {}).map(function (key) {
|
|
16217
|
+
var _seriesData$chartData2;
|
|
16218
|
+
return seriesData === null || seriesData === void 0 || (_seriesData$chartData2 = seriesData.chartData) === null || _seriesData$chartData2 === void 0 ? void 0 : _seriesData$chartData2[key];
|
|
16219
|
+
}),
|
|
16220
|
+
backgroundColor: seriesOption ? seriesOption.map(function (option, index) {
|
|
16221
|
+
if (hoveredIndex !== null && hoveredIndex !== index) {
|
|
16222
|
+
return '#D3D3D3'; // Grey out others when hovering a legend item
|
|
15918
16223
|
}
|
|
15919
|
-
|
|
15920
|
-
|
|
16224
|
+
return excludedIndices.includes(index) ? '#D3D3D3' // Grey for excluded items
|
|
16225
|
+
: option.itemStyle.color; // Normal color for other slices
|
|
16226
|
+
}) : Object.keys((_seriesData$chartData3 = seriesData === null || seriesData === void 0 ? void 0 : seriesData.chartData) !== null && _seriesData$chartData3 !== void 0 ? _seriesData$chartData3 : {}).map(function (_, index) {
|
|
16227
|
+
var defaultColors = ['#FF6384', '#36A2EB', '#FFCE56', '#4BC0C0', '#9966FF', '#FF9F40'];
|
|
16228
|
+
if (hoveredIndex !== null && hoveredIndex !== index) {
|
|
16229
|
+
return '#D3D3D3'; // Grey out others when hovering a legend item
|
|
16230
|
+
}
|
|
16231
|
+
return excludedIndices.includes(index) ? '#D3D3D3' // Grey for excluded items
|
|
16232
|
+
: defaultColors[index % defaultColors.length]; // Normal color for other slices
|
|
16233
|
+
}),
|
|
16234
|
+
borderColor: seriesOption ? seriesOption.map(function (option, index) {
|
|
16235
|
+
return excludedIndices.includes(index) ? '#D3D3D3' // Grey for excluded items
|
|
16236
|
+
: option.itemStyle.color; // Normal color for other borders
|
|
16237
|
+
}) : Object.keys((_seriesData$chartData4 = seriesData === null || seriesData === void 0 ? void 0 : seriesData.chartData) !== null && _seriesData$chartData4 !== void 0 ? _seriesData$chartData4 : {}).map(function (_, index) {
|
|
16238
|
+
var defaultColors = ['#FF6384', '#36A2EB', '#FFCE56', '#4BC0C0', '#9966FF', '#FF9F40'];
|
|
16239
|
+
return excludedIndices.includes(index) ? '#D3D3D3' // Grey for excluded items
|
|
16240
|
+
: defaultColors[index % defaultColors.length]; // Normal color for other borders
|
|
16241
|
+
}),
|
|
16242
|
+
hoverBorderWidth: hoverBorderWidth,
|
|
16243
|
+
hoverOffset: function hoverOffset(context) {
|
|
16244
|
+
var index = context.dataIndex;
|
|
16245
|
+
// Set hoverOffset to 30 for the hovered pie slice, whether from the legend or chart hover
|
|
16246
|
+
return hoveredIndex === index ? 30 : 0;
|
|
16247
|
+
},
|
|
16248
|
+
radius: (_doughnut$ = doughnut === null || doughnut === void 0 ? void 0 : doughnut[0]) !== null && _doughnut$ !== void 0 ? _doughnut$ : '100%',
|
|
16249
|
+
cutout: (_doughnut$2 = doughnut === null || doughnut === void 0 ? void 0 : doughnut[1]) !== null && _doughnut$2 !== void 0 ? _doughnut$2 : '0%'
|
|
16250
|
+
}]
|
|
15921
16251
|
};
|
|
15922
|
-
var
|
|
15923
|
-
|
|
16252
|
+
var handleHover = function handleHover(index) {
|
|
16253
|
+
setHoveredIndex(index);
|
|
16254
|
+
};
|
|
16255
|
+
var options = _objectSpread2({
|
|
16256
|
+
responsive: (_chartOptions$respons = chartOptions === null || chartOptions === void 0 ? void 0 : chartOptions.responsive) !== null && _chartOptions$respons !== void 0 ? _chartOptions$respons : true,
|
|
15924
16257
|
maintainAspectRatio: false,
|
|
15925
16258
|
plugins: {
|
|
16259
|
+
datalabels: {
|
|
16260
|
+
display: false
|
|
16261
|
+
},
|
|
15926
16262
|
legend: legend !== null && legend !== void 0 && legend.icon ? {
|
|
15927
16263
|
display: false
|
|
15928
16264
|
} : _objectSpread2({
|
|
15929
16265
|
display: (_legend$display = legend === null || legend === void 0 ? void 0 : legend.display) !== null && _legend$display !== void 0 ? _legend$display : true,
|
|
15930
|
-
position:
|
|
16266
|
+
position: 'right',
|
|
16267
|
+
align: 'center',
|
|
15931
16268
|
labels: {
|
|
15932
|
-
|
|
15933
|
-
boxWidth: 9,
|
|
15934
|
-
// Adjust width for a circular appearance
|
|
15935
|
-
boxHeight: 9,
|
|
15936
|
-
// Adjust height for a circular appearance
|
|
15937
|
-
borderRadius: 50,
|
|
15938
|
-
// Ensure the shape is circular
|
|
16269
|
+
boxWidth: 10,
|
|
15939
16270
|
padding: 10,
|
|
15940
|
-
//
|
|
15941
|
-
|
|
15942
|
-
|
|
16271
|
+
// borderWidth: 0,
|
|
16272
|
+
// borderColor: 'white',
|
|
16273
|
+
color: function color(context) {
|
|
16274
|
+
var index = context.index;
|
|
16275
|
+
return hoveredIndex !== null && hoveredIndex !== index ? '#D3D3D3' : excludedIndices.includes(index) ? '#D3D3D3' : 'black';
|
|
16276
|
+
},
|
|
15943
16277
|
font: {
|
|
15944
16278
|
family: 'Poppins'
|
|
15945
16279
|
}
|
|
16280
|
+
},
|
|
16281
|
+
onClick: function onClick(event, legendItem) {
|
|
16282
|
+
handleLegendClick(event, legendItem);
|
|
16283
|
+
handleHover(legendItem.index); // Set hover on legend click
|
|
16284
|
+
},
|
|
16285
|
+
onHover: function onHover(event, legendItem) {
|
|
16286
|
+
handleHover(legendItem.index);
|
|
16287
|
+
},
|
|
16288
|
+
onLeave: function onLeave() {
|
|
16289
|
+
setHoveredIndex(null);
|
|
15946
16290
|
}
|
|
15947
16291
|
}, legend),
|
|
16292
|
+
title: {
|
|
16293
|
+
display: !!title,
|
|
16294
|
+
text: title,
|
|
16295
|
+
padding: {
|
|
16296
|
+
top: 10,
|
|
16297
|
+
bottom: 10
|
|
16298
|
+
},
|
|
16299
|
+
font: {
|
|
16300
|
+
family: 'Poppins',
|
|
16301
|
+
size: tittleSize !== null && tittleSize !== void 0 ? tittleSize : 16
|
|
16302
|
+
}
|
|
16303
|
+
},
|
|
15948
16304
|
tooltip: _objectSpread2({
|
|
15949
16305
|
borderWidth: (_tooltip$borderWidth = tooltip === null || tooltip === void 0 ? void 0 : tooltip.borderWidth) !== null && _tooltip$borderWidth !== void 0 ? _tooltip$borderWidth : 1,
|
|
15950
16306
|
borderColor: function borderColor(context) {
|
|
15951
|
-
var _context$tooltipItems;
|
|
15952
|
-
var
|
|
16307
|
+
var _context$tooltipItems, _context$tooltipItems2;
|
|
16308
|
+
var index = context === null || context === void 0 || (_context$tooltipItems = context.tooltipItems[0]) === null || _context$tooltipItems === void 0 ? void 0 : _context$tooltipItems.dataIndex;
|
|
16309
|
+
var segmentColor = context === null || context === void 0 || (_context$tooltipItems2 = context.tooltipItems[0]) === null || _context$tooltipItems2 === void 0 || (_context$tooltipItems2 = _context$tooltipItems2.dataset) === null || _context$tooltipItems2 === void 0 ? void 0 : _context$tooltipItems2.borderColor[index];
|
|
15953
16310
|
return segmentColor || 'black';
|
|
15954
16311
|
},
|
|
15955
16312
|
backgroundColor: 'rgba(255, 255, 255, 1)',
|
|
15956
16313
|
callbacks: (_tooltip$callbacks = tooltip === null || tooltip === void 0 ? void 0 : tooltip.callbacks) !== null && _tooltip$callbacks !== void 0 ? _tooltip$callbacks : {
|
|
15957
16314
|
label: function label(context) {
|
|
15958
|
-
var
|
|
15959
|
-
var
|
|
15960
|
-
var value = context === null || context === void 0 ? void 0 : context.formattedValue;
|
|
16315
|
+
var label = context.label || '';
|
|
16316
|
+
var value = context.raw;
|
|
15961
16317
|
return "".concat(label, ": ").concat(value);
|
|
15962
16318
|
},
|
|
15963
16319
|
title: tooltip.displayTitle ? function (tooltipItems) {
|
|
@@ -15976,114 +16332,187 @@ var BaseAreaChart = function BaseAreaChart(props) {
|
|
|
15976
16332
|
titleColor: (_tooltip$bodyFont$tit = tooltip === null || tooltip === void 0 || (_tooltip$bodyFont = tooltip.bodyFont) === null || _tooltip$bodyFont === void 0 ? void 0 : _tooltip$bodyFont.titleColor) !== null && _tooltip$bodyFont$tit !== void 0 ? _tooltip$bodyFont$tit : '#000',
|
|
15977
16333
|
bodyColor: (_tooltip$bodyFont$col = tooltip === null || tooltip === void 0 || (_tooltip$bodyFont2 = tooltip.bodyFont) === null || _tooltip$bodyFont2 === void 0 ? void 0 : _tooltip$bodyFont2.color) !== null && _tooltip$bodyFont$col !== void 0 ? _tooltip$bodyFont$col : '#000',
|
|
15978
16334
|
bodyFont: _objectSpread2({}, tooltip.bodyFont)
|
|
15979
|
-
}, tooltip)
|
|
15980
|
-
|
|
15981
|
-
|
|
15982
|
-
|
|
15983
|
-
|
|
15984
|
-
|
|
15985
|
-
|
|
15986
|
-
|
|
15987
|
-
|
|
15988
|
-
|
|
16335
|
+
}, tooltip)
|
|
16336
|
+
},
|
|
16337
|
+
interaction: {
|
|
16338
|
+
mode: 'nearest',
|
|
16339
|
+
axis: 'x',
|
|
16340
|
+
intersect: true
|
|
16341
|
+
},
|
|
16342
|
+
onHover: function onHover(event, chartElement) {
|
|
16343
|
+
if (chartElement[0]) {
|
|
16344
|
+
var hoveredIndexx = chartElement[0].index;
|
|
16345
|
+
handleHover(hoveredIndexx);
|
|
16346
|
+
} else {
|
|
16347
|
+
setHoveredIndex(null);
|
|
15989
16348
|
}
|
|
15990
16349
|
},
|
|
15991
|
-
|
|
15992
|
-
|
|
15993
|
-
|
|
15994
|
-
|
|
15995
|
-
|
|
15996
|
-
|
|
15997
|
-
title: {
|
|
15998
|
-
display: !!xAxisLabel,
|
|
15999
|
-
text: xAxisLabel,
|
|
16000
|
-
color: axisLabelColor || COLORS.grey,
|
|
16001
|
-
font: {
|
|
16002
|
-
size: 14,
|
|
16003
|
-
family: 'Poppins'
|
|
16004
|
-
}
|
|
16005
|
-
},
|
|
16006
|
-
grid: {
|
|
16007
|
-
display: xSplitLineShow,
|
|
16008
|
-
color: axisSplitColor,
|
|
16009
|
-
lineWidth: 1,
|
|
16010
|
-
drawOnChartArea: true,
|
|
16011
|
-
drawBorder: false,
|
|
16012
|
-
// Disable drawing grid lines on the border to allow full-length lines
|
|
16013
|
-
tickLength: 30 // Adjust this value to control the length of the grid lines
|
|
16014
|
-
},
|
|
16015
|
-
ticks: {
|
|
16016
|
-
color: axisLabelColor || COLORS.grey,
|
|
16017
|
-
font: {
|
|
16018
|
-
family: 'Poppins'
|
|
16019
|
-
},
|
|
16020
|
-
stepSize: 100
|
|
16021
|
-
},
|
|
16022
|
-
borderColor: xAxisLineShow ? 'rgba(0, 0, 0, 0)' : 'rgba(0, 0, 0, 0)',
|
|
16023
|
-
borderWidth: xAxisLineShow ? 1 : 0
|
|
16024
|
-
}, xAxis),
|
|
16025
|
-
y: _objectSpread2({
|
|
16026
|
-
display: yAxisLabelShow,
|
|
16027
|
-
// Whether to display y-axis labels
|
|
16028
|
-
stacked: stacked,
|
|
16029
|
-
// Stack bars if applicable
|
|
16030
|
-
title: {
|
|
16031
|
-
display: !!yAxisLabel,
|
|
16032
|
-
// Display y-axis title if set
|
|
16033
|
-
text: yAxisLabel,
|
|
16034
|
-
color: axisLabelColor || COLORS.grey,
|
|
16035
|
-
font: {
|
|
16036
|
-
size: 14,
|
|
16037
|
-
family: 'Poppins'
|
|
16038
|
-
}
|
|
16039
|
-
},
|
|
16040
|
-
grid: {
|
|
16041
|
-
display: true,
|
|
16042
|
-
color: axisSplitColor
|
|
16043
|
-
},
|
|
16044
|
-
ticks: {
|
|
16045
|
-
color: axisLabelColor || COLORS.grey,
|
|
16046
|
-
stepSize: 100,
|
|
16047
|
-
font: {
|
|
16048
|
-
family: 'Poppins'
|
|
16049
|
-
},
|
|
16050
|
-
callback: (_yAxis$callback = yAxis === null || yAxis === void 0 ? void 0 : yAxis.callback) !== null && _yAxis$callback !== void 0 ? _yAxis$callback : function (value) {
|
|
16051
|
-
return value;
|
|
16052
|
-
}
|
|
16053
|
-
}
|
|
16054
|
-
}, yAxis)
|
|
16350
|
+
onLeave: function onLeave() {
|
|
16351
|
+
setHoveredIndex(null);
|
|
16352
|
+
},
|
|
16353
|
+
animations: {
|
|
16354
|
+
animateRotate: false,
|
|
16355
|
+
animateScale: false
|
|
16055
16356
|
},
|
|
16056
16357
|
elements: {
|
|
16057
|
-
|
|
16058
|
-
|
|
16059
|
-
|
|
16060
|
-
},
|
|
16061
|
-
point: {
|
|
16062
|
-
display: false,
|
|
16063
|
-
radius: 0
|
|
16358
|
+
arc: {
|
|
16359
|
+
borderWidth: 0,
|
|
16360
|
+
hoverOffset: 30
|
|
16064
16361
|
}
|
|
16065
16362
|
},
|
|
16066
|
-
|
|
16067
|
-
|
|
16068
|
-
|
|
16069
|
-
|
|
16070
|
-
|
|
16071
|
-
|
|
16072
|
-
|
|
16363
|
+
layout: {
|
|
16364
|
+
padding: {
|
|
16365
|
+
top: 10,
|
|
16366
|
+
bottom: 10,
|
|
16367
|
+
left: 10,
|
|
16368
|
+
right: 10
|
|
16369
|
+
}
|
|
16370
|
+
}
|
|
16371
|
+
}, chartOptions);
|
|
16372
|
+
var centerTextPlugin = {
|
|
16373
|
+
id: 'centerText',
|
|
16374
|
+
afterDatasetsDraw: function afterDatasetsDraw(chart) {
|
|
16375
|
+
var _customLabel$valueSty, _customLabel$valueSty2, _customLabel$valueSty3, _customLabel$margin, _customLabel$labelSty, _customLabel$labelSty2, _customLabel$labelSty3, _customLabel$labelSty4, _customLabel$labelSty5;
|
|
16376
|
+
var ctx = chart.ctx,
|
|
16377
|
+
_chart$chartArea = chart.chartArea,
|
|
16378
|
+
left = _chart$chartArea.left,
|
|
16379
|
+
right = _chart$chartArea.right,
|
|
16380
|
+
top = _chart$chartArea.top,
|
|
16381
|
+
bottom = _chart$chartArea.bottom;
|
|
16382
|
+
ctx.save();
|
|
16383
|
+
|
|
16384
|
+
// Center text styling and positioning
|
|
16385
|
+
ctx.font = "".concat(customLabel === null || customLabel === void 0 || (_customLabel$valueSty = customLabel.valueStyles) === null || _customLabel$valueSty === void 0 ? void 0 : _customLabel$valueSty.fontStyle, " ").concat(customLabel === null || customLabel === void 0 || (_customLabel$valueSty2 = customLabel.valueStyles) === null || _customLabel$valueSty2 === void 0 ? void 0 : _customLabel$valueSty2.fontSize, " Poppins");
|
|
16386
|
+
ctx.textAlign = 'center';
|
|
16387
|
+
ctx.textBaseline = 'middle';
|
|
16388
|
+
ctx.fillStyle = customLabel === null || customLabel === void 0 || (_customLabel$valueSty3 = customLabel.valueStyles) === null || _customLabel$valueSty3 === void 0 ? void 0 : _customLabel$valueSty3.color;
|
|
16389
|
+
|
|
16390
|
+
// Calculate the center position of the chart
|
|
16391
|
+
var centerX = (left + right) / 2;
|
|
16392
|
+
var centerY = (top + bottom) / 2;
|
|
16393
|
+
|
|
16394
|
+
// Render the center text
|
|
16395
|
+
ctx.fillText("".concat(customLabel === null || customLabel === void 0 ? void 0 : customLabel.id), centerX, centerY);
|
|
16396
|
+
|
|
16397
|
+
// Render the compliance title with bottom margin
|
|
16398
|
+
var titleBottomMargin = (_customLabel$margin = customLabel.margin) !== null && _customLabel$margin !== void 0 ? _customLabel$margin : 10; // Adjust this value for bottom margin
|
|
16399
|
+
var position = (_customLabel$labelSty = customLabel === null || customLabel === void 0 || (_customLabel$labelSty2 = customLabel.labelStyles) === null || _customLabel$labelSty2 === void 0 ? void 0 : _customLabel$labelSty2.position) !== null && _customLabel$labelSty !== void 0 ? _customLabel$labelSty : 5;
|
|
16400
|
+
var titleYPosition = centerY + position; // Default title Y position
|
|
16401
|
+
ctx.font = "".concat(customLabel === null || customLabel === void 0 || (_customLabel$labelSty3 = customLabel.labelStyles) === null || _customLabel$labelSty3 === void 0 ? void 0 : _customLabel$labelSty3.fontStyle, " ").concat(customLabel === null || customLabel === void 0 || (_customLabel$labelSty4 = customLabel.labelStyles) === null || _customLabel$labelSty4 === void 0 ? void 0 : _customLabel$labelSty4.fontSize, " Poppins"); // Title font style
|
|
16402
|
+
ctx.fillStyle = "".concat(customLabel === null || customLabel === void 0 || (_customLabel$labelSty5 = customLabel.labelStyles) === null || _customLabel$labelSty5 === void 0 ? void 0 : _customLabel$labelSty5.color); // Title text color (gray)
|
|
16403
|
+
ctx.fillText("".concat(customLabel === null || customLabel === void 0 ? void 0 : customLabel.title), centerX, titleYPosition + titleBottomMargin);
|
|
16404
|
+
|
|
16405
|
+
// Render compliance strip if `complianceStrip` is true
|
|
16406
|
+
if (strip) {
|
|
16407
|
+
var _strip$stripSize, _strip$stripWidth, _strip$startColor, _strip$endColor;
|
|
16408
|
+
var stripRadius = (_strip$stripSize = strip === null || strip === void 0 ? void 0 : strip.stripSize) !== null && _strip$stripSize !== void 0 ? _strip$stripSize : 35; // Radius for the outer ring
|
|
16409
|
+
var stripThickness = (_strip$stripWidth = strip === null || strip === void 0 ? void 0 : strip.stripWidth) !== null && _strip$stripWidth !== void 0 ? _strip$stripWidth : 7; // Thickness of the strip
|
|
16410
|
+
var compliancePercentage = customLabel === null || customLabel === void 0 ? void 0 : customLabel.value; // Set compliance percentage
|
|
16411
|
+
|
|
16412
|
+
// Fixed start and end angles
|
|
16413
|
+
var startAngle = 130 * Math.PI / 180; // Convert degrees to radians
|
|
16414
|
+
var endAngle = 55 * Math.PI / 180; // Convert degrees to radians
|
|
16415
|
+
|
|
16416
|
+
// Total angle of the arc (adjusting for crossing 360 degrees)
|
|
16417
|
+
var totalAngle = endAngle - startAngle;
|
|
16418
|
+
if (totalAngle < 0) {
|
|
16419
|
+
totalAngle += 2 * Math.PI; // Ensure positive value for angles crossing 360
|
|
16420
|
+
}
|
|
16421
|
+
|
|
16422
|
+
// Calculate the compliance angle based on the percentage
|
|
16423
|
+
var complianceAngle = compliancePercentage / 100 * totalAngle;
|
|
16424
|
+
var complianceEndAngle = startAngle + complianceAngle;
|
|
16425
|
+
|
|
16426
|
+
// Set line join for rounded edges
|
|
16427
|
+
ctx.lineJoin = 'round';
|
|
16428
|
+
|
|
16429
|
+
// Draw the compliance strip (colored section)
|
|
16430
|
+
var gradient = ctx.createLinearGradient(centerX - stripRadius, centerY - stripRadius, centerX + stripRadius, centerY + stripRadius);
|
|
16431
|
+
gradient.addColorStop(0, (_strip$startColor = strip === null || strip === void 0 ? void 0 : strip.startColor) !== null && _strip$startColor !== void 0 ? _strip$startColor : '#4CAF50'); // Start color
|
|
16432
|
+
gradient.addColorStop(1, (_strip$endColor = strip === null || strip === void 0 ? void 0 : strip.endColor) !== null && _strip$endColor !== void 0 ? _strip$endColor : '#FFC107'); // End color
|
|
16433
|
+
|
|
16434
|
+
ctx.beginPath();
|
|
16435
|
+
ctx.arc(centerX, centerY, stripRadius + stripThickness, startAngle, complianceEndAngle);
|
|
16436
|
+
ctx.lineWidth = stripThickness;
|
|
16437
|
+
ctx.strokeStyle = gradient;
|
|
16438
|
+
ctx.stroke();
|
|
16439
|
+
|
|
16440
|
+
// Draw the remaining section (grey color)
|
|
16441
|
+
ctx.beginPath();
|
|
16442
|
+
ctx.arc(centerX, centerY, stripRadius + stripThickness, complianceEndAngle, startAngle + totalAngle);
|
|
16443
|
+
ctx.lineWidth = stripThickness;
|
|
16444
|
+
ctx.strokeStyle = '#B7CADB'; // Grey color
|
|
16445
|
+
ctx.stroke();
|
|
16446
|
+
}
|
|
16447
|
+
ctx.restore();
|
|
16448
|
+
}
|
|
16449
|
+
};
|
|
16450
|
+
var customLegendPlugin = {
|
|
16451
|
+
id: 'customLegend',
|
|
16452
|
+
afterUpdate: function afterUpdate(chart) {
|
|
16453
|
+
var ul = legendRef.current;
|
|
16454
|
+
while (ul !== null && ul !== void 0 && ul.firstChild) {
|
|
16455
|
+
ul.firstChild.remove();
|
|
16456
|
+
}
|
|
16457
|
+
chart.data.labels.forEach(function (label, index) {
|
|
16458
|
+
var li = document.createElement('li');
|
|
16459
|
+
li.style.display = 'flex';
|
|
16460
|
+
li.style.alignItems = 'center';
|
|
16461
|
+
li.style.cursor = 'pointer';
|
|
16462
|
+
|
|
16463
|
+
// Get the color for the current pie slice
|
|
16464
|
+
var sliceColor = chart.data.datasets[0].backgroundColor[index];
|
|
16465
|
+
|
|
16466
|
+
// Handle click for excluding/un-excluding slices
|
|
16467
|
+
li.onclick = function (event) {
|
|
16468
|
+
var legendItem = {
|
|
16469
|
+
index: index
|
|
16470
|
+
}; // Simulate legend item
|
|
16471
|
+
handleLegendClick(event, legendItem); // Handle click
|
|
16472
|
+
handleHover(index); // Set hover on legend click
|
|
16473
|
+
chart.update('none'); // Update the chart without animation
|
|
16474
|
+
};
|
|
16475
|
+
|
|
16476
|
+
// Handle hover on the legend item
|
|
16477
|
+
li.onmouseenter = function () {
|
|
16478
|
+
handleHover(index); // Set hover on legend hover
|
|
16479
|
+
chart.update('none'); // Update the chart without animation
|
|
16480
|
+
};
|
|
16481
|
+
|
|
16482
|
+
// Handle leave event to remove hover effect
|
|
16483
|
+
li.onmouseleave = function () {
|
|
16484
|
+
setHoveredIndex(null);
|
|
16485
|
+
chart.update('none');
|
|
16486
|
+
};
|
|
16487
|
+
|
|
16488
|
+
// Apply grey color dynamically based on the hovered state
|
|
16489
|
+
var isGreyedOut = hoveredIndex !== null && hoveredIndex !== index;
|
|
16490
|
+
var displayColor = isGreyedOut ? '#D3D3D3' : sliceColor;
|
|
16491
|
+
li.innerHTML = "\n\t\t\t\t<svg width=\"15\" height=\"15\" viewBox=\"0 0 30 30\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t\t\t<circle cx=\"15\" cy=\"15\" r=\"12\" stroke=\"".concat(displayColor, "\" stroke-width=\"6\"/>\n\t\t\t\t</svg>\n\t\t\t\t<span style=\"margin-left: 10px;\">").concat(label, "</span>\n\t\t\t");
|
|
16492
|
+
ul.appendChild(li);
|
|
16493
|
+
});
|
|
16494
|
+
}
|
|
16495
|
+
};
|
|
16073
16496
|
return /*#__PURE__*/jsxs("div", {
|
|
16497
|
+
className: classes(modules_c20882aa.root, className),
|
|
16498
|
+
onMouseLeave: function onMouseLeave() {
|
|
16499
|
+
setHoveredIndex(null);
|
|
16500
|
+
},
|
|
16074
16501
|
style: _objectSpread2({
|
|
16075
|
-
width: width
|
|
16076
|
-
height: height
|
|
16502
|
+
width: width,
|
|
16503
|
+
height: height === '100%' ? '90%' : height,
|
|
16077
16504
|
display: 'flex',
|
|
16078
|
-
|
|
16505
|
+
flexDirection: 'row',
|
|
16506
|
+
alignItems: 'center',
|
|
16507
|
+
cursor: cursor
|
|
16079
16508
|
}, style),
|
|
16080
|
-
children: [/*#__PURE__*/jsx(
|
|
16081
|
-
data:
|
|
16082
|
-
options:
|
|
16083
|
-
plugins: [customLegendPlugin]
|
|
16509
|
+
children: [/*#__PURE__*/jsx(Pie, _objectSpread2({
|
|
16510
|
+
data: data,
|
|
16511
|
+
options: _objectSpread2({}, options),
|
|
16512
|
+
plugins: [customLabel && centerTextPlugin, (legend === null || legend === void 0 ? void 0 : legend.icon) && (legend === null || legend === void 0 ? void 0 : legend.display) && customLegendPlugin].filter(Boolean)
|
|
16084
16513
|
}, extra)), (legend === null || legend === void 0 ? void 0 : legend.icon) && (legend === null || legend === void 0 ? void 0 : legend.display) && /*#__PURE__*/jsx("ul", {
|
|
16085
|
-
|
|
16086
|
-
|
|
16514
|
+
style: _objectSpread2({}, legend === null || legend === void 0 ? void 0 : legend.legendStyles),
|
|
16515
|
+
ref: legendRef
|
|
16087
16516
|
})]
|
|
16088
16517
|
});
|
|
16089
16518
|
};
|
|
@@ -26518,5 +26947,5 @@ var BaseWidget = /*#__PURE__*/forwardRef(function BaseWidget(props, ref) {
|
|
|
26518
26947
|
});
|
|
26519
26948
|
});
|
|
26520
26949
|
|
|
26521
|
-
export { Accordion, Alert$1 as Alert, AlertIcon, Alert as AlertV2, AngleDouble as AngleDoubleIcon, AreaChartIcon, Arrow as ArrowIcon, BarChartIcon, BaseAreaChart$1 as BaseAreaChart, BaseAreaChart as BaseAreaChartV2, BaseBarChart as BaseBarChartV2, BaseButton, BaseCell, BaseHorizontalBarChart, BaseModal, BasePieChart$1 as BasePieChart, BasePieChart as BasePieChartV2, BaseRegionChart, BaseSidePanel, BaseTable$1 as BaseTable, BaseTable as BaseTableV2, BaseVerticalBarChart, BaseWidget, BreadCrumbs$1 as BreadCrumbs, BreadCrumbs as BreadCrumbsv2, BreadcrumbSeparator as BreadcrumbSeperatorIcon, Button, COLORS, Calender$1 as CalenderIcon, Callout, CapsuleChart, CapsuleChartIcon, Caret as CaretIcon, Checkbox, CheckboxIcon, Chevron as ChevronIcon, Chip, Clock as ClockIcon, Close as CloseIcon, CodeSnippet, ColumnFilter, Columns as ColumnsIcon, Copy as CopyIcon, Cross as CrossIcon, CustomPaginationList$1 as CustomPaginationList, DatePicker, Delete as DeleteIcon, DialogBox, DisplayPicture, Download as DownloadIcon, Dropdown$1 as Dropdown, DropdownIcon, DropdownItem$1 as DropdownItem, DropdownItem as DropdownItemv2, Dropdown as Dropdownv2, Edit as EditIcon, Email as EmailIcon, ExpandArrowAlt as ExpandArrowAltIcon, Filter as FilterIcon, FlowChart as FlowChartIcon, FullScreen as FullScreenIcon, HalfShade as HalfShadeIcon, HeatMapChart, HidePassword as HidePasswordIcon, HierarchyBrowser, HierarchyItem, Home as HomeIcon, Info as InfoIcon, LineChartIcon, Link, MagnifyingGlass as MagnifyingGlassIcon, MarkerIcon, Maximize as MaximizeIcon, NestedPieChart, FilterIcon as NewFilterIcon, Nut as NutIcon, PageHeader, Pagination$1 as Pagination, PaginationList$1 as PaginationList, Password as PasswordIcon, PieChartIcon, Plus as PlusIcon, Popover, Popper, Radio, RadioIcon, Refresh as RefreshIcon, Reset as ResetIcon, RichEditor as RichTextEditor, SearchIcon, Server as ServerIcon, Settings as SettingsIcon, Skeleton, Slider, Sort as SortIcon, StackedPieChart, StackedPieChartIcon, Step, Stepper, Switch, Table$1 as Table, TableCell$1 as TableCell, TableCell as TableCellV2, TableColumn, TableColumnV2, TableFilters$1 as TableFilters, Table as TableV2, Tabs, Text, TextField, TextField$1 as TextFieldv2, Tick as TickIcon, Toggle, Tooltip, Trash as TrashIcon, UnlockPassword as UnlockPasswordIcon, View as ViewIcon, ViewPasswordIcon, _areTwinObjects as areTwinObjects, classes, cloneDeep, defaultProps, doubleDigitted, epochToFormattedDate, generateColors, get, getCSSVariableValue, getCurrentSearchParams, getCustomPagination$1 as getCustomPagination, getDateFromEpoch, getDatesInAMonth, getDatesInStringFormat, getDayInfo, getDuplicatesSansArray, getInitialsOfName, getJSDateFromEpoch, getPagination$1 as getPagination, getSpacedDisplayName, getTimeFromEpoch, inputHelper, isEmptyHtmlString, propTypes, safeJSONParse, sanitizeJSON, stringToPath, sumArrayOfObjects, uniqueArray, uniqueArrayOfObjects, useOutsideClickListener, usePagination, useResize };
|
|
26950
|
+
export { Accordion, Alert$1 as Alert, AlertIcon, Alert as AlertV2, AngleDouble as AngleDoubleIcon, AreaChartIcon, Arrow as ArrowIcon, BarChartIcon, BaseAreaChart$1 as BaseAreaChart, BaseAreaChart as BaseAreaChartV2, BaseBarChart as BaseBarChartV2, BaseButton, BaseCell, BaseHorizontalBarChart, BaseModal, BasePieChart$1 as BasePieChart, BasePieChart as BasePieChartV2, BaseRegionChart, BaseSidePanel, BaseTable$1 as BaseTable, BaseTable as BaseTableV2, BaseVerticalBarChart, BaseWidget, BreadCrumbs$1 as BreadCrumbs, BreadCrumbs as BreadCrumbsv2, BreadcrumbSeparator as BreadcrumbSeperatorIcon, Button, COLORS, Calender$1 as CalenderIcon, Callout, CapsuleChart$1 as CapsuleChart, CapsuleChartIcon, CapsuleChart as CapsuleChartV2, Caret as CaretIcon, Checkbox, CheckboxIcon, Chevron as ChevronIcon, Chip, Clock as ClockIcon, Close as CloseIcon, CodeSnippet, ColumnFilter, Columns as ColumnsIcon, Copy as CopyIcon, Cross as CrossIcon, CustomPaginationList$1 as CustomPaginationList, DatePicker, Delete as DeleteIcon, DialogBox, DisplayPicture, Download as DownloadIcon, Dropdown$1 as Dropdown, DropdownIcon, DropdownItem$1 as DropdownItem, DropdownItem as DropdownItemv2, Dropdown as Dropdownv2, Edit as EditIcon, Email as EmailIcon, ExpandArrowAlt as ExpandArrowAltIcon, Filter as FilterIcon, FlowChart as FlowChartIcon, FullScreen as FullScreenIcon, HalfShade as HalfShadeIcon, HeatMapChart, HidePassword as HidePasswordIcon, HierarchyBrowser, HierarchyItem, Home as HomeIcon, Info as InfoIcon, LineChartIcon, Link, MagnifyingGlass as MagnifyingGlassIcon, MarkerIcon, Maximize as MaximizeIcon, NestedPieChart, CapsulePolarChart as NestedPieChartV2, FilterIcon as NewFilterIcon, Nut as NutIcon, PageHeader, Pagination$1 as Pagination, PaginationList$1 as PaginationList, Password as PasswordIcon, PieChartIcon, Plus as PlusIcon, Popover, Popper, Radio, RadioIcon, Refresh as RefreshIcon, Reset as ResetIcon, RichEditor as RichTextEditor, SearchIcon, Server as ServerIcon, Settings as SettingsIcon, Skeleton, Slider, Sort as SortIcon, StackedPieChart, StackedPieChartIcon, Step, Stepper, Switch, Table$1 as Table, TableCell$1 as TableCell, TableCell as TableCellV2, TableColumn, TableColumnV2, TableFilters$1 as TableFilters, Table as TableV2, Tabs, Text, TextField, TextField$1 as TextFieldv2, Tick as TickIcon, Toggle, Tooltip, Trash as TrashIcon, UnlockPassword as UnlockPasswordIcon, View as ViewIcon, ViewPasswordIcon, _areTwinObjects as areTwinObjects, classes, cloneDeep, defaultProps, doubleDigitted, epochToFormattedDate, generateColors, get, getCSSVariableValue, getCurrentSearchParams, getCustomPagination$1 as getCustomPagination, getDateFromEpoch, getDatesInAMonth, getDatesInStringFormat, getDayInfo, getDuplicatesSansArray, getInitialsOfName, getJSDateFromEpoch, getPagination$1 as getPagination, getSpacedDisplayName, getTimeFromEpoch, inputHelper, isEmptyHtmlString, propTypes, safeJSONParse, sanitizeJSON, stringToPath, sumArrayOfObjects, uniqueArray, uniqueArrayOfObjects, useOutsideClickListener, usePagination, useResize };
|
|
26522
26951
|
//# sourceMappingURL=index.js.map
|