@aivenio/aquarium 1.57.1 → 1.58.0

package/dist/_variables.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Fri, 23 Feb 2024 08:03:31 GMT
+// Generated on Fri, 23 Feb 2024 14:28:38 GMT
 
 $border-radius-none: 0px !default;
 $border-radius-sm: 0.125rem !default;

package/dist/charts.cjs

@@ -2055,10 +2055,72 @@ var Axis = {
 // src/charts/Container/Container.tsx
 var import_react2 = __toESM(require("react"));
 var import_recharts2 = require("recharts");
-var ResponsiveContainer = (props) => /* @__PURE__ */ import_react2.default.createElement(import_recharts2.ResponsiveContainer, __spreadValues({
-  width: "100%",
-  height: "100%"
-}, props));
+
+// src/utils/tailwind.ts
+var import_classnames = __toESM(require("classnames"));
+function cleanClassNames(classNames2) {
+  const tokens = classNames2.split(/\s+/);
+  return tokens.filter((item) => item).join(" ");
+}
+function tw(classesOrModifiers1, classesOrModifiers2, classesOrModifiers3, classesOrModifiers4, classesOrModifiers5, classesOrModifiers6, classesOrModifiers7, classesOrModifiers8, classesOrModifiers9, classesOrModifiers10) {
+  const result = (0, import_classnames.default)(
+    classesOrModifiers1,
+    classesOrModifiers2,
+    classesOrModifiers3,
+    classesOrModifiers4,
+    classesOrModifiers5,
+    classesOrModifiers6,
+    classesOrModifiers7,
+    classesOrModifiers8,
+    classesOrModifiers9,
+    classesOrModifiers10
+  );
+  return cleanClassNames(result);
+}
+var classNames = (...args) => {
+  const result = (0, import_classnames.default)(...args);
+  return cleanClassNames(result);
+};
+
+// src/charts/Container/Container.tsx
+var ResponsiveContainer = (_a) => {
+  var _b = _a, {
+    isBusy = false,
+    busyLabel = "Loading...",
+    className,
+    style,
+    width = "100%",
+    height = "100%",
+    minWidth,
+    minHeight,
+    maxHeight
+  } = _b, props = __objRest(_b, [
+    "isBusy",
+    "busyLabel",
+    "className",
+    "style",
+    "width",
+    "height",
+    "minWidth",
+    "minHeight",
+    "maxHeight"
+  ]);
+  return /* @__PURE__ */ import_react2.default.createElement("div", {
+    "aria-busy": isBusy,
+    className: classNames(className, tw("relative")),
+    style: __spreadProps(__spreadValues({}, style), { width, height, minWidth, minHeight, maxHeight })
+  }, /* @__PURE__ */ import_react2.default.createElement(import_recharts2.ResponsiveContainer, __spreadValues({}, props)), /* @__PURE__ */ import_react2.default.createElement("div", {
+    className: classNames(tw("absolute inset-0 transition-colors flex items-center justify-center"), {
+      "bg-[rgb(255,255,255)]/50 delay-300": isBusy
+    })
+  }, /* @__PURE__ */ import_react2.default.createElement("span", {
+    "aria-hidden": !isBusy,
+    className: tw("rounded-full text-white bg-black typography-caption py-2 px-4 transition-all", {
+      "opacity-100 delay-300": isBusy,
+      "mb-[-20px] opacity-0": !isBusy
+    })
+  }, isBusy && busyLabel)));
+};
 
 // src/charts/Grid/Grid.tsx
 var import_react3 = __toESM(require("react"));
@@ -2116,11 +2178,14 @@ var renderChildren = (props) => {
     }
   });
 };
-var AreaChart = (props) => {
+var AreaChart = (_a) => {
+  var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
   const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
   return /* @__PURE__ */ import_react4.default.createElement(ResponsiveContainer, {
     width: props.width,
-    height: props.height
+    height: props.height,
+    isBusy,
+    busyLabel
   }, /* @__PURE__ */ import_react4.default.createElement(import_recharts5.AreaChart, {
     accessibilityLayer: tooltip !== void 0,
     data: props.data,
@@ -2163,7 +2228,8 @@ var margin = {
   left: 20,
   bottom: 5
 };
-var BarChart = (props) => {
+var BarChart = (_a) => {
+  var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
   const [activeIndex, setActiveIndex] = import_react5.default.useState(void 0);
   const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
   const renderChildren3 = (props2) => {
@@ -2201,7 +2267,9 @@ var BarChart = (props) => {
   };
   return /* @__PURE__ */ import_react5.default.createElement(ResponsiveContainer, {
     width: props.width,
-    height: props.height
+    height: props.height,
+    isBusy,
+    busyLabel
   }, /* @__PURE__ */ import_react5.default.createElement(import_recharts6.BarChart, __spreadProps(__spreadValues({}, props), {
     accessibilityLayer: tooltip !== void 0,
     barCategoryGap: "5%",
@@ -2284,11 +2352,14 @@ var renderChildren2 = (props) => {
     }
   });
 };
-var LineChart = (props) => {
+var LineChart = (_a) => {
+  var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
   const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
   return /* @__PURE__ */ import_react8.default.createElement(ResponsiveContainer, {
     width: props.width,
-    height: props.height
+    height: props.height,
+    isBusy,
+    busyLabel
   }, /* @__PURE__ */ import_react8.default.createElement(import_recharts11.LineChart, {
     data: props.data,
     style: { stroke: "#fff", strokeWidth: 1 },
@@ -2320,30 +2391,6 @@ var import_recharts13 = require("recharts");
 
 // src/charts/PieChart/ChartValue.tsx
 var import_react9 = __toESM(require("react"));
-
-// src/utils/tailwind.ts
-var import_classnames = __toESM(require("classnames"));
-function cleanClassNames(classNames) {
-  const tokens = classNames.split(/\s+/);
-  return tokens.filter((item) => item).join(" ");
-}
-function tw(classesOrModifiers1, classesOrModifiers2, classesOrModifiers3, classesOrModifiers4, classesOrModifiers5, classesOrModifiers6, classesOrModifiers7, classesOrModifiers8, classesOrModifiers9, classesOrModifiers10) {
-  const result = (0, import_classnames.default)(
-    classesOrModifiers1,
-    classesOrModifiers2,
-    classesOrModifiers3,
-    classesOrModifiers4,
-    classesOrModifiers5,
-    classesOrModifiers6,
-    classesOrModifiers7,
-    classesOrModifiers8,
-    classesOrModifiers9,
-    classesOrModifiers10
-  );
-  return cleanClassNames(result);
-}
-
-// src/charts/PieChart/ChartValue.tsx
 var ChartValue = (props) => {
   const { value, unit: unit2, caption } = props;
   return /* @__PURE__ */ import_react9.default.createElement("p", {
@@ -2411,7 +2458,14 @@ var renderPieChildren = (children) => {
 
 // src/charts/PieChart/DoughnutChart.tsx
 var refSize = 300;
-var DoughnutChart = (props) => {
+var DoughnutChart = (_a) => {
+  var _b = _a, {
+    isBusy,
+    busyLabel
+  } = _b, props = __objRest(_b, [
+    "isBusy",
+    "busyLabel"
+  ]);
   const [containerWidth, setContainerWidth] = import_react12.default.useState(0);
   const [containerHeight, setContainerHeight] = import_react12.default.useState(0);
   const [activeIndex, setActiveIndex] = import_react12.default.useState(null);
@@ -2423,10 +2477,10 @@ var DoughnutChart = (props) => {
     setContainerHeight(h);
   };
   const renderChartValue = ({ formattedGraphicalItems }) => {
-    var _a, _b, _c;
+    var _a2, _b2, _c;
     const pie2 = formattedGraphicalItems == null ? void 0 : formattedGraphicalItems[0];
-    const props2 = (_a = pie2 == null ? void 0 : pie2.props) != null ? _a : {};
-    const cx = (_b = props2.cx) != null ? _b : containerWidth / 2;
+    const props2 = (_a2 = pie2 == null ? void 0 : pie2.props) != null ? _a2 : {};
+    const cx = (_b2 = props2.cx) != null ? _b2 : containerWidth / 2;
     const cy = (_c = props2.cy) != null ? _c : containerHeight / 2;
     if (!containerWidth || !containerHeight || (0, import_isNil.default)(chartValue)) {
       return null;
@@ -2447,9 +2501,11 @@ var DoughnutChart = (props) => {
   };
   const highlightActive = activeIndex !== null && tooltip;
   return /* @__PURE__ */ import_react12.default.createElement(ResponsiveContainer, {
-    onResize,
     width: props.width,
-    height: props.height
+    height: props.height,
+    isBusy,
+    busyLabel,
+    onResize
   }, /* @__PURE__ */ import_react12.default.createElement(import_recharts13.PieChart, null, chartValue && /* @__PURE__ */ import_react12.default.createElement(import_recharts13.Customized, {
     component: renderChartValue
   }), pie && /* @__PURE__ */ import_react12.default.createElement(import_recharts13.Pie, __spreadProps(__spreadValues({}, pie.props), {
@@ -2473,10 +2529,13 @@ DoughnutChart.Cell = import_recharts13.Cell;
 // src/charts/PieChart/PieChart.tsx
 var import_react13 = __toESM(require("react"));
 var import_recharts14 = require("recharts");
-var PieChart = (props) => {
+var PieChart = (_a) => {
+  var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
   return /* @__PURE__ */ import_react13.default.createElement(ResponsiveContainer, {
     width: props.width,
-    height: props.height
+    height: props.height,
+    isBusy,
+    busyLabel
   }, /* @__PURE__ */ import_react13.default.createElement(import_recharts14.PieChart, {
     width: 500,
     height: 500

package/dist/charts.mjs

@@ -1935,10 +1935,72 @@ var Axis = {
 // src/charts/Container/Container.tsx
 import React2 from "react";
 import { ResponsiveContainer as _ResponsiveContainer } from "recharts";
-var ResponsiveContainer = (props) => /* @__PURE__ */ React2.createElement(_ResponsiveContainer, __spreadValues({
-  width: "100%",
-  height: "100%"
-}, props));
+
+// src/utils/tailwind.ts
+import originalClassNames from "classnames";
+function cleanClassNames(classNames2) {
+  const tokens = classNames2.split(/\s+/);
+  return tokens.filter((item) => item).join(" ");
+}
+function tw(classesOrModifiers1, classesOrModifiers2, classesOrModifiers3, classesOrModifiers4, classesOrModifiers5, classesOrModifiers6, classesOrModifiers7, classesOrModifiers8, classesOrModifiers9, classesOrModifiers10) {
+  const result = originalClassNames(
+    classesOrModifiers1,
+    classesOrModifiers2,
+    classesOrModifiers3,
+    classesOrModifiers4,
+    classesOrModifiers5,
+    classesOrModifiers6,
+    classesOrModifiers7,
+    classesOrModifiers8,
+    classesOrModifiers9,
+    classesOrModifiers10
+  );
+  return cleanClassNames(result);
+}
+var classNames = (...args) => {
+  const result = originalClassNames(...args);
+  return cleanClassNames(result);
+};
+
+// src/charts/Container/Container.tsx
+var ResponsiveContainer = (_a) => {
+  var _b = _a, {
+    isBusy = false,
+    busyLabel = "Loading...",
+    className,
+    style,
+    width = "100%",
+    height = "100%",
+    minWidth,
+    minHeight,
+    maxHeight
+  } = _b, props = __objRest(_b, [
+    "isBusy",
+    "busyLabel",
+    "className",
+    "style",
+    "width",
+    "height",
+    "minWidth",
+    "minHeight",
+    "maxHeight"
+  ]);
+  return /* @__PURE__ */ React2.createElement("div", {
+    "aria-busy": isBusy,
+    className: classNames(className, tw("relative")),
+    style: __spreadProps(__spreadValues({}, style), { width, height, minWidth, minHeight, maxHeight })
+  }, /* @__PURE__ */ React2.createElement(_ResponsiveContainer, __spreadValues({}, props)), /* @__PURE__ */ React2.createElement("div", {
+    className: classNames(tw("absolute inset-0 transition-colors flex items-center justify-center"), {
+      "bg-[rgb(255,255,255)]/50 delay-300": isBusy
+    })
+  }, /* @__PURE__ */ React2.createElement("span", {
+    "aria-hidden": !isBusy,
+    className: tw("rounded-full text-white bg-black typography-caption py-2 px-4 transition-all", {
+      "opacity-100 delay-300": isBusy,
+      "mb-[-20px] opacity-0": !isBusy
+    })
+  }, isBusy && busyLabel)));
+};
 
 // src/charts/Grid/Grid.tsx
 import React3 from "react";
@@ -1996,11 +2058,14 @@ var renderChildren = (props) => {
     }
   });
 };
-var AreaChart = (props) => {
+var AreaChart = (_a) => {
+  var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
   const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
   return /* @__PURE__ */ React4.createElement(ResponsiveContainer, {
     width: props.width,
-    height: props.height
+    height: props.height,
+    isBusy,
+    busyLabel
   }, /* @__PURE__ */ React4.createElement(_AreaChart, {
     accessibilityLayer: tooltip !== void 0,
     data: props.data,
@@ -2043,7 +2108,8 @@ var margin = {
   left: 20,
   bottom: 5
 };
-var BarChart = (props) => {
+var BarChart = (_a) => {
+  var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
   const [activeIndex, setActiveIndex] = React5.useState(void 0);
   const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
   const renderChildren3 = (props2) => {
@@ -2081,7 +2147,9 @@ var BarChart = (props) => {
   };
   return /* @__PURE__ */ React5.createElement(ResponsiveContainer, {
     width: props.width,
-    height: props.height
+    height: props.height,
+    isBusy,
+    busyLabel
   }, /* @__PURE__ */ React5.createElement(_BarChart, __spreadProps(__spreadValues({}, props), {
     accessibilityLayer: tooltip !== void 0,
     barCategoryGap: "5%",
@@ -2164,11 +2232,14 @@ var renderChildren2 = (props) => {
     }
   });
 };
-var LineChart = (props) => {
+var LineChart = (_a) => {
+  var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
   const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
   return /* @__PURE__ */ React8.createElement(ResponsiveContainer, {
     width: props.width,
-    height: props.height
+    height: props.height,
+    isBusy,
+    busyLabel
   }, /* @__PURE__ */ React8.createElement(_LineChart, {
     data: props.data,
     style: { stroke: "#fff", strokeWidth: 1 },
@@ -2200,30 +2271,6 @@ import { Cell as Cell2, Customized, Pie as _Pie, PieChart as _PieChart } from "r
 
 // src/charts/PieChart/ChartValue.tsx
 import React9 from "react";
-
-// src/utils/tailwind.ts
-import originalClassNames from "classnames";
-function cleanClassNames(classNames) {
-  const tokens = classNames.split(/\s+/);
-  return tokens.filter((item) => item).join(" ");
-}
-function tw(classesOrModifiers1, classesOrModifiers2, classesOrModifiers3, classesOrModifiers4, classesOrModifiers5, classesOrModifiers6, classesOrModifiers7, classesOrModifiers8, classesOrModifiers9, classesOrModifiers10) {
-  const result = originalClassNames(
-    classesOrModifiers1,
-    classesOrModifiers2,
-    classesOrModifiers3,
-    classesOrModifiers4,
-    classesOrModifiers5,
-    classesOrModifiers6,
-    classesOrModifiers7,
-    classesOrModifiers8,
-    classesOrModifiers9,
-    classesOrModifiers10
-  );
-  return cleanClassNames(result);
-}
-
-// src/charts/PieChart/ChartValue.tsx
 var ChartValue = (props) => {
   const { value, unit: unit2, caption } = props;
   return /* @__PURE__ */ React9.createElement("p", {
@@ -2291,7 +2338,14 @@ var renderPieChildren = (children) => {
 
 // src/charts/PieChart/DoughnutChart.tsx
 var refSize = 300;
-var DoughnutChart = (props) => {
+var DoughnutChart = (_a) => {
+  var _b = _a, {
+    isBusy,
+    busyLabel
+  } = _b, props = __objRest(_b, [
+    "isBusy",
+    "busyLabel"
+  ]);
   const [containerWidth, setContainerWidth] = React12.useState(0);
   const [containerHeight, setContainerHeight] = React12.useState(0);
   const [activeIndex, setActiveIndex] = React12.useState(null);
@@ -2303,10 +2357,10 @@ var DoughnutChart = (props) => {
     setContainerHeight(h);
   };
   const renderChartValue = ({ formattedGraphicalItems }) => {
-    var _a, _b, _c;
+    var _a2, _b2, _c;
     const pie2 = formattedGraphicalItems == null ? void 0 : formattedGraphicalItems[0];
-    const props2 = (_a = pie2 == null ? void 0 : pie2.props) != null ? _a : {};
-    const cx = (_b = props2.cx) != null ? _b : containerWidth / 2;
+    const props2 = (_a2 = pie2 == null ? void 0 : pie2.props) != null ? _a2 : {};
+    const cx = (_b2 = props2.cx) != null ? _b2 : containerWidth / 2;
     const cy = (_c = props2.cy) != null ? _c : containerHeight / 2;
     if (!containerWidth || !containerHeight || isNil(chartValue)) {
       return null;
@@ -2327,9 +2381,11 @@ var DoughnutChart = (props) => {
   };
   const highlightActive = activeIndex !== null && tooltip;
   return /* @__PURE__ */ React12.createElement(ResponsiveContainer, {
-    onResize,
     width: props.width,
-    height: props.height
+    height: props.height,
+    isBusy,
+    busyLabel,
+    onResize
   }, /* @__PURE__ */ React12.createElement(_PieChart, null, chartValue && /* @__PURE__ */ React12.createElement(Customized, {
     component: renderChartValue
   }), pie && /* @__PURE__ */ React12.createElement(_Pie, __spreadProps(__spreadValues({}, pie.props), {
@@ -2353,10 +2409,13 @@ DoughnutChart.Cell = Cell2;
 // src/charts/PieChart/PieChart.tsx
 import React13 from "react";
 import { Cell as Cell3, Pie as _Pie2, PieChart as _PieChart2 } from "recharts";
-var PieChart = (props) => {
+var PieChart = (_a) => {
+  var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
   return /* @__PURE__ */ React13.createElement(ResponsiveContainer, {
     width: props.width,
-    height: props.height
+    height: props.height,
+    isBusy,
+    busyLabel
   }, /* @__PURE__ */ React13.createElement(_PieChart2, {
     width: 500,
     height: 500

package/dist/src/charts/AreaChart/AreaChart.d.ts

@@ -1,10 +1,11 @@
 import React from 'react';
 import { Area as _Area, AreaChart as _AreaChart, type AreaProps } from 'recharts';
+import { type ContainerProps } from '../../../src/charts/Container/Container';
 import { type ChartProps } from '../../../src/charts/lib/utils';
 declare type ComposedAreaChart = {
     Area: typeof Area;
 };
-declare type AreaChartProps = ChartProps & React.ComponentProps<typeof _AreaChart>;
+declare type AreaChartProps = ChartProps & ContainerProps & React.ComponentProps<typeof _AreaChart>;
 export declare const AreaChart: ComposedAreaChart & React.FC<AreaChartProps>;
 export declare const Area: ((props: Omit<AreaProps, 'ref'>) => React.JSX.Element) & typeof _Area;
 export {};

package/dist/src/charts/AreaChart/AreaChart.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import React from 'react';
 import { Area as _Area, AreaChart as _AreaChart } from 'recharts';
 import { Axis, renderXAxis, renderXTimeAxis, renderYAxis } from '../../../src/charts/Axis/Axis';
@@ -26,9 +37,10 @@ const renderChildren = (props) => {
         }
     });
 };
-export const AreaChart = (props) => {
+export const AreaChart = (_a) => {
+    var { isBusy, busyLabel } = _a, props = __rest(_a, ["isBusy", "busyLabel"]);
     const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
-    return (React.createElement(ResponsiveContainer, { width: props.width, height: props.height },
+    return (React.createElement(ResponsiveContainer, { width: props.width, height: props.height, isBusy: isBusy, busyLabel: busyLabel },
         React.createElement(_AreaChart, { accessibilityLayer: tooltip !== undefined, data: props.data, style: { stroke: '#fff', strokeWidth: 1 }, margin: {
                 top: 20,
                 right: 30,
@@ -47,4 +59,4 @@ Area.defaultProps = Object.assign({}, _Area.defaultProps, {
     fill: undefined,
 });
 AreaChart.Area = Area;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQXJlYUNoYXJ0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NoYXJ0cy9BcmVhQ2hhcnQvQXJlYUNoYXJ0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUFFLElBQUksSUFBSSxLQUFLLEVBQUUsU0FBUyxJQUFJLFVBQVUsRUFBa0IsTUFBTSxVQUFVLENBQUM7QUFFbEYsT0FBTyxFQUFFLElBQUksRUFBRSxXQUFXLEVBQUUsZUFBZSxFQUFFLFdBQVcsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ3ZGLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLGdDQUFnQyxDQUFDO0FBQ3JFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUNyRCxPQUFPLEVBQW1CLHlCQUF5QixFQUFFLGNBQWMsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ2xHLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQVFyRCxNQUFNLGNBQWMsR0FBRyxDQUFDLEtBQXFCLEVBQUUsRUFBRTtJQUMvQyxPQUFPLEtBQUssQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxRQUFRLEVBQUUsQ0FBQyxLQUFLLEVBQUUsRUFBRTtRQUNsRCxJQUFJLENBQUMsS0FBSyxFQUFFO1lBQ1YsT0FBTyxLQUFLLENBQUM7U0FDZDtRQUVELFFBQVEsY0FBYyxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsRUFBRTtZQUNsQyxLQUFLLElBQUksQ0FBQyxLQUFLLENBQUMsV0FBVyxDQUFDLENBQUM7Z0JBQzNCLE9BQU8sV0FBVyxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQzthQUNsQztZQUVELEtBQUssSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUM7Z0JBQ2hDLE9BQU8sZUFBZSxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQzthQUN0QztZQUVELEtBQUssSUFBSSxDQUFDLEtBQUssQ0FBQyxXQUFXLENBQUMsQ0FBQztnQkFDM0IsT0FBTyxXQUFXLENBQUMsS0FBSyxFQUFFLEtBQUssQ0FBQyxDQUFDO2FBQ2xDO1lBRUQsT0FBTyxDQUFDLENBQUM7Z0JBQ1AsT0FBTyxLQUFLLENBQUM7YUFDZDtTQUNGO0lBQ0gsQ0FBQyxDQUFDLENBQUM7QUFDTCxDQUFDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxTQUFTLEdBQWlELENBQUMsS0FBSyxFQUFFLEVBQUU7SUFDL0UsTUFBTSxDQUFDLE9BQU8sQ0FBQyxHQUFHLHlCQUF5QixDQUFDLEtBQUssQ0FBQyxRQUFRLEVBQUUsT0FBTyxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBRWpGLE9BQU8sQ0FDTCxvQkFBQyxtQkFBbUIsSUFBQyxLQUFLLEVBQUUsS0FBSyxDQUFDLEtBQUssRUFBRSxNQUFNLEVBQUUsS0FBSyxDQUFDLE1BQU07UUFDM0Qsb0JBQUMsVUFBVSxJQUNULGtCQUFrQixFQUFFLE9BQU8sS0FBSyxTQUFTLEVBQ3pDLElBQUksRUFBRSxLQUFLLENBQUMsSUFBSSxFQUNoQixLQUFLLEVBQUUsRUFBRSxNQUFNLEVBQUUsTUFBTSxFQUFFLFdBQVcsRUFBRSxDQUFDLEVBQUUsRUFDekMsTUFBTSxFQUFFO2dCQUNOLEdBQUcsRUFBRSxFQUFFO2dCQUNQLEtBQUssRUFBRSxFQUFFO2dCQUNULElBQUksRUFBRSxFQUFFO2dCQUNSLE1BQU0sRUFBRSxDQUFDO2FBQ1Y7WUFFRCxvQkFBQyxhQUFhLE9BQUc7WUFDaEIsY0FBYyxDQUFDLEtBQUssQ0FBQyxDQUNYLENBQ08sQ0FDdkIsQ0FBQztBQUNKLENBQUMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLElBQUksR0FBRyxNQUFNLENBQUMsTUFBTSxDQUMvQixDQUFDLEtBQTZCLEVBQUUsRUFBRTs7SUFBQyxPQUFBLENBQ2pDLG9CQUFDLEtBQUssa0JBQ0osSUFBSSxFQUFDLFVBQVUsRUFDZixXQUFXLEVBQUUsQ0FBQyxFQUNkLEdBQUcsRUFBRSxLQUFLLElBQ04sS0FBSyxJQUNULElBQUksRUFBRSxNQUFBLEtBQUssQ0FBQyxJQUFJLG1DQUFJLEtBQUssQ0FBQyxNQUFNLEVBQ2hDLFdBQVcsRUFBRSxHQUFHLEVBQ2hCLGlCQUFpQixFQUFFLEtBQUssSUFDeEIsQ0FDSCxDQUFBO0NBQUEsRUFDRCxLQUFLLENBQ04sQ0FBQztBQUVGLElBQUksQ0FBQyxZQUFZLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQyxFQUFFLEVBQUUsS0FBSyxDQUFDLFlBQVksRUFBRTtJQUN4RCxXQUFXLEVBQUUsR0FBRztJQUNoQixJQUFJLEVBQUUsU0FBUztDQUNoQixDQUFDLENBQUM7QUFFSCxTQUFTLENBQUMsSUFBSSxHQUFHLElBQUksQ0FBQyJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQXJlYUNoYXJ0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NoYXJ0cy9BcmVhQ2hhcnQvQXJlYUNoYXJ0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBQUUsSUFBSSxJQUFJLEtBQUssRUFBRSxTQUFTLElBQUksVUFBVSxFQUFrQixNQUFNLFVBQVUsQ0FBQztBQUVsRixPQUFPLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRSxlQUFlLEVBQUUsV0FBVyxFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDdkYsT0FBTyxFQUF1QixtQkFBbUIsRUFBRSxNQUFNLGdDQUFnQyxDQUFDO0FBQzFGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUNyRCxPQUFPLEVBQW1CLHlCQUF5QixFQUFFLGNBQWMsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ2xHLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQVFyRCxNQUFNLGNBQWMsR0FBRyxDQUFDLEtBQXFCLEVBQUUsRUFBRTtJQUMvQyxPQUFPLEtBQUssQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxRQUFRLEVBQUUsQ0FBQyxLQUFLLEVBQUUsRUFBRTtRQUNsRCxJQUFJLENBQUMsS0FBSyxFQUFFO1lBQ1YsT0FBTyxLQUFLLENBQUM7U0FDZDtRQUVELFFBQVEsY0FBYyxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsRUFBRTtZQUNsQyxLQUFLLElBQUksQ0FBQyxLQUFLLENBQUMsV0FBVyxDQUFDLENBQUM7Z0JBQzNCLE9BQU8sV0FBVyxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQzthQUNsQztZQUVELEtBQUssSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUM7Z0JBQ2hDLE9BQU8sZUFBZSxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQzthQUN0QztZQUVELEtBQUssSUFBSSxDQUFDLEtBQUssQ0FBQyxXQUFXLENBQUMsQ0FBQztnQkFDM0IsT0FBTyxXQUFXLENBQUMsS0FBSyxFQUFFLEtBQUssQ0FBQyxDQUFDO2FBQ2xDO1lBRUQsT0FBTyxDQUFDLENBQUM7Z0JBQ1AsT0FBTyxLQUFLLENBQUM7YUFDZDtTQUNGO0lBQ0gsQ0FBQyxDQUFDLENBQUM7QUFDTCxDQUFDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxTQUFTLEdBQWlELENBQUMsRUFBK0IsRUFBRSxFQUFFO1FBQW5DLEVBQUUsTUFBTSxFQUFFLFNBQVMsT0FBWSxFQUFQLEtBQUssY0FBN0IsdUJBQStCLENBQUY7SUFDbkcsTUFBTSxDQUFDLE9BQU8sQ0FBQyxHQUFHLHlCQUF5QixDQUFDLEtBQUssQ0FBQyxRQUFRLEVBQUUsT0FBTyxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBRWpGLE9BQU8sQ0FDTCxvQkFBQyxtQkFBbUIsSUFBQyxLQUFLLEVBQUUsS0FBSyxDQUFDLEtBQUssRUFBRSxNQUFNLEVBQUUsS0FBSyxDQUFDLE1BQU0sRUFBRSxNQUFNLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxTQUFTO1FBQ2pHLG9CQUFDLFVBQVUsSUFDVCxrQkFBa0IsRUFBRSxPQUFPLEtBQUssU0FBUyxFQUN6QyxJQUFJLEVBQUUsS0FBSyxDQUFDLElBQUksRUFDaEIsS0FBSyxFQUFFLEVBQUUsTUFBTSxFQUFFLE1BQU0sRUFBRSxXQUFXLEVBQUUsQ0FBQyxFQUFFLEVBQ3pDLE1BQU0sRUFBRTtnQkFDTixHQUFHLEVBQUUsRUFBRTtnQkFDUCxLQUFLLEVBQUUsRUFBRTtnQkFDVCxJQUFJLEVBQUUsRUFBRTtnQkFDUixNQUFNLEVBQUUsQ0FBQzthQUNWO1lBRUQsb0JBQUMsYUFBYSxPQUFHO1lBQ2hCLGNBQWMsQ0FBQyxLQUFLLENBQUMsQ0FDWCxDQUNPLENBQ3ZCLENBQUM7QUFDSixDQUFDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxJQUFJLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FDL0IsQ0FBQyxLQUE2QixFQUFFLEVBQUU7O0lBQUMsT0FBQSxDQUNqQyxvQkFBQyxLQUFLLGtCQUNKLElBQUksRUFBQyxVQUFVLEVBQ2YsV0FBVyxFQUFFLENBQUMsRUFDZCxHQUFHLEVBQUUsS0FBSyxJQUNOLEtBQUssSUFDVCxJQUFJLEVBQUUsTUFBQSxLQUFLLENBQUMsSUFBSSxtQ0FBSSxLQUFLLENBQUMsTUFBTSxFQUNoQyxXQUFXLEVBQUUsR0FBRyxFQUNoQixpQkFBaUIsRUFBRSxLQUFLLElBQ3hCLENBQ0gsQ0FBQTtDQUFBLEVBQ0QsS0FBSyxDQUNOLENBQUM7QUFFRixJQUFJLENBQUMsWUFBWSxHQUFHLE1BQU0sQ0FBQyxNQUFNLENBQUMsRUFBRSxFQUFFLEtBQUssQ0FBQyxZQUFZLEVBQUU7SUFDeEQsV0FBVyxFQUFFLEdBQUc7SUFDaEIsSUFBSSxFQUFFLFNBQVM7Q0FDaEIsQ0FBQyxDQUFDO0FBRUgsU0FBUyxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMifQ==

package/dist/src/charts/BarChart/BarChart.d.ts

@@ -1,12 +1,13 @@
 import React from 'react';
 import { Bar as _Bar, BarChart as _BarChart, type BarProps } from 'recharts';
+import { type ContainerProps } from '../../../src/charts/Container/Container';
 import { type ChartProps } from '../../../src/charts/lib/utils';
 import { Tooltip } from '../../../src/charts/Tooltip/Tooltip';
 declare type ComposedBarChart = {
     Bar: typeof Bar;
     Tooltip: typeof Tooltip;
 };
-declare type BarChartProps = ChartProps & React.ComponentProps<typeof _BarChart>;
+declare type BarChartProps = ChartProps & ContainerProps & React.ComponentProps<typeof _BarChart>;
 export declare const BarChart: ComposedBarChart & React.FC<BarChartProps>;
 export declare const Bar: ((props: Omit<BarProps, 'ref'>) => React.JSX.Element) & typeof _Bar;
 export {};

package/dist/src/charts/BarChart/BarChart.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import React from 'react';
 import { Bar as _Bar, BarChart as _BarChart, Rectangle } from 'recharts';
 import { Axis, renderXAxis, renderXTimeAxis, renderYAxis } from '../../../src/charts/Axis/Axis';
@@ -16,7 +27,8 @@ const margin = {
     left: 20,
     bottom: 5,
 };
-export const BarChart = (props) => {
+export const BarChart = (_a) => {
+    var { isBusy, busyLabel } = _a, props = __rest(_a, ["isBusy", "busyLabel"]);
     const [activeIndex, setActiveIndex] = React.useState(undefined);
     const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
     const renderChildren = (props) => {
@@ -53,7 +65,7 @@ export const BarChart = (props) => {
             }
         });
     };
-    return (React.createElement(ResponsiveContainer, { width: props.width, height: props.height },
+    return (React.createElement(ResponsiveContainer, { width: props.width, height: props.height, isBusy: isBusy, busyLabel: busyLabel },
         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 }),
             React.createElement(CartesianGrid, null),
             renderChildren(props))));
@@ -61,4 +73,4 @@ export const BarChart = (props) => {
 export const Bar = Object.assign((props) => React.createElement(_Bar, Object.assign({}, props, { isAnimationActive: false })), _Bar);
 BarChart.Bar = Bar;
 BarChart.Tooltip = Tooltip;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmFyQ2hhcnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY2hhcnRzL0JhckNoYXJ0L0JhckNoYXJ0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUFFLEdBQUcsSUFBSSxJQUFJLEVBQUUsUUFBUSxJQUFJLFNBQVMsRUFBaUIsU0FBUyxFQUFFLE1BQU0sVUFBVSxDQUFDO0FBRXhGLE9BQU8sRUFBRSxJQUFJLEVBQUUsV0FBVyxFQUFFLGVBQWUsRUFBRSxXQUFXLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUN2RixPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQztBQUNyRSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDckQsT0FBTyxFQUFtQix5QkFBeUIsRUFBRSxjQUFjLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUNsRyxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFTckQ7Ozs7R0FJRztBQUNILE1BQU0sTUFBTSxHQUFHO0lBQ2IsR0FBRyxFQUFFLEVBQUU7SUFDUCxLQUFLLEVBQUUsRUFBRTtJQUNULElBQUksRUFBRSxFQUFFO0lBQ1IsTUFBTSxFQUFFLENBQUM7Q0FDVixDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUErQyxDQUFDLEtBQUssRUFBRSxFQUFFO0lBQzVFLE1BQU0sQ0FBQyxXQUFXLEVBQUUsY0FBYyxDQUFDLEdBQUcsS0FBSyxDQUFDLFFBQVEsQ0FBcUIsU0FBUyxDQUFDLENBQUM7SUFDcEYsTUFBTSxDQUFDLE9BQU8sQ0FBQyxHQUFHLHlCQUF5QixDQUFDLEtBQUssQ0FBQyxRQUFRLEVBQUUsT0FBTyxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBRWpGLE1BQU0sY0FBYyxHQUFHLENBQUMsS0FBb0IsRUFBRSxFQUFFO1FBQzlDLE9BQU8sS0FB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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmFyQ2hhcnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY2hhcnRzL0JhckNoYXJ0L0JhckNoYXJ0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBQUUsR0FBRyxJQUFJLElBQUksRUFBRSxRQUFRLElBQUksU0FBUyxFQUFpQixTQUFTLEVBQUUsTUFBTSxVQUFVLENBQUM7QUFFeEYsT0FBTyxFQUFFLElBQUksRUFBRSxXQUFXLEVBQUUsZUFBZSxFQUFFLFdBQVcsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ3ZGLE9BQU8sRUFBdUIsbUJBQW1CLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQztBQUMxRixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDckQsT0FBTyxFQUFtQix5QkFBeUIsRUFBRSxjQUFjLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUNsRyxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFTckQ7Ozs7R0FJRztBQUNILE1BQU0sTUFBTSxHQUFHO0lBQ2IsR0FBRyxFQUFFLEVBQUU7SUFDUCxLQUFLLEVBQUUsRUFBRTtJQUNULElBQUksRUFBRSxFQUFFO0lBQ1IsTUFBTSxFQUFFLENBQUM7Q0FDVixDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUErQyxDQUFDLEVBQStCLEVBQUUsRUFBRTtRQUFuQyxFQUFFLE1BQU0sRUFBRSxTQUFTLE9BQVksRUFBUCxLQUFLLGNBQTdCLHVCQUErQixDQUFGO0lBQ2hHLE1BQU0sQ0FBQyxXQUFXLEVBQUUsY0FBYyxDQUFDLEdBQUcsS0FBSyxDQUFDLFFBQVEsQ0FBcUIsU0FBUyxDQUFDLENBQUM7SUFDcEYsTUFBTSxDQUFDLE9BQU8sQ0FBQyxHQUFHLHlCQUF5QixDQUFDLEtBQUssQ0FBQyxRQUFRLEVBQUUsT0FBTyxDQUFD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

package/dist/src/charts/Container/Container.d.ts

@@ -1,3 +1,13 @@
 import React from 'react';
 import { type ResponsiveContainerProps } from 'recharts';
-export declare const ResponsiveContainer: (props: ResponsiveContainerProps) => React.JSX.Element;
+export declare type ContainerProps = {
+    /**
+     * When true, the chart will have a visual indication that it is busy.
+     */
+    isBusy?: boolean;
+    /**
+     * Optional label for the busy state.
+     */
+    busyLabel?: string;
+};
+export declare const ResponsiveContainer: ({ isBusy, busyLabel, className, style, width, height, minWidth, minHeight, maxHeight, ...props }: ContainerProps & ResponsiveContainerProps) => React.JSX.Element;

package/dist/src/charts/Container/Container.js

@@ -1,4 +1,28 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import React from 'react';
 import { ResponsiveContainer as _ResponsiveContainer } from 'recharts';
-export const ResponsiveContainer = (props) => (React.createElement(_ResponsiveContainer, Object.assign({ width: "100%", height: "100%" }, props)));
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29udGFpbmVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NoYXJ0cy9Db250YWluZXIvQ29udGFpbmVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUFFLG1CQUFtQixJQUFJLG9CQUFvQixFQUFpQyxNQUFNLFVBQVUsQ0FBQztBQUV0RyxNQUFNLENBQUMsTUFBTSxtQkFBbUIsR0FBRyxDQUFDLEtBQStCLEVBQUUsRUFBRSxDQUFDLENBQ3RFLG9CQUFDLG9CQUFvQixrQkFBQyxLQUFLLEVBQUMsTUFBTSxFQUFDLE1BQU0sRUFBQyxNQUFNLElBQUssS0FBSyxFQUFJLENBQy9ELENBQUMifQ==
+import { classNames, tw } from '../../../src/utils/tailwind';
+export const ResponsiveContainer = (_a) => {
+    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"]);
+    return (React.createElement("div", { "aria-busy": isBusy, className: classNames(className, tw('relative')), style: Object.assign(Object.assign({}, style), { width, height, minWidth, minHeight, maxHeight }) },
+        React.createElement(_ResponsiveContainer, Object.assign({}, props)),
+        React.createElement("div", { className: classNames(tw('absolute inset-0 transition-colors flex items-center justify-center'), {
+                // Our TS typings don't like this bg definition, so it's outside the tw() function.
+                'bg-[rgb(255,255,255)]/50 delay-300': isBusy,
+            }) },
+            React.createElement("span", { "aria-hidden": !isBusy, className: tw('rounded-full text-white bg-black typography-caption py-2 px-4 transition-all', {
+                    'opacity-100 delay-300': isBusy,
+                    'mb-[-20px] opacity-0': !isBusy,
+                }) }, isBusy && busyLabel))));
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ29udGFpbmVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NoYXJ0cy9Db250YWluZXIvQ29udGFpbmVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBQUUsbUJBQW1CLElBQUksb0JBQW9CLEVBQWlDLE1BQU0sVUFBVSxDQUFDO0FBRXRHLE9BQU8sRUFBRSxVQUFVLEVBQUUsRUFBRSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFjcEQsTUFBTSxDQUFDLE1BQU0sbUJBQW1CLEdBQUcsQ0FBQyxFQVdRLEVBQUUsRUFBRTtRQVhaLEVBQ2xDLE1BQU0sR0FBRyxLQUFLLEVBQ2QsU0FBUyxHQUFHLFlBQVksRUFDeEIsU0FBUyxFQUNULEtBQUssRUFDTCxLQUFLLEdBQUcsTUFBTSxFQUNkLE1BQU0sR0FBRyxNQUFNLEVBQ2YsUUFBUSxFQUNSLFNBQVMsRUFDVCxTQUFTLE9BRWlDLEVBRHZDLEtBQUssY0FWMEIsc0dBV25DLENBRFM7SUFDdUMsT0FBQSxDQUMvQywwQ0FDYSxNQUFNLEVBQ2pCLFNBQVMsRUFBRSxVQUFVLENBQUMsU0FBUyxFQUFFLEVBQUUsQ0FBQyxVQUFVLENBQUMsQ0FBQyxFQUNoRCxLQUFLLGtDQUFPLEtBQUssS0FBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFFBQVEsRUFBRSxTQUFTLEVBQUUsU0FBUztRQUVoRSxvQkFBQyxvQkFBb0Isb0JBQUssS0FBSyxFQUFJO1FBQ25DLDZCQUNFLFNBQVMsRUFBRSxVQUFVLENBQUMsRUFBRSxDQUFDLHFFQUFxRSxDQUFDLEVBQUU7Z0JBQy9GLG1GQUFtRjtnQkFDbkYsb0NBQW9DLEVBQUUsTUFBTTthQUM3QyxDQUFDO1lBRUYsNkNBQ2UsQ0FBQyxNQUFNLEVBQ3BCLFNBQVMsRUFBRSxFQUFFLENBQUMsOEVBQThFLEVBQUU7b0JBQzVGLHVCQUF1QixFQUFFLE1BQU07b0JBQy9CLHNCQUFzQixFQUFFLENBQUMsTUFBTTtpQkFDaEMsQ0FBQyxJQUVELE1BQU0sSUFBSSxTQUFTLENBQ2YsQ0FDSCxDQUNGLENBQ1AsQ0FBQTtDQUFBLENBQUMifQ==

package/dist/src/charts/LineChart/LineChart.d.ts

@@ -1,10 +1,11 @@
 import React from 'react';
 import { Line as _Line, LineChart as _LineChart, type LineProps } from 'recharts';
+import { type ContainerProps } from '../../../src/charts/Container/Container';
 import { type ChartProps } from '../../../src/charts/lib/utils';
 declare type ComposedLineChart = {
     Line: typeof Line;
 };
-declare type LineChartProps = ChartProps & React.ComponentProps<typeof _LineChart>;
+declare type LineChartProps = ChartProps & ContainerProps & React.ComponentProps<typeof _LineChart>;
 export declare const LineChart: ComposedLineChart & React.FC<LineChartProps>;
 export declare const Line: ((props: Omit<LineProps, 'ref'>) => React.JSX.Element) & typeof _Line;
 export {};