@aivenio/aquarium 1.57.1 → 1.58.1
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/_variables.scss +1 -1
- package/dist/charts.cjs +104 -42
- package/dist/charts.mjs +104 -42
- package/dist/src/charts/AreaChart/AreaChart.d.ts +2 -1
- package/dist/src/charts/AreaChart/AreaChart.js +15 -3
- package/dist/src/charts/BarChart/BarChart.d.ts +2 -1
- package/dist/src/charts/BarChart/BarChart.js +15 -3
- package/dist/src/charts/Container/Container.d.ts +11 -1
- package/dist/src/charts/Container/Container.js +25 -2
- package/dist/src/charts/LineChart/LineChart.d.ts +2 -1
- package/dist/src/charts/LineChart/LineChart.js +15 -3
- package/dist/src/charts/PieChart/DoughnutChart.d.ts +2 -1
- package/dist/src/charts/PieChart/DoughnutChart.js +15 -3
- package/dist/src/charts/PieChart/PieChart.d.ts +2 -1
- package/dist/src/charts/PieChart/PieChart.js +15 -3
- package/dist/src/molecules/Combobox/Combobox.js +4 -2
- package/dist/styles.css +17 -0
- package/dist/system.cjs +2 -0
- package/dist/system.mjs +2 -0
- package/dist/tsconfig.module.tsbuildinfo +1 -1
- package/dist/types/tailwindGenerated.d.ts +1 -1
- package/package.json +1 -1
package/dist/_variables.scss
CHANGED
package/dist/charts.cjs
CHANGED
@@ -2055,10 +2055,75 @@ var Axis = {
|
|
2055
2055
|
// src/charts/Container/Container.tsx
|
2056
2056
|
var import_react2 = __toESM(require("react"));
|
2057
2057
|
var import_recharts2 = require("recharts");
|
2058
|
-
|
2059
|
-
|
2060
|
-
|
2061
|
-
|
2058
|
+
|
2059
|
+
// src/utils/tailwind.ts
|
2060
|
+
var import_classnames = __toESM(require("classnames"));
|
2061
|
+
function cleanClassNames(classNames2) {
|
2062
|
+
const tokens = classNames2.split(/\s+/);
|
2063
|
+
return tokens.filter((item) => item).join(" ");
|
2064
|
+
}
|
2065
|
+
function tw(classesOrModifiers1, classesOrModifiers2, classesOrModifiers3, classesOrModifiers4, classesOrModifiers5, classesOrModifiers6, classesOrModifiers7, classesOrModifiers8, classesOrModifiers9, classesOrModifiers10) {
|
2066
|
+
const result = (0, import_classnames.default)(
|
2067
|
+
classesOrModifiers1,
|
2068
|
+
classesOrModifiers2,
|
2069
|
+
classesOrModifiers3,
|
2070
|
+
classesOrModifiers4,
|
2071
|
+
classesOrModifiers5,
|
2072
|
+
classesOrModifiers6,
|
2073
|
+
classesOrModifiers7,
|
2074
|
+
classesOrModifiers8,
|
2075
|
+
classesOrModifiers9,
|
2076
|
+
classesOrModifiers10
|
2077
|
+
);
|
2078
|
+
return cleanClassNames(result);
|
2079
|
+
}
|
2080
|
+
var classNames = (...args) => {
|
2081
|
+
const result = (0, import_classnames.default)(...args);
|
2082
|
+
return cleanClassNames(result);
|
2083
|
+
};
|
2084
|
+
|
2085
|
+
// src/charts/Container/Container.tsx
|
2086
|
+
var ResponsiveContainer = (_a) => {
|
2087
|
+
var _b = _a, {
|
2088
|
+
isBusy = false,
|
2089
|
+
busyLabel = "Loading...",
|
2090
|
+
className,
|
2091
|
+
style,
|
2092
|
+
width = "100%",
|
2093
|
+
height = "100%",
|
2094
|
+
minWidth,
|
2095
|
+
minHeight,
|
2096
|
+
maxHeight
|
2097
|
+
} = _b, props = __objRest(_b, [
|
2098
|
+
"isBusy",
|
2099
|
+
"busyLabel",
|
2100
|
+
"className",
|
2101
|
+
"style",
|
2102
|
+
"width",
|
2103
|
+
"height",
|
2104
|
+
"minWidth",
|
2105
|
+
"minHeight",
|
2106
|
+
"maxHeight"
|
2107
|
+
]);
|
2108
|
+
return /* @__PURE__ */ import_react2.default.createElement("div", {
|
2109
|
+
"aria-busy": isBusy,
|
2110
|
+
className: classNames(className, tw("relative")),
|
2111
|
+
style: __spreadProps(__spreadValues({}, style), { width, height, minWidth, minHeight, maxHeight })
|
2112
|
+
}, /* @__PURE__ */ import_react2.default.createElement(import_recharts2.ResponsiveContainer, __spreadValues({}, props)), /* @__PURE__ */ import_react2.default.createElement("div", {
|
2113
|
+
className: classNames(
|
2114
|
+
tw("absolute inset-0 transition-colors flex items-center justify-center", {
|
2115
|
+
"delay-300": isBusy
|
2116
|
+
})
|
2117
|
+
),
|
2118
|
+
style: isBusy ? { backgroundColor: "rgba(255, 255, 255, 0.5)" } : {}
|
2119
|
+
}, /* @__PURE__ */ import_react2.default.createElement("span", {
|
2120
|
+
"aria-hidden": !isBusy,
|
2121
|
+
className: tw("rounded-full text-white bg-black typography-caption py-2 px-4 transition-all", {
|
2122
|
+
"opacity-100 delay-300": isBusy,
|
2123
|
+
"mb-[-20px] opacity-0": !isBusy
|
2124
|
+
})
|
2125
|
+
}, isBusy && busyLabel)));
|
2126
|
+
};
|
2062
2127
|
|
2063
2128
|
// src/charts/Grid/Grid.tsx
|
2064
2129
|
var import_react3 = __toESM(require("react"));
|
@@ -2116,11 +2181,14 @@ var renderChildren = (props) => {
|
|
2116
2181
|
}
|
2117
2182
|
});
|
2118
2183
|
};
|
2119
|
-
var AreaChart = (
|
2184
|
+
var AreaChart = (_a) => {
|
2185
|
+
var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
|
2120
2186
|
const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
|
2121
2187
|
return /* @__PURE__ */ import_react4.default.createElement(ResponsiveContainer, {
|
2122
2188
|
width: props.width,
|
2123
|
-
height: props.height
|
2189
|
+
height: props.height,
|
2190
|
+
isBusy,
|
2191
|
+
busyLabel
|
2124
2192
|
}, /* @__PURE__ */ import_react4.default.createElement(import_recharts5.AreaChart, {
|
2125
2193
|
accessibilityLayer: tooltip !== void 0,
|
2126
2194
|
data: props.data,
|
@@ -2163,7 +2231,8 @@ var margin = {
|
|
2163
2231
|
left: 20,
|
2164
2232
|
bottom: 5
|
2165
2233
|
};
|
2166
|
-
var BarChart = (
|
2234
|
+
var BarChart = (_a) => {
|
2235
|
+
var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
|
2167
2236
|
const [activeIndex, setActiveIndex] = import_react5.default.useState(void 0);
|
2168
2237
|
const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
|
2169
2238
|
const renderChildren3 = (props2) => {
|
@@ -2201,7 +2270,9 @@ var BarChart = (props) => {
|
|
2201
2270
|
};
|
2202
2271
|
return /* @__PURE__ */ import_react5.default.createElement(ResponsiveContainer, {
|
2203
2272
|
width: props.width,
|
2204
|
-
height: props.height
|
2273
|
+
height: props.height,
|
2274
|
+
isBusy,
|
2275
|
+
busyLabel
|
2205
2276
|
}, /* @__PURE__ */ import_react5.default.createElement(import_recharts6.BarChart, __spreadProps(__spreadValues({}, props), {
|
2206
2277
|
accessibilityLayer: tooltip !== void 0,
|
2207
2278
|
barCategoryGap: "5%",
|
@@ -2284,11 +2355,14 @@ var renderChildren2 = (props) => {
|
|
2284
2355
|
}
|
2285
2356
|
});
|
2286
2357
|
};
|
2287
|
-
var LineChart = (
|
2358
|
+
var LineChart = (_a) => {
|
2359
|
+
var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
|
2288
2360
|
const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
|
2289
2361
|
return /* @__PURE__ */ import_react8.default.createElement(ResponsiveContainer, {
|
2290
2362
|
width: props.width,
|
2291
|
-
height: props.height
|
2363
|
+
height: props.height,
|
2364
|
+
isBusy,
|
2365
|
+
busyLabel
|
2292
2366
|
}, /* @__PURE__ */ import_react8.default.createElement(import_recharts11.LineChart, {
|
2293
2367
|
data: props.data,
|
2294
2368
|
style: { stroke: "#fff", strokeWidth: 1 },
|
@@ -2320,30 +2394,6 @@ var import_recharts13 = require("recharts");
|
|
2320
2394
|
|
2321
2395
|
// src/charts/PieChart/ChartValue.tsx
|
2322
2396
|
var import_react9 = __toESM(require("react"));
|
2323
|
-
|
2324
|
-
// src/utils/tailwind.ts
|
2325
|
-
var import_classnames = __toESM(require("classnames"));
|
2326
|
-
function cleanClassNames(classNames) {
|
2327
|
-
const tokens = classNames.split(/\s+/);
|
2328
|
-
return tokens.filter((item) => item).join(" ");
|
2329
|
-
}
|
2330
|
-
function tw(classesOrModifiers1, classesOrModifiers2, classesOrModifiers3, classesOrModifiers4, classesOrModifiers5, classesOrModifiers6, classesOrModifiers7, classesOrModifiers8, classesOrModifiers9, classesOrModifiers10) {
|
2331
|
-
const result = (0, import_classnames.default)(
|
2332
|
-
classesOrModifiers1,
|
2333
|
-
classesOrModifiers2,
|
2334
|
-
classesOrModifiers3,
|
2335
|
-
classesOrModifiers4,
|
2336
|
-
classesOrModifiers5,
|
2337
|
-
classesOrModifiers6,
|
2338
|
-
classesOrModifiers7,
|
2339
|
-
classesOrModifiers8,
|
2340
|
-
classesOrModifiers9,
|
2341
|
-
classesOrModifiers10
|
2342
|
-
);
|
2343
|
-
return cleanClassNames(result);
|
2344
|
-
}
|
2345
|
-
|
2346
|
-
// src/charts/PieChart/ChartValue.tsx
|
2347
2397
|
var ChartValue = (props) => {
|
2348
2398
|
const { value, unit: unit2, caption } = props;
|
2349
2399
|
return /* @__PURE__ */ import_react9.default.createElement("p", {
|
@@ -2411,7 +2461,14 @@ var renderPieChildren = (children) => {
|
|
2411
2461
|
|
2412
2462
|
// src/charts/PieChart/DoughnutChart.tsx
|
2413
2463
|
var refSize = 300;
|
2414
|
-
var DoughnutChart = (
|
2464
|
+
var DoughnutChart = (_a) => {
|
2465
|
+
var _b = _a, {
|
2466
|
+
isBusy,
|
2467
|
+
busyLabel
|
2468
|
+
} = _b, props = __objRest(_b, [
|
2469
|
+
"isBusy",
|
2470
|
+
"busyLabel"
|
2471
|
+
]);
|
2415
2472
|
const [containerWidth, setContainerWidth] = import_react12.default.useState(0);
|
2416
2473
|
const [containerHeight, setContainerHeight] = import_react12.default.useState(0);
|
2417
2474
|
const [activeIndex, setActiveIndex] = import_react12.default.useState(null);
|
@@ -2423,10 +2480,10 @@ var DoughnutChart = (props) => {
|
|
2423
2480
|
setContainerHeight(h);
|
2424
2481
|
};
|
2425
2482
|
const renderChartValue = ({ formattedGraphicalItems }) => {
|
2426
|
-
var
|
2483
|
+
var _a2, _b2, _c;
|
2427
2484
|
const pie2 = formattedGraphicalItems == null ? void 0 : formattedGraphicalItems[0];
|
2428
|
-
const props2 = (
|
2429
|
-
const cx = (
|
2485
|
+
const props2 = (_a2 = pie2 == null ? void 0 : pie2.props) != null ? _a2 : {};
|
2486
|
+
const cx = (_b2 = props2.cx) != null ? _b2 : containerWidth / 2;
|
2430
2487
|
const cy = (_c = props2.cy) != null ? _c : containerHeight / 2;
|
2431
2488
|
if (!containerWidth || !containerHeight || (0, import_isNil.default)(chartValue)) {
|
2432
2489
|
return null;
|
@@ -2447,9 +2504,11 @@ var DoughnutChart = (props) => {
|
|
2447
2504
|
};
|
2448
2505
|
const highlightActive = activeIndex !== null && tooltip;
|
2449
2506
|
return /* @__PURE__ */ import_react12.default.createElement(ResponsiveContainer, {
|
2450
|
-
onResize,
|
2451
2507
|
width: props.width,
|
2452
|
-
height: props.height
|
2508
|
+
height: props.height,
|
2509
|
+
isBusy,
|
2510
|
+
busyLabel,
|
2511
|
+
onResize
|
2453
2512
|
}, /* @__PURE__ */ import_react12.default.createElement(import_recharts13.PieChart, null, chartValue && /* @__PURE__ */ import_react12.default.createElement(import_recharts13.Customized, {
|
2454
2513
|
component: renderChartValue
|
2455
2514
|
}), pie && /* @__PURE__ */ import_react12.default.createElement(import_recharts13.Pie, __spreadProps(__spreadValues({}, pie.props), {
|
@@ -2473,10 +2532,13 @@ DoughnutChart.Cell = import_recharts13.Cell;
|
|
2473
2532
|
// src/charts/PieChart/PieChart.tsx
|
2474
2533
|
var import_react13 = __toESM(require("react"));
|
2475
2534
|
var import_recharts14 = require("recharts");
|
2476
|
-
var PieChart = (
|
2535
|
+
var PieChart = (_a) => {
|
2536
|
+
var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
|
2477
2537
|
return /* @__PURE__ */ import_react13.default.createElement(ResponsiveContainer, {
|
2478
2538
|
width: props.width,
|
2479
|
-
height: props.height
|
2539
|
+
height: props.height,
|
2540
|
+
isBusy,
|
2541
|
+
busyLabel
|
2480
2542
|
}, /* @__PURE__ */ import_react13.default.createElement(import_recharts14.PieChart, {
|
2481
2543
|
width: 500,
|
2482
2544
|
height: 500
|
package/dist/charts.mjs
CHANGED
@@ -1935,10 +1935,75 @@ var Axis = {
|
|
1935
1935
|
// src/charts/Container/Container.tsx
|
1936
1936
|
import React2 from "react";
|
1937
1937
|
import { ResponsiveContainer as _ResponsiveContainer } from "recharts";
|
1938
|
-
|
1939
|
-
|
1940
|
-
|
1941
|
-
|
1938
|
+
|
1939
|
+
// src/utils/tailwind.ts
|
1940
|
+
import originalClassNames from "classnames";
|
1941
|
+
function cleanClassNames(classNames2) {
|
1942
|
+
const tokens = classNames2.split(/\s+/);
|
1943
|
+
return tokens.filter((item) => item).join(" ");
|
1944
|
+
}
|
1945
|
+
function tw(classesOrModifiers1, classesOrModifiers2, classesOrModifiers3, classesOrModifiers4, classesOrModifiers5, classesOrModifiers6, classesOrModifiers7, classesOrModifiers8, classesOrModifiers9, classesOrModifiers10) {
|
1946
|
+
const result = originalClassNames(
|
1947
|
+
classesOrModifiers1,
|
1948
|
+
classesOrModifiers2,
|
1949
|
+
classesOrModifiers3,
|
1950
|
+
classesOrModifiers4,
|
1951
|
+
classesOrModifiers5,
|
1952
|
+
classesOrModifiers6,
|
1953
|
+
classesOrModifiers7,
|
1954
|
+
classesOrModifiers8,
|
1955
|
+
classesOrModifiers9,
|
1956
|
+
classesOrModifiers10
|
1957
|
+
);
|
1958
|
+
return cleanClassNames(result);
|
1959
|
+
}
|
1960
|
+
var classNames = (...args) => {
|
1961
|
+
const result = originalClassNames(...args);
|
1962
|
+
return cleanClassNames(result);
|
1963
|
+
};
|
1964
|
+
|
1965
|
+
// src/charts/Container/Container.tsx
|
1966
|
+
var ResponsiveContainer = (_a) => {
|
1967
|
+
var _b = _a, {
|
1968
|
+
isBusy = false,
|
1969
|
+
busyLabel = "Loading...",
|
1970
|
+
className,
|
1971
|
+
style,
|
1972
|
+
width = "100%",
|
1973
|
+
height = "100%",
|
1974
|
+
minWidth,
|
1975
|
+
minHeight,
|
1976
|
+
maxHeight
|
1977
|
+
} = _b, props = __objRest(_b, [
|
1978
|
+
"isBusy",
|
1979
|
+
"busyLabel",
|
1980
|
+
"className",
|
1981
|
+
"style",
|
1982
|
+
"width",
|
1983
|
+
"height",
|
1984
|
+
"minWidth",
|
1985
|
+
"minHeight",
|
1986
|
+
"maxHeight"
|
1987
|
+
]);
|
1988
|
+
return /* @__PURE__ */ React2.createElement("div", {
|
1989
|
+
"aria-busy": isBusy,
|
1990
|
+
className: classNames(className, tw("relative")),
|
1991
|
+
style: __spreadProps(__spreadValues({}, style), { width, height, minWidth, minHeight, maxHeight })
|
1992
|
+
}, /* @__PURE__ */ React2.createElement(_ResponsiveContainer, __spreadValues({}, props)), /* @__PURE__ */ React2.createElement("div", {
|
1993
|
+
className: classNames(
|
1994
|
+
tw("absolute inset-0 transition-colors flex items-center justify-center", {
|
1995
|
+
"delay-300": isBusy
|
1996
|
+
})
|
1997
|
+
),
|
1998
|
+
style: isBusy ? { backgroundColor: "rgba(255, 255, 255, 0.5)" } : {}
|
1999
|
+
}, /* @__PURE__ */ React2.createElement("span", {
|
2000
|
+
"aria-hidden": !isBusy,
|
2001
|
+
className: tw("rounded-full text-white bg-black typography-caption py-2 px-4 transition-all", {
|
2002
|
+
"opacity-100 delay-300": isBusy,
|
2003
|
+
"mb-[-20px] opacity-0": !isBusy
|
2004
|
+
})
|
2005
|
+
}, isBusy && busyLabel)));
|
2006
|
+
};
|
1942
2007
|
|
1943
2008
|
// src/charts/Grid/Grid.tsx
|
1944
2009
|
import React3 from "react";
|
@@ -1996,11 +2061,14 @@ var renderChildren = (props) => {
|
|
1996
2061
|
}
|
1997
2062
|
});
|
1998
2063
|
};
|
1999
|
-
var AreaChart = (
|
2064
|
+
var AreaChart = (_a) => {
|
2065
|
+
var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
|
2000
2066
|
const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
|
2001
2067
|
return /* @__PURE__ */ React4.createElement(ResponsiveContainer, {
|
2002
2068
|
width: props.width,
|
2003
|
-
height: props.height
|
2069
|
+
height: props.height,
|
2070
|
+
isBusy,
|
2071
|
+
busyLabel
|
2004
2072
|
}, /* @__PURE__ */ React4.createElement(_AreaChart, {
|
2005
2073
|
accessibilityLayer: tooltip !== void 0,
|
2006
2074
|
data: props.data,
|
@@ -2043,7 +2111,8 @@ var margin = {
|
|
2043
2111
|
left: 20,
|
2044
2112
|
bottom: 5
|
2045
2113
|
};
|
2046
|
-
var BarChart = (
|
2114
|
+
var BarChart = (_a) => {
|
2115
|
+
var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
|
2047
2116
|
const [activeIndex, setActiveIndex] = React5.useState(void 0);
|
2048
2117
|
const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
|
2049
2118
|
const renderChildren3 = (props2) => {
|
@@ -2081,7 +2150,9 @@ var BarChart = (props) => {
|
|
2081
2150
|
};
|
2082
2151
|
return /* @__PURE__ */ React5.createElement(ResponsiveContainer, {
|
2083
2152
|
width: props.width,
|
2084
|
-
height: props.height
|
2153
|
+
height: props.height,
|
2154
|
+
isBusy,
|
2155
|
+
busyLabel
|
2085
2156
|
}, /* @__PURE__ */ React5.createElement(_BarChart, __spreadProps(__spreadValues({}, props), {
|
2086
2157
|
accessibilityLayer: tooltip !== void 0,
|
2087
2158
|
barCategoryGap: "5%",
|
@@ -2164,11 +2235,14 @@ var renderChildren2 = (props) => {
|
|
2164
2235
|
}
|
2165
2236
|
});
|
2166
2237
|
};
|
2167
|
-
var LineChart = (
|
2238
|
+
var LineChart = (_a) => {
|
2239
|
+
var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
|
2168
2240
|
const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
|
2169
2241
|
return /* @__PURE__ */ React8.createElement(ResponsiveContainer, {
|
2170
2242
|
width: props.width,
|
2171
|
-
height: props.height
|
2243
|
+
height: props.height,
|
2244
|
+
isBusy,
|
2245
|
+
busyLabel
|
2172
2246
|
}, /* @__PURE__ */ React8.createElement(_LineChart, {
|
2173
2247
|
data: props.data,
|
2174
2248
|
style: { stroke: "#fff", strokeWidth: 1 },
|
@@ -2200,30 +2274,6 @@ import { Cell as Cell2, Customized, Pie as _Pie, PieChart as _PieChart } from "r
|
|
2200
2274
|
|
2201
2275
|
// src/charts/PieChart/ChartValue.tsx
|
2202
2276
|
import React9 from "react";
|
2203
|
-
|
2204
|
-
// src/utils/tailwind.ts
|
2205
|
-
import originalClassNames from "classnames";
|
2206
|
-
function cleanClassNames(classNames) {
|
2207
|
-
const tokens = classNames.split(/\s+/);
|
2208
|
-
return tokens.filter((item) => item).join(" ");
|
2209
|
-
}
|
2210
|
-
function tw(classesOrModifiers1, classesOrModifiers2, classesOrModifiers3, classesOrModifiers4, classesOrModifiers5, classesOrModifiers6, classesOrModifiers7, classesOrModifiers8, classesOrModifiers9, classesOrModifiers10) {
|
2211
|
-
const result = originalClassNames(
|
2212
|
-
classesOrModifiers1,
|
2213
|
-
classesOrModifiers2,
|
2214
|
-
classesOrModifiers3,
|
2215
|
-
classesOrModifiers4,
|
2216
|
-
classesOrModifiers5,
|
2217
|
-
classesOrModifiers6,
|
2218
|
-
classesOrModifiers7,
|
2219
|
-
classesOrModifiers8,
|
2220
|
-
classesOrModifiers9,
|
2221
|
-
classesOrModifiers10
|
2222
|
-
);
|
2223
|
-
return cleanClassNames(result);
|
2224
|
-
}
|
2225
|
-
|
2226
|
-
// src/charts/PieChart/ChartValue.tsx
|
2227
2277
|
var ChartValue = (props) => {
|
2228
2278
|
const { value, unit: unit2, caption } = props;
|
2229
2279
|
return /* @__PURE__ */ React9.createElement("p", {
|
@@ -2291,7 +2341,14 @@ var renderPieChildren = (children) => {
|
|
2291
2341
|
|
2292
2342
|
// src/charts/PieChart/DoughnutChart.tsx
|
2293
2343
|
var refSize = 300;
|
2294
|
-
var DoughnutChart = (
|
2344
|
+
var DoughnutChart = (_a) => {
|
2345
|
+
var _b = _a, {
|
2346
|
+
isBusy,
|
2347
|
+
busyLabel
|
2348
|
+
} = _b, props = __objRest(_b, [
|
2349
|
+
"isBusy",
|
2350
|
+
"busyLabel"
|
2351
|
+
]);
|
2295
2352
|
const [containerWidth, setContainerWidth] = React12.useState(0);
|
2296
2353
|
const [containerHeight, setContainerHeight] = React12.useState(0);
|
2297
2354
|
const [activeIndex, setActiveIndex] = React12.useState(null);
|
@@ -2303,10 +2360,10 @@ var DoughnutChart = (props) => {
|
|
2303
2360
|
setContainerHeight(h);
|
2304
2361
|
};
|
2305
2362
|
const renderChartValue = ({ formattedGraphicalItems }) => {
|
2306
|
-
var
|
2363
|
+
var _a2, _b2, _c;
|
2307
2364
|
const pie2 = formattedGraphicalItems == null ? void 0 : formattedGraphicalItems[0];
|
2308
|
-
const props2 = (
|
2309
|
-
const cx = (
|
2365
|
+
const props2 = (_a2 = pie2 == null ? void 0 : pie2.props) != null ? _a2 : {};
|
2366
|
+
const cx = (_b2 = props2.cx) != null ? _b2 : containerWidth / 2;
|
2310
2367
|
const cy = (_c = props2.cy) != null ? _c : containerHeight / 2;
|
2311
2368
|
if (!containerWidth || !containerHeight || isNil(chartValue)) {
|
2312
2369
|
return null;
|
@@ -2327,9 +2384,11 @@ var DoughnutChart = (props) => {
|
|
2327
2384
|
};
|
2328
2385
|
const highlightActive = activeIndex !== null && tooltip;
|
2329
2386
|
return /* @__PURE__ */ React12.createElement(ResponsiveContainer, {
|
2330
|
-
onResize,
|
2331
2387
|
width: props.width,
|
2332
|
-
height: props.height
|
2388
|
+
height: props.height,
|
2389
|
+
isBusy,
|
2390
|
+
busyLabel,
|
2391
|
+
onResize
|
2333
2392
|
}, /* @__PURE__ */ React12.createElement(_PieChart, null, chartValue && /* @__PURE__ */ React12.createElement(Customized, {
|
2334
2393
|
component: renderChartValue
|
2335
2394
|
}), pie && /* @__PURE__ */ React12.createElement(_Pie, __spreadProps(__spreadValues({}, pie.props), {
|
@@ -2353,10 +2412,13 @@ DoughnutChart.Cell = Cell2;
|
|
2353
2412
|
// src/charts/PieChart/PieChart.tsx
|
2354
2413
|
import React13 from "react";
|
2355
2414
|
import { Cell as Cell3, Pie as _Pie2, PieChart as _PieChart2 } from "recharts";
|
2356
|
-
var PieChart = (
|
2415
|
+
var PieChart = (_a) => {
|
2416
|
+
var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
|
2357
2417
|
return /* @__PURE__ */ React13.createElement(ResponsiveContainer, {
|
2358
2418
|
width: props.width,
|
2359
|
-
height: props.height
|
2419
|
+
height: props.height,
|
2420
|
+
isBusy,
|
2421
|
+
busyLabel
|
2360
2422
|
}, /* @__PURE__ */ React13.createElement(_PieChart2, {
|
2361
2423
|
width: 500,
|
2362
2424
|
height: 500
|
@@ -1,10 +1,11 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { Area as _Area, AreaChart as _AreaChart, type AreaProps } from 'recharts';
|
3
|
+
import { type ContainerProps } from '../../../src/charts/Container/Container';
|
3
4
|
import { type ChartProps } from '../../../src/charts/lib/utils';
|
4
5
|
declare type ComposedAreaChart = {
|
5
6
|
Area: typeof Area;
|
6
7
|
};
|
7
|
-
declare type AreaChartProps = ChartProps & React.ComponentProps<typeof _AreaChart>;
|
8
|
+
declare type AreaChartProps = ChartProps & ContainerProps & React.ComponentProps<typeof _AreaChart>;
|
8
9
|
export declare const AreaChart: ComposedAreaChart & React.FC<AreaChartProps>;
|
9
10
|
export declare const Area: ((props: Omit<AreaProps, 'ref'>) => React.JSX.Element) & typeof _Area;
|
10
11
|
export {};
|
@@ -1,3 +1,14 @@
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
2
|
+
var t = {};
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
4
|
+
t[p] = s[p];
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
8
|
+
t[p[i]] = s[p[i]];
|
9
|
+
}
|
10
|
+
return t;
|
11
|
+
};
|
1
12
|
import React from 'react';
|
2
13
|
import { Area as _Area, AreaChart as _AreaChart } from 'recharts';
|
3
14
|
import { Axis, renderXAxis, renderXTimeAxis, renderYAxis } from '../../../src/charts/Axis/Axis';
|
@@ -26,9 +37,10 @@ const renderChildren = (props) => {
|
|
26
37
|
}
|
27
38
|
});
|
28
39
|
};
|
29
|
-
export const AreaChart = (
|
40
|
+
export const AreaChart = (_a) => {
|
41
|
+
var { isBusy, busyLabel } = _a, props = __rest(_a, ["isBusy", "busyLabel"]);
|
30
42
|
const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
|
31
|
-
return (React.createElement(ResponsiveContainer, { width: props.width, height: props.height },
|
43
|
+
return (React.createElement(ResponsiveContainer, { width: props.width, height: props.height, isBusy: isBusy, busyLabel: busyLabel },
|
32
44
|
React.createElement(_AreaChart, { accessibilityLayer: tooltip !== undefined, data: props.data, style: { stroke: '#fff', strokeWidth: 1 }, margin: {
|
33
45
|
top: 20,
|
34
46
|
right: 30,
|
@@ -47,4 +59,4 @@ Area.defaultProps = Object.assign({}, _Area.defaultProps, {
|
|
47
59
|
fill: undefined,
|
48
60
|
});
|
49
61
|
AreaChart.Area = Area;
|
50
|
-
//# sourceMappingURL=data:application/json;base64,
|
62
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQXJlYUNoYXJ0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NoYXJ0cy9BcmVhQ2hhcnQvQXJlYUNoYXJ0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBQUUsSUFBSSxJQUFJLEtBQUssRUFBRSxTQUFTLElBQUksVUFBVSxFQUFrQixNQUFNLFVBQVUsQ0FBQztBQUVsRixPQUFPLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRSxlQUFlLEVBQUUsV0FBVyxFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDdkYsT0FBTyxFQUF1QixtQkFBbUIsRUFBRSxNQUFNLGdDQUFnQyxDQUFDO0FBQzFGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUNyRCxPQUFPLEVBQW1CLHlCQUF5QixFQUFFLGNBQWMsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ2xHLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQVFyRCxNQUFNLGNBQWMsR0FBRyxDQUFDLEtBQXFCLEVBQUUsRUFBRTtJQUMvQyxPQUFPLEtBQUssQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxRQUFRLEVBQUUsQ0FBQyxLQUFLLEVBQUUsRUFBRTtRQUNsRCxJQUFJLENBQUMsS0FBSyxFQUFFO1lBQ1YsT0FBTyxLQUFLLENBQUM7U0FDZDtRQUVELFFBQVEsY0FBYyxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsRUFBRTtZQUNsQyxLQUFLLElBQUksQ0FBQyxLQUFLLENBQUMsV0FBVyxDQUFDLENBQUM7Z0JBQzNCLE9BQU8sV0FBVyxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQzthQUNsQztZQUVELEtBQUssSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUM7Z0JBQ2hDLE9BQU8sZUFBZSxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQzthQUN0QztZQUVELEtBQUssSUFBSSxDQUFDLEtBQUssQ0FBQyxXQUFXLENBQUMsQ0FBQztnQkFDM0IsT0FBTyxXQUFXLENBQUMsS0FBSyxFQUFFLEtBQUssQ0FBQyxDQUFDO2FBQ2xDO1lBRUQsT0FBTyxDQUFDLENBQUM7Z0JBQ1AsT0FBTyxLQUFLLENBQUM7YUFDZDtTQUNGO0lBQ0gsQ0FBQyxDQUFDLENBQUM7QUFDTCxDQUFDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxTQUFTLEdBQWlELENBQUMsRUFBK0IsRUFBRSxFQUFFO1FBQW5DLEVBQUUsTUFBTSxFQUFFLFNBQVMsT0FBWSxFQUFQLEtBQUssY0FBN0IsdUJBQStCLENBQUY7SUFDbkcsTUFBTSxDQUFDLE9BQU8sQ0FBQyxHQUFHLHlCQUF5QixDQUFDLEtBQUssQ0FBQyxRQUFRLEVBQUUsT0FBTyxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBRWpGLE9BQU8sQ0FDTCxvQkFBQyxtQkFBbUIsSUFBQyxLQUFLLEVBQUUsS0FBSyxDQUFDLEtBQUssRUFBRSxNQUFNLEVBQUUsS0FBSyxDQUFDLE1BQU0sRUFBRSxNQUFNLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxTQUFTO1FBQ2pHLG9CQUFDLFVBQVUsSUFDVCxrQkFBa0IsRUFBRSxPQUFPLEtBQUssU0FBUyxFQUN6QyxJQUFJLEVBQUUsS0FBSyxDQUFDLElBQUksRUFDaEIsS0FBSyxFQUFFLEVBQUUsTUFBTSxFQUFFLE1BQU0sRUFBRSxXQUFXLEVBQUUsQ0FBQyxFQUFFLEVBQ3pDLE1BQU0sRUFBRTtnQkFDTixHQUFHLEVBQUUsRUFBRTtnQkFDUCxLQUFLLEVBQUUsRUFBRTtnQkFDVCxJQUFJLEVBQUUsRUFBRTtnQkFDUixNQUFNLEVBQUUsQ0FBQzthQUNWO1lBRUQsb0JBQUMsYUFBYSxPQUFHO1lBQ2hCLGNBQWMsQ0FBQyxLQUFLLENBQUMsQ0FDWCxDQUNPLENBQ3ZCLENBQUM7QUFDSixDQUFDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxJQUFJLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FDL0IsQ0FBQyxLQUE2QixFQUFFLEVBQUU7O0lBQUMsT0FBQSxDQUNqQyxvQkFBQyxLQUFLLGtCQUNKLElBQUksRUFBQyxVQUFVLEVBQ2YsV0FBVyxFQUFFLENBQUMsRUFDZCxHQUFHLEVBQUUsS0FBSyxJQUNOLEtBQUssSUFDVCxJQUFJLEVBQUUsTUFBQSxLQUFLLENBQUMsSUFBSSxtQ0FBSSxLQUFLLENBQUMsTUFBTSxFQUNoQyxXQUFXLEVBQUUsR0FBRyxFQUNoQixpQkFBaUIsRUFBRSxLQUFLLElBQ3hCLENBQ0gsQ0FBQTtDQUFBLEVBQ0QsS0FBSyxDQUNOLENBQUM7QUFFRixJQUFJLENBQUMsWUFBWSxHQUFHLE1BQU0sQ0FBQyxNQUFNLENBQUMsRUFBRSxFQUFFLEtBQUssQ0FBQyxZQUFZLEVBQUU7SUFDeEQsV0FBVyxFQUFFLEdBQUc7SUFDaEIsSUFBSSxFQUFFLFNBQVM7Q0FDaEIsQ0FBQyxDQUFDO0FBRUgsU0FBUyxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMifQ==
|
@@ -1,12 +1,13 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { Bar as _Bar, BarChart as _BarChart, type BarProps } from 'recharts';
|
3
|
+
import { type ContainerProps } from '../../../src/charts/Container/Container';
|
3
4
|
import { type ChartProps } from '../../../src/charts/lib/utils';
|
4
5
|
import { Tooltip } from '../../../src/charts/Tooltip/Tooltip';
|
5
6
|
declare type ComposedBarChart = {
|
6
7
|
Bar: typeof Bar;
|
7
8
|
Tooltip: typeof Tooltip;
|
8
9
|
};
|
9
|
-
declare type BarChartProps = ChartProps & React.ComponentProps<typeof _BarChart>;
|
10
|
+
declare type BarChartProps = ChartProps & ContainerProps & React.ComponentProps<typeof _BarChart>;
|
10
11
|
export declare const BarChart: ComposedBarChart & React.FC<BarChartProps>;
|
11
12
|
export declare const Bar: ((props: Omit<BarProps, 'ref'>) => React.JSX.Element) & typeof _Bar;
|
12
13
|
export {};
|
@@ -1,3 +1,14 @@
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
2
|
+
var t = {};
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
4
|
+
t[p] = s[p];
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
8
|
+
t[p[i]] = s[p[i]];
|
9
|
+
}
|
10
|
+
return t;
|
11
|
+
};
|
1
12
|
import React from 'react';
|
2
13
|
import { Bar as _Bar, BarChart as _BarChart, Rectangle } from 'recharts';
|
3
14
|
import { Axis, renderXAxis, renderXTimeAxis, renderYAxis } from '../../../src/charts/Axis/Axis';
|
@@ -16,7 +27,8 @@ const margin = {
|
|
16
27
|
left: 20,
|
17
28
|
bottom: 5,
|
18
29
|
};
|
19
|
-
export const BarChart = (
|
30
|
+
export const BarChart = (_a) => {
|
31
|
+
var { isBusy, busyLabel } = _a, props = __rest(_a, ["isBusy", "busyLabel"]);
|
20
32
|
const [activeIndex, setActiveIndex] = React.useState(undefined);
|
21
33
|
const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
|
22
34
|
const renderChildren = (props) => {
|
@@ -53,7 +65,7 @@ export const BarChart = (props) => {
|
|
53
65
|
}
|
54
66
|
});
|
55
67
|
};
|
56
|
-
return (React.createElement(ResponsiveContainer, { width: props.width, height: props.height },
|
68
|
+
return (React.createElement(ResponsiveContainer, { width: props.width, height: props.height, isBusy: isBusy, busyLabel: busyLabel },
|
57
69
|
React.createElement(_BarChart, Object.assign({}, props, { accessibilityLayer: tooltip !== undefined, barCategoryGap: "5%", style: { stroke: '#fff', strokeWidth: 1 }, onMouseMove: (state) => setActiveIndex(state.isTooltipActive ? state.activeTooltipIndex : undefined), onMouseLeave: () => setActiveIndex(undefined), margin: margin }),
|
58
70
|
React.createElement(CartesianGrid, null),
|
59
71
|
renderChildren(props))));
|
@@ -61,4 +73,4 @@ export const BarChart = (props) => {
|
|
61
73
|
export const Bar = Object.assign((props) => React.createElement(_Bar, Object.assign({}, props, { isAnimationActive: false })), _Bar);
|
62
74
|
BarChart.Bar = Bar;
|
63
75
|
BarChart.Tooltip = Tooltip;
|
64
|
-
//# sourceMappingURL=data:application/json;base64,
|
76
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmFyQ2hhcnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY2hhcnRzL0JhckNoYXJ0L0JhckNoYXJ0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBQUUsR0FBRyxJQUFJLElBQUksRUFBRSxRQUFRLElBQUksU0FBUyxFQUFpQixTQUFTLEVBQUUsTUFBTSxVQUFVLENBQUM7QUFFeEYsT0FBTyxFQUFFLElBQUksRUFBRSxXQUFXLEVBQUUsZUFBZSxFQUFFLFdBQVcsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ3ZGLE9BQU8sRUFBdUIsbUJBQW1CLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQztBQUMxRixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDckQsT0FBTyxFQUFtQix5QkFBeUIsRUFBRSxjQUFjLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUNsRyxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFTckQ7Ozs7R0FJRztBQUNILE1BQU0sTUFBTSxHQUFHO0lBQ2IsR0FBRyxFQUFFLEVBQUU7SUFDUCxLQUFLLEVBQUUsRUFBRTtJQUNULElBQUksRUFBRSxFQUFFO0lBQ1IsTUFBTSxFQUFFLENBQUM7Q0FDVixDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUErQyxDQUFDLEVBQStCLEVBQUUsRUFBRTtRQUFuQyxFQUFFLE1BQU0sRUFBRSxTQUFTLE9BQVksRUFBUCxLQUFLLGNBQTdCLHVCQUErQixDQUFGO0lBQ2hHLE1BQU0sQ0FBQyxXQUFXLEVBQUUsY0FBYyxDQUFDLEdBQUcsS0FBSyxDQUFDLFFBQVEsQ0FBcUIsU0FBUyxDQUFDLENBQUM7SUFDcEYsTUFBTSxDQUFDLE9BQU8sQ0FBQyxHQUFHLHlCQUF5QixDQUFDLEtBQUssQ0FBQyxRQUFRLEVBQUUsT0FBTyxDQUFD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
|
@@ -1,3 +1,13 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { type ResponsiveContainerProps } from 'recharts';
|
3
|
-
export declare
|
3
|
+
export declare type ContainerProps = {
|
4
|
+
/**
|
5
|
+
* When true, the chart will have a visual indication that it is busy.
|
6
|
+
*/
|
7
|
+
isBusy?: boolean;
|
8
|
+
/**
|
9
|
+
* Optional label for the busy state.
|
10
|
+
*/
|
11
|
+
busyLabel?: string;
|
12
|
+
};
|
13
|
+
export declare const ResponsiveContainer: ({ isBusy, busyLabel, className, style, width, height, minWidth, minHeight, maxHeight, ...props }: ContainerProps & ResponsiveContainerProps) => React.JSX.Element;
|
@@ -1,4 +1,27 @@
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
2
|
+
var t = {};
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
4
|
+
t[p] = s[p];
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
8
|
+
t[p[i]] = s[p[i]];
|
9
|
+
}
|
10
|
+
return t;
|
11
|
+
};
|
1
12
|
import React from 'react';
|
2
13
|
import { ResponsiveContainer as _ResponsiveContainer } from 'recharts';
|
3
|
-
|
4
|
-
|
14
|
+
import { classNames, tw } from '../../../src/utils/tailwind';
|
15
|
+
export const ResponsiveContainer = (_a) => {
|
16
|
+
var { isBusy = false, busyLabel = 'Loading...', className, style, width = '100%', height = '100%', minWidth, minHeight, maxHeight } = _a, props = __rest(_a, ["isBusy", "busyLabel", "className", "style", "width", "height", "minWidth", "minHeight", "maxHeight"]);
|
17
|
+
return (React.createElement("div", { "aria-busy": isBusy, className: classNames(className, tw('relative')), style: Object.assign(Object.assign({}, style), { width, height, minWidth, minHeight, maxHeight }) },
|
18
|
+
React.createElement(_ResponsiveContainer, Object.assign({}, props)),
|
19
|
+
React.createElement("div", { className: classNames(tw('absolute inset-0 transition-colors flex items-center justify-center', {
|
20
|
+
'delay-300': isBusy,
|
21
|
+
})), style: isBusy ? { backgroundColor: 'rgba(255, 255, 255, 0.5)' } : {} },
|
22
|
+
React.createElement("span", { "aria-hidden": !isBusy, className: tw('rounded-full text-white bg-black typography-caption py-2 px-4 transition-all', {
|
23
|
+
'opacity-100 delay-300': isBusy,
|
24
|
+
'mb-[-20px] opacity-0': !isBusy,
|
25
|
+
}) }, isBusy && busyLabel))));
|
26
|
+
};
|
27
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29udGFpbmVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NoYXJ0cy9Db250YWluZXIvQ29udGFpbmVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBQUUsbUJBQW1CLElBQUksb0JBQW9CLEVBQWlDLE1BQU0sVUFBVSxDQUFDO0FBRXRHLE9BQU8sRUFBRSxVQUFVLEVBQUUsRUFBRSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFjcEQsTUFBTSxDQUFDLE1BQU0sbUJBQW1CLEdBQUcsQ0FBQyxFQVdRLEVBQUUsRUFBRTtRQVhaLEVBQ2xDLE1BQU0sR0FBRyxLQUFLLEVBQ2QsU0FBUyxHQUFHLFlBQVksRUFDeEIsU0FBUyxFQUNULEtBQUssRUFDTCxLQUFLLEdBQUcsTUFBTSxFQUNkLE1BQU0sR0FBRyxNQUFNLEVBQ2YsUUFBUSxFQUNSLFNBQVMsRUFDVCxTQUFTLE9BRWlDLEVBRHZDLEtBQUssY0FWMEIsc0dBV25DLENBRFM7SUFDdUMsT0FBQSxDQUMvQywwQ0FDYSxNQUFNLEVBQ2pCLFNBQVMsRUFBRSxVQUFVLENBQUMsU0FBUyxFQUFFLEVBQUUsQ0FBQyxVQUFVLENBQUMsQ0FBQyxFQUNoRCxLQUFLLGtDQUFPLEtBQUssS0FBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFFBQVEsRUFBRSxTQUFTLEVBQUUsU0FBUztRQUVoRSxvQkFBQyxvQkFBb0Isb0JBQUssS0FBSyxFQUFJO1FBQ25DLDZCQUNFLFNBQVMsRUFBRSxVQUFVLENBQ25CLEVBQUUsQ0FBQyxxRUFBcUUsRUFBRTtnQkFDeEUsV0FBVyxFQUFFLE1BQU07YUFDcEIsQ0FBQyxDQUNILEVBQ0QsS0FBSyxFQUFFLE1BQU0sQ0FBQyxDQUFDLENBQUMsRUFBRSxlQUFlLEVBQUUsMEJBQTBCLEVBQUUsQ0FBQyxDQUFDLENBQUMsRUFBRTtZQUVwRSw2Q0FDZSxDQUFDLE1BQU0sRUFDcEIsU0FBUyxFQUFFLEVBQUUsQ0FBQyw4RUFBOEUsRUFBRTtvQkFDNUYsdUJBQXVCLEVBQUUsTUFBTTtvQkFDL0Isc0JBQXNCLEVBQUUsQ0FBQyxNQUFNO2lCQUNoQyxDQUFDLElBRUQsTUFBTSxJQUFJLFNBQVMsQ0FDZixDQUNILENBQ0YsQ0FDUCxDQUFBO0NBQUEsQ0FBQyJ9
|
@@ -1,10 +1,11 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { Line as _Line, LineChart as _LineChart, type LineProps } from 'recharts';
|
3
|
+
import { type ContainerProps } from '../../../src/charts/Container/Container';
|
3
4
|
import { type ChartProps } from '../../../src/charts/lib/utils';
|
4
5
|
declare type ComposedLineChart = {
|
5
6
|
Line: typeof Line;
|
6
7
|
};
|
7
|
-
declare type LineChartProps = ChartProps & React.ComponentProps<typeof _LineChart>;
|
8
|
+
declare type LineChartProps = ChartProps & ContainerProps & React.ComponentProps<typeof _LineChart>;
|
8
9
|
export declare const LineChart: ComposedLineChart & React.FC<LineChartProps>;
|
9
10
|
export declare const Line: ((props: Omit<LineProps, 'ref'>) => React.JSX.Element) & typeof _Line;
|
10
11
|
export {};
|