@aivenio/aquarium 2.10.1 → 2.11.1

package/dist/charts.mjs

@@ -87,24 +87,37 @@ var ResponsiveContainer = (_a) => {
     "minHeight",
     "maxHeight"
   ]);
-  return /* @__PURE__ */ React.createElement("div", {
-    "aria-busy": isBusy,
-    className: classNames(className, tw("relative")),
-    style: __spreadProps(__spreadValues({}, style), { width, height, minWidth, minHeight, maxHeight })
-  }, /* @__PURE__ */ React.createElement("div", {
-    className: classNames(
-      tw("absolute inset-0 transition-colors flex items-center justify-center", {
-        "delay-300 z-40": isBusy
-      })
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      "aria-busy": isBusy,
+      className: classNames(className, tw("relative")),
+      style: __spreadProps(__spreadValues({}, style), { width, height, minWidth, minHeight, maxHeight })
+    },
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: classNames(
+          tw("absolute inset-0 transition-colors flex items-center justify-center", {
+            "delay-300 z-40": isBusy
+          })
+        ),
+        style: isBusy ? { backgroundColor: "rgba(255, 255, 255, 0.5)" } : {}
+      },
+      /* @__PURE__ */ 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
+      )
     ),
-    style: isBusy ? { backgroundColor: "rgba(255, 255, 255, 0.5)" } : {}
-  }, /* @__PURE__ */ 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)), /* @__PURE__ */ React.createElement(_ResponsiveContainer, __spreadValues({}, props)));
+    /* @__PURE__ */ React.createElement(_ResponsiveContainer, __spreadValues({}, props))
+  );
 };
 
 // src/charts/DefaultPalette/DefaultPalette.tsx
@@ -878,20 +891,14 @@ var DefaultPalette = ({ palette = "primary", children }) => {
     },
     [colors]
   );
-  return /* @__PURE__ */ React2.createElement(DefaultPaletteContext.Provider, {
-    value: { getDefaultColor }
-  }, children);
+  return /* @__PURE__ */ React2.createElement(DefaultPaletteContext.Provider, { value: { getDefaultColor } }, children);
 };
 
 // src/charts/Grid/Grid.tsx
 import React3 from "react";
 import { CartesianGrid as _CartesianGrid } from "recharts";
 var CartesianGrid = Object.assign(
-  (props) => /* @__PURE__ */ React3.createElement(_CartesianGrid, __spreadProps(__spreadValues({
-    strokeDasharray: "3 3"
-  }, props), {
-    vertical: false
-  })),
+  (props) => /* @__PURE__ */ React3.createElement(_CartesianGrid, __spreadProps(__spreadValues({ strokeDasharray: "3 3" }, props), { vertical: false })),
   _CartesianGrid
 );
 
@@ -2739,11 +2746,7 @@ YAxis.displayName = "Axis.YAxis";
 var renderXAxis = (child, chartProps) => {
   const _a = child.props, { tickLine = false, ticks: ticks2, domain } = _a, props = __objRest(_a, ["tickLine", "ticks", "domain"]);
   const xticks = getXAxisTicks(__spreadValues({ domain }, child.props), chartProps);
-  return /* @__PURE__ */ React5.createElement(_XAxis, __spreadValues({
-    tickLine,
-    ticks: xticks,
-    domain
-  }, props));
+  return /* @__PURE__ */ React5.createElement(_XAxis, __spreadValues({ tickLine, ticks: xticks, domain }, props));
 };
 var renderXTimeAxis = (child, chartProps) => {
   const _a = child.props, { tickLine = false, ticks: ticks2, domain, utc = true } = _a, props = __objRest(_a, ["tickLine", "ticks", "domain", "utc"]);
@@ -2751,21 +2754,21 @@ var renderXTimeAxis = (child, chartProps) => {
   const normalizedDomain = normalizeAxisDomain(domain);
   const [min, max] = getXAxisExtent(chartProps.data, child.props.dataKey);
   const effectiveDomain = normalizedDomain != null ? normalizedDomain : min !== void 0 && max !== void 0 ? [Number(min), Number(max)] : ["auto", "auto"];
-  return /* @__PURE__ */ React5.createElement(_XAxis, __spreadValues({
-    scale: utc ? "utc" : "time",
-    type: "number",
-    allowDataOverflow: true,
-    domain: effectiveDomain,
-    tickLine,
-    ticks: xticks
-  }, props));
+  return /* @__PURE__ */ React5.createElement(
+    _XAxis,
+    __spreadValues({
+      scale: utc ? "utc" : "time",
+      type: "number",
+      allowDataOverflow: true,
+      domain: effectiveDomain,
+      tickLine,
+      ticks: xticks
+    }, props)
+  );
 };
 var renderYAxis = (child, _props) => {
   const _a = child.props, { axisLine = false, tickLine = false } = _a, props = __objRest(_a, ["axisLine", "tickLine"]);
-  return /* @__PURE__ */ React5.createElement(_YAxis, __spreadValues({
-    axisLine,
-    tickLine
-  }, props));
+  return /* @__PURE__ */ React5.createElement(_YAxis, __spreadValues({ axisLine, tickLine }, props));
 };
 var Axis = {
   XAxis,
@@ -2823,9 +2826,7 @@ var TooltipContentWrapper = (_a) => {
   if (isFunction(content)) {
     return React6.createElement(content, propsWithPayload);
   }
-  return /* @__PURE__ */ React6.createElement(Tooltip.DefaultContent, __spreadProps(__spreadValues({}, props), {
-    payload
-  }));
+  return /* @__PURE__ */ React6.createElement(Tooltip.DefaultContent, __spreadProps(__spreadValues({}, props), { payload }));
 };
 
 // src/charts/lib/utils.tsx
@@ -2864,9 +2865,7 @@ var renderChartChildren = (child, chartProps) => {
       return renderYAxis(child, chartProps);
     }
     case Tooltip.displayName: {
-      return React7.cloneElement(child, { content: /* @__PURE__ */ React7.createElement(TooltipContentWrapper, {
-        content: child.props.content
-      }) });
+      return React7.cloneElement(child, { content: /* @__PURE__ */ React7.createElement(TooltipContentWrapper, { content: child.props.content }) });
     }
     default: {
       return child;
@@ -2927,34 +2926,35 @@ var AreaChart = (_a) => {
     "palette"
   ]);
   const [tooltip] = extractChildByDisplayName(props.children, Tooltip.displayName);
-  return /* @__PURE__ */ React8.createElement(DefaultPalette, {
-    palette
-  }, /* @__PURE__ */ React8.createElement(ResponsiveContainer, {
-    width: props.width,
-    height: props.height,
-    isBusy,
-    busyLabel
-  }, /* @__PURE__ */ React8.createElement(_AreaChart, {
-    accessibilityLayer: tooltip !== void 0,
-    data: props.data,
-    style: { stroke: "#fff", strokeWidth: 1 },
-    margin
-  }, /* @__PURE__ */ React8.createElement(CartesianGrid, null), React8.Children.map(props.children, (child) => renderChartChildren(child, props)))));
+  return /* @__PURE__ */ React8.createElement(DefaultPalette, { palette }, /* @__PURE__ */ React8.createElement(ResponsiveContainer, { width: props.width, height: props.height, isBusy, busyLabel }, /* @__PURE__ */ React8.createElement(
+    _AreaChart,
+    {
+      accessibilityLayer: tooltip !== void 0,
+      data: props.data,
+      style: { stroke: "#fff", strokeWidth: 1 },
+      margin
+    },
+    /* @__PURE__ */ React8.createElement(CartesianGrid, null),
+    React8.Children.map(props.children, (child) => renderChartChildren(child, props))
+  )));
 };
 var Area = Object.assign((props) => {
   var _a;
   const stroke = useDefaultColor(props.dataKey.toString(), props.stroke);
   const fill = useDefaultColor(props.dataKey.toString(), (_a = props.fill) != null ? _a : stroke);
-  return /* @__PURE__ */ React8.createElement(_Area, __spreadProps(__spreadValues({
-    type: "linear",
-    strokeWidth: 2,
-    dot: false
-  }, props), {
-    stroke,
-    fill,
-    fillOpacity: 0.1,
-    isAnimationActive: false
-  }));
+  return /* @__PURE__ */ React8.createElement(
+    _Area,
+    __spreadProps(__spreadValues({
+      type: "linear",
+      strokeWidth: 2,
+      dot: false
+    }, props), {
+      stroke,
+      fill,
+      fillOpacity: 0.1,
+      isAnimationActive: false
+    })
+  );
 }, _Area);
 Area.defaultProps = Object.assign({}, _Area.defaultProps, {
   fillOpacity: 0.1,
@@ -2988,19 +2988,17 @@ var BarChart = (_a) => {
       switch (getDisplayName(child.type)) {
         case _Bar.displayName: {
           return React9.cloneElement(child, {
-            shape: (props3) => /* @__PURE__ */ React9.createElement(Rectangle, __spreadProps(__spreadValues({}, props3), {
-              className: activeIndex !== void 0 ? "inactive" : void 0
-            }))
+            shape: (props3) => /* @__PURE__ */ React9.createElement(Rectangle, __spreadProps(__spreadValues({}, props3), { className: activeIndex !== void 0 ? "inactive" : void 0 }))
           });
         }
         case Tooltip.displayName: {
-          return /* @__PURE__ */ React9.createElement(Tooltip, __spreadProps(__spreadValues({}, child.props), {
-            content: /* @__PURE__ */ React9.createElement(TooltipContentWrapper, {
-              content: child.props.content,
-              tooltipColor: "fill"
-            }),
-            cursor: false
-          }));
+          return /* @__PURE__ */ React9.createElement(
+            Tooltip,
+            __spreadProps(__spreadValues({}, child.props), {
+              content: /* @__PURE__ */ React9.createElement(TooltipContentWrapper, { content: child.props.content, tooltipColor: "fill" }),
+              cursor: false
+            })
+          );
         }
         default: {
           return renderChartChildren(child, props2);
@@ -3008,28 +3006,23 @@ var BarChart = (_a) => {
       }
     });
   };
-  return /* @__PURE__ */ React9.createElement(DefaultPalette, {
-    palette
-  }, /* @__PURE__ */ React9.createElement(ResponsiveContainer, {
-    width: props.width,
-    height: props.height,
-    isBusy,
-    busyLabel
-  }, /* @__PURE__ */ React9.createElement(_BarChart, __spreadProps(__spreadValues({}, props), {
-    accessibilityLayer: tooltip !== void 0,
-    barCategoryGap: "5%",
-    style: { stroke: "#fff", strokeWidth: 1 },
-    onMouseMove: (state) => setActiveIndex(state.isTooltipActive ? state.activeTooltipIndex : void 0),
-    onMouseLeave: () => setActiveIndex(void 0),
-    margin
-  }), /* @__PURE__ */ React9.createElement(CartesianGrid, null), renderChildren(props))));
+  return /* @__PURE__ */ React9.createElement(DefaultPalette, { palette }, /* @__PURE__ */ React9.createElement(ResponsiveContainer, { width: props.width, height: props.height, isBusy, busyLabel }, /* @__PURE__ */ React9.createElement(
+    _BarChart,
+    __spreadProps(__spreadValues({}, props), {
+      accessibilityLayer: tooltip !== void 0,
+      barCategoryGap: "5%",
+      style: { stroke: "#fff", strokeWidth: 1 },
+      onMouseMove: (state) => setActiveIndex(state.isTooltipActive ? state.activeTooltipIndex : void 0),
+      onMouseLeave: () => setActiveIndex(void 0),
+      margin
+    }),
+    /* @__PURE__ */ React9.createElement(CartesianGrid, null),
+    renderChildren(props)
+  )));
 };
 var Bar = Object.assign((props) => {
   const fill = useDefaultColor(props.dataKey.toString(), props.fill);
-  return /* @__PURE__ */ React9.createElement(_Bar, __spreadProps(__spreadValues({}, props), {
-    fill,
-    isAnimationActive: false
-  }));
+  return /* @__PURE__ */ React9.createElement(_Bar, __spreadProps(__spreadValues({}, props), { fill, isAnimationActive: false }));
 }, _Bar);
 BarChart.Bar = Bar;
 BarChart.Tooltip = Tooltip;
@@ -3042,18 +3035,11 @@ import {} from "recharts";
 import React10 from "react";
 import { Label as _Label, LabelList as _LabelList } from "recharts";
 var XLabel = Object.assign(
-  (props) => /* @__PURE__ */ React10.createElement(_Label, __spreadValues({
-    position: "insideBottom",
-    offset: CHART_XLABEL_DEFAULT_OFFSET
-  }, props)),
+  (props) => /* @__PURE__ */ React10.createElement(_Label, __spreadValues({ position: "insideBottom", offset: CHART_XLABEL_DEFAULT_OFFSET }, props)),
   _Label
 );
 var YLabel = Object.assign(
-  (props) => /* @__PURE__ */ React10.createElement(_Label, __spreadValues({
-    position: "insideLeft",
-    angle: -90,
-    offset: CHART_YLABEL_DEFAULT_OFFSET
-  }, props)),
+  (props) => /* @__PURE__ */ React10.createElement(_Label, __spreadValues({ position: "insideLeft", angle: -90, offset: CHART_YLABEL_DEFAULT_OFFSET }, props)),
   _Label
 );
 var Label = {
@@ -3069,12 +3055,13 @@ import {
   Legend as _Legend
 } from "recharts";
 var Legend = React11.forwardRef((props, _ref) => {
-  return /* @__PURE__ */ React11.createElement(_Legend, __spreadProps(__spreadValues({}, props), {
-    margin: __spreadProps(__spreadValues({}, props.margin), { top: 0 }),
-    content: /* @__PURE__ */ React11.createElement(LegendContentWrapper, {
-      content: props.content
+  return /* @__PURE__ */ React11.createElement(
+    _Legend,
+    __spreadProps(__spreadValues({}, props), {
+      margin: __spreadProps(__spreadValues({}, props.margin), { top: 0 }),
+      content: /* @__PURE__ */ React11.createElement(LegendContentWrapper, { content: props.content })
     })
-  }));
+  );
 });
 Legend.displayName = "Legend";
 Legend.defaultProps = {
@@ -3101,9 +3088,7 @@ var LegendContentWrapper = (_a) => {
       color: (_a3 = entry.color) != null ? _a3 : getDefaultColor("dataKey" in entry && typeof entry.dataKey === "string" ? entry.dataKey : "unknown")
     });
   });
-  return /* @__PURE__ */ React11.createElement(DefaultLegendContent, __spreadProps(__spreadValues({}, props), {
-    payload
-  }));
+  return /* @__PURE__ */ React11.createElement(DefaultLegendContent, __spreadProps(__spreadValues({}, props), { payload }));
 };
 
 // src/charts/LineChart/LineChart.tsx
@@ -3122,31 +3107,22 @@ var LineChart = (_a) => {
     "palette"
   ]);
   const [tooltip] = extractChildByDisplayName(props.children, Tooltip2.displayName);
-  return /* @__PURE__ */ React12.createElement(DefaultPalette, {
-    palette
-  }, /* @__PURE__ */ React12.createElement(ResponsiveContainer, {
-    width: props.width,
-    height: props.height,
-    isBusy,
-    busyLabel
-  }, /* @__PURE__ */ React12.createElement(_LineChart, {
-    data: props.data,
-    style: { stroke: "#fff", strokeWidth: 1 },
-    margin,
-    accessibilityLayer: tooltip !== void 0
-  }, /* @__PURE__ */ React12.createElement(CartesianGrid, null), React12.Children.map(props.children, (child) => renderChartChildren(child, props)))));
+  return /* @__PURE__ */ React12.createElement(DefaultPalette, { palette }, /* @__PURE__ */ React12.createElement(ResponsiveContainer, { width: props.width, height: props.height, isBusy, busyLabel }, /* @__PURE__ */ React12.createElement(
+    _LineChart,
+    {
+      data: props.data,
+      style: { stroke: "#fff", strokeWidth: 1 },
+      margin,
+      accessibilityLayer: tooltip !== void 0
+    },
+    /* @__PURE__ */ React12.createElement(CartesianGrid, null),
+    React12.Children.map(props.children, (child) => renderChartChildren(child, props))
+  )));
 };
 var Line = Object.assign((props) => {
   var _a, _b;
   const stroke = useDefaultColor((_b = (_a = props.dataKey) == null ? void 0 : _a.toString()) != null ? _b : "unknown", props.stroke);
-  return /* @__PURE__ */ React12.createElement(_Line, __spreadProps(__spreadValues({
-    type: "linear"
-  }, props), {
-    stroke,
-    strokeWidth: 2,
-    isAnimationActive: false,
-    dot: false
-  }));
+  return /* @__PURE__ */ React12.createElement(_Line, __spreadProps(__spreadValues({ type: "linear" }, props), { stroke, strokeWidth: 2, isAnimationActive: false, dot: false }));
 }, _Line);
 Line.defaultProps = Object.assign({}, _Line.defaultProps, { stroke: void 0, fill: void 0 });
 LineChart.Line = Line;
@@ -3160,13 +3136,17 @@ import { Cell as Cell2, Customized, Pie as _Pie, PieChart as _PieChart } from "r
 import React13 from "react";
 var ChartValue = (props) => {
   const { value, unit: unit2, caption } = props;
-  return /* @__PURE__ */ React13.createElement("p", {
-    className: tw(
-      "typography-large-heading text-intense text-center leading-tight absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2"
-    )
-  }, value, unit2, caption && /* @__PURE__ */ React13.createElement("span", {
-    className: tw("block", "typography-small text-default")
-  }, caption));
+  return /* @__PURE__ */ React13.createElement(
+    "p",
+    {
+      className: tw(
+        "typography-large-heading text-intense text-center leading-tight absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2"
+      )
+    },
+    value,
+    unit2,
+    caption && /* @__PURE__ */ React13.createElement("span", { className: tw("block", "typography-small text-default") }, caption)
+  );
 };
 
 // src/charts/PieChart/renderPieChildren.tsx
@@ -3180,10 +3160,7 @@ var renderPieChildren = (children, opts = {}) => {
     switch (getDisplayName(child.type)) {
       case Tooltip.displayName: {
         return React14.cloneElement(child, {
-          content: /* @__PURE__ */ React14.createElement(TooltipContentWrapper, {
-            content: child.props.content,
-            tooltipColor: opts.tooltipColor
-          }),
+          content: /* @__PURE__ */ React14.createElement(TooltipContentWrapper, { content: child.props.content, tooltipColor: opts.tooltipColor }),
           labelStyle: { paddingBottom: 0 }
         });
       }
@@ -3205,9 +3182,7 @@ var DoughnutChart = (_a) => {
   } = _b, props = __objRest(_b, [
     "palette"
   ]);
-  return /* @__PURE__ */ React15.createElement(DefaultPalette, {
-    palette
-  }, /* @__PURE__ */ React15.createElement(DoughnutChartWrapper, __spreadValues({}, props)));
+  return /* @__PURE__ */ React15.createElement(DefaultPalette, { palette }, /* @__PURE__ */ React15.createElement(DoughnutChartWrapper, __spreadValues({}, props)));
 };
 var DoughnutChartWrapper = (_a) => {
   var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
@@ -3238,31 +3213,30 @@ var DoughnutChartWrapper = (_a) => {
     const yMargin = (containerHeight - refSize * scale) / 2;
     const x = cx - refSize / 2 * scale;
     const y = (yOffset + yMargin) / scale;
-    return /* @__PURE__ */ React15.createElement("foreignObject", {
-      width: refSize,
-      height: refSize,
-      x,
-      y,
-      transform: `scale(${scale})`
-    }, chartValue);
+    return /* @__PURE__ */ React15.createElement("foreignObject", { width: refSize, height: refSize, x, y, transform: `scale(${scale})` }, chartValue);
   };
   const highlightActive = activeIndex !== null && tooltip;
-  return /* @__PURE__ */ React15.createElement(ResponsiveContainer, {
-    width: props.width,
-    height: props.height,
-    isBusy,
-    busyLabel,
-    onResize
-  }, /* @__PURE__ */ React15.createElement(_PieChart, null, chartValue && /* @__PURE__ */ React15.createElement(Customized, {
-    component: renderChartValue
-  }), doughnut && /* @__PURE__ */ React15.createElement(_Pie, __spreadProps(__spreadValues({}, doughnut.props), {
-    fill: (_a2 = doughnut.props.fill) != null ? _a2 : getDefaultColor(doughnut.props.dataKey),
-    onMouseEnter: (_, index) => setActiveIndex(index),
-    onMouseLeave: () => setActiveIndex(null),
-    activeIndex,
-    inactiveShape: { className: highlightActive ? "inactive" : void 0 },
-    activeShape: { className: highlightActive ? "active" : void 0 }
-  })), renderPieChildren(children, { tooltipColor: "fill" })));
+  return /* @__PURE__ */ React15.createElement(
+    ResponsiveContainer,
+    {
+      width: props.width,
+      height: props.height,
+      isBusy,
+      busyLabel,
+      onResize
+    },
+    /* @__PURE__ */ React15.createElement(_PieChart, null, chartValue && /* @__PURE__ */ React15.createElement(Customized, { component: renderChartValue }), doughnut && /* @__PURE__ */ React15.createElement(
+      _Pie,
+      __spreadProps(__spreadValues({}, doughnut.props), {
+        fill: (_a2 = doughnut.props.fill) != null ? _a2 : getDefaultColor(doughnut.props.dataKey),
+        onMouseEnter: (_, index) => setActiveIndex(index),
+        onMouseLeave: () => setActiveIndex(null),
+        activeIndex,
+        inactiveShape: { className: highlightActive ? "inactive" : void 0 },
+        activeShape: { className: highlightActive ? "active" : void 0 }
+      })
+    ), renderPieChildren(children, { tooltipColor: "fill" }))
+  );
 };
 var Doughnut = Object.assign((props) => /* @__PURE__ */ React15.createElement(_Pie, __spreadValues({}, props)), _Pie);
 Doughnut.defaultProps = Object.assign({}, _Pie.defaultProps, {
@@ -3281,26 +3255,14 @@ import React16 from "react";
 import { Cell as Cell3, Pie as _Pie2, PieChart as _PieChart2 } from "recharts";
 var PieChart = (_a) => {
   var _b = _a, { palette } = _b, props = __objRest(_b, ["palette"]);
-  return /* @__PURE__ */ React16.createElement(DefaultPalette, {
-    palette
-  }, /* @__PURE__ */ React16.createElement(PieChartWrapper, __spreadValues({}, props)));
+  return /* @__PURE__ */ React16.createElement(DefaultPalette, { palette }, /* @__PURE__ */ React16.createElement(PieChartWrapper, __spreadValues({}, props)));
 };
 var PieChartWrapper = (_a) => {
   var _b = _a, { isBusy, busyLabel } = _b, props = __objRest(_b, ["isBusy", "busyLabel"]);
   var _a2;
   const [pie, children] = extractChildByDisplayName(props.children, PieChart.Pie.displayName);
   const { getDefaultColor } = React16.useContext(DefaultPaletteContext);
-  return /* @__PURE__ */ React16.createElement(ResponsiveContainer, {
-    width: props.width,
-    height: props.height,
-    isBusy,
-    busyLabel
-  }, /* @__PURE__ */ React16.createElement(_PieChart2, {
-    width: 500,
-    height: 500
-  }, renderPieChildren(children, { tooltipColor: "fill" }), pie && /* @__PURE__ */ React16.createElement(_Pie2, __spreadProps(__spreadValues({}, pie.props), {
-    fill: (_a2 = pie.props.fill) != null ? _a2 : getDefaultColor(pie.props.dataKey)
-  }))));
+  return /* @__PURE__ */ React16.createElement(ResponsiveContainer, { width: props.width, height: props.height, isBusy, busyLabel }, /* @__PURE__ */ React16.createElement(_PieChart2, { width: 500, height: 500 }, renderPieChildren(children, { tooltipColor: "fill" }), pie && /* @__PURE__ */ React16.createElement(_Pie2, __spreadProps(__spreadValues({}, pie.props), { fill: (_a2 = pie.props.fill) != null ? _a2 : getDefaultColor(pie.props.dataKey) }))));
 };
 var Pie = Object.assign((props) => /* @__PURE__ */ React16.createElement(_Pie2, __spreadValues({}, props)), _Pie2);
 Pie.defaultProps = Object.assign({}, _Pie2.defaultProps, {
@@ -3319,17 +3281,11 @@ import {
   ReferenceLine as _ReferenceLine
 } from "recharts";
 var ReferenceLine = Object.assign(
-  (props) => /* @__PURE__ */ React17.createElement(_ReferenceLine, __spreadProps(__spreadValues({}, props), {
-    strokeDasharray: "9 3",
-    strokeWidth: 2
-  })),
+  (props) => /* @__PURE__ */ React17.createElement(_ReferenceLine, __spreadProps(__spreadValues({}, props), { strokeDasharray: "9 3", strokeWidth: 2 })),
   _ReferenceLine
 );
 var ReferenceArea = Object.assign(
-  (props) => /* @__PURE__ */ React17.createElement(_ReferenceArea, __spreadProps(__spreadValues({}, props), {
-    strokeWidth: 0,
-    fillOpacity: 0.1
-  })),
+  (props) => /* @__PURE__ */ React17.createElement(_ReferenceArea, __spreadProps(__spreadValues({}, props), { strokeWidth: 0, fillOpacity: 0.1 })),
   _ReferenceLine
 );
 var Reference = {

package/dist/src/atoms/Checkbox/Checkbox.d.ts

@@ -5,7 +5,7 @@ export type CheckboxProps = Omit<React.DetailedHTMLProps<React.InputHTMLAttribut
     value?: string;
     indeterminate?: boolean;
 };
-export declare const Checkbox: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref" | "id" | "name" | "type" | "value"> & {
+export declare const Checkbox: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "id" | "name" | "type" | "ref" | "value"> & {
     id?: string;
     name?: string;
     value?: string;

package/dist/src/atoms/Navigation/Navigation.d.ts

@@ -9,6 +9,7 @@ type ComposedNavigationProps = {
     Footer: typeof Footer;
     Section: typeof Section;
     Item: typeof Item;
+    Submenu: typeof Submenu;
     Divider: typeof Divider;
 };
 export declare const Navigation: ComposedNavigationProps & React.FC<UListProps>;
@@ -19,4 +20,14 @@ declare const Divider: React.FC<LIProp>;
 declare const Item: React.FC<LinkProps & {
     active?: boolean;
 }>;
+type ComposedSubMenuProps = {
+    Item: typeof SubmenuItem;
+};
+declare const Submenu: ComposedSubMenuProps & React.FC<Omit<LinkProps, 'title'> & {
+    title: React.ReactNode;
+    id: string;
+}>;
+declare const SubmenuItem: React.FC<LinkProps & {
+    active?: boolean;
+}>;
 export {};

package/dist/src/atoms/Navigation/Navigation.js

@@ -12,8 +12,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React from 'react';
 import { classNames, tw } from '../../../src/utils/tailwind';
 export const Navigation = (_a) => {
-    var { className, children } = _a, rest = __rest(_a, ["className", "children"]);
-    return (React.createElement("nav", { className: classNames(tw('bg-muted h-full')) },
+    var { className, children, 'aria-label': ariaLabel } = _a, rest = __rest(_a, ["className", "children", 'aria-label']);
+    return (React.createElement("nav", { className: classNames(tw('bg-muted h-full')), "aria-label": ariaLabel },
         React.createElement("ul", Object.assign({}, rest, { className: classNames(tw('flex flex-col h-full'), className), role: "menubar" }), children)));
 };
 const Header = (_a) => {
@@ -32,7 +32,7 @@ const Section = (_a) => {
 };
 const Divider = (_a) => {
     var { className } = _a, rest = __rest(_a, ["className"]);
-    return (React.createElement("li", Object.assign({ role: "separator" }, rest, { className: classNames(tw('border-t-2 border-muted'), className) })));
+    return (React.createElement("li", Object.assign({ "aria-hidden": true }, rest, { className: classNames(tw('border-t-2 border-muted'), className) })));
 };
 const Item = (_a) => {
     var { className, active } = _a, rest = __rest(_a, ["className", "active"]);
@@ -42,9 +42,21 @@ const Item = (_a) => {
                 'text-primary-intense': !!active,
             }), className) }))));
 };
+const Submenu = (_a) => {
+    var { children, className, title, id } = _a, rest = __rest(_a, ["children", "className", "title", "id"]);
+    return (React.createElement("li", { role: "presentation" },
+        React.createElement("a", Object.assign({ role: "menuitem", "aria-haspopup": "true", href: "#", id: id, className: classNames(tw('py-3 pr-6 pl-3 hover:bg-default cursor-pointer typography-small focusable flex items-center w-full'), className) }, rest), title),
+        React.createElement("ul", { role: "menu", className: classNames(tw('flex flex-col')), "aria-labelledby": id }, children)));
+};
+const SubmenuItem = (_a) => {
+    var { className, active } = _a, rest = __rest(_a, ["className", "active"]);
+    return (React.createElement(Navigation.Item, Object.assign({}, rest, { active: active, className: classNames(className, tw('pl-[56px]')) })));
+};
+Submenu.Item = SubmenuItem;
 Navigation.Header = Header;
 Navigation.Footer = Footer;
 Navigation.Section = Section;
 Navigation.Item = Item;
+Navigation.Submenu = Submenu;
 Navigation.Divider = Divider;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTmF2aWdhdGlvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9hdG9tcy9OYXZpZ2F0aW9uL05hdmlnYXRpb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7O0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBRTFCLE9BQU8sRUFBRSxVQUFVLEVBQUUsRUFBRSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFjcEQsTUFBTSxDQUFDLE1BQU0sVUFBVSxHQUFtRCxDQUFDLEVBQWdDLEVBQUUsRUFBRTtRQUFwQyxFQUFFLFNBQVMsRUFBRSxRQUFRLE9BQVcsRUFBTixJQUFJLGNBQTlCLHlCQUFnQyxDQUFGO0lBQU8sT0FBQSxDQUM5Ryw2QkFBSyxTQUFTLEVBQUUsVUFBVSxDQUFDLEVBQUUsQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO1FBQy9DLDRDQUFRLElBQUksSUFBRSxTQUFTLEVBQUUsVUFBVSxDQUFDLEVBQUUsQ0FBQyxzQkFBc0IsQ0FBQyxFQUFFLFNBQVMsQ0FBQyxFQUFFLElBQUksRUFBQyxTQUFTLEtBQ3ZGLFFBQVEsQ0FDTixDQUNELENBQ1AsQ0FBQTtDQUFBLENBQUM7QUFFRixNQUFNLE1BQU0sR0FBcUIsQ0FBQyxFQUFzQixFQUFFLEVBQUU7UUFBMUIsRUFBRSxTQUFTLE9BQVcsRUFBTixJQUFJLGNBQXBCLGFBQXNCLENBQUY7SUFBTyxPQUFBLENBQzNELDRDQUFRLElBQUksSUFBRSxJQUFJLEVBQUMsY0FBYyxFQUFDLFNBQVMsRUFBRSxVQUFVLENBQUMsRUFBRSxDQUFDLFdBQVcsQ0FBQyxFQUFFLFNBQVMsQ0FBQyxJQUFJLENBQ3hGLENBQUE7Q0FBQSxDQUFDO0FBRUYsTUFBTSxNQUFNLEdBQXFCLENBQUMsRUFBc0IsRUFBRSxFQUFFO1FBQTFCLEVBQUUsU0FBUyxPQUFXLEVBQU4sSUFBSSxjQUFwQixhQUFzQixDQUFGO0lBQU8sT0FBQSxDQUMzRCw0Q0FBUSxJQUFJLElBQUUsSUFBSSxFQUFDLGNBQWMsRUFBQyxTQUFTLEVBQUUsVUFBVSxDQUFDLEVBQUUsQ0FBQyxtQkFBbUIsQ0FBQyxFQUFFLFNBQVMsQ0FBQyxJQUFJLENBQ2hHLENBQUE7Q0FBQSxDQUFDO0FBRUYsTUFBTSxPQUFPLEdBQXlCLENBQUMsRUFBNkIsRUFBRSxFQUFFO1FBQWpDLEVBQUUsS0FBSyxFQUFFLFNBQVMsT0FBVyxFQUFOLElBQUksY0FBM0Isc0JBQTZCLENBQUY7SUFBTyxPQUFBLENBQ3ZFLDRCQUFJLElBQUksRUFBQyxjQUFjLEVBQUMsU0FBUyxFQUFFLEVBQUUsQ0FBQyxNQUFNLENBQUM7UUFDMUMsS0FBSyxJQUFJLENBQ1IsNkJBQUssU0FBUyxFQUFFLFVBQVUsQ0FBQyxTQUFTLEVBQUUscUVBQXFFLENBQUMsSUFDekcsS0FBSyxDQUNGLENBQ1A7UUFDRCw0Q0FBUSxJQUFJLElBQUUsSUFBSSxFQUFDLE9BQU8sRUFBQyxTQUFTLEVBQUUsVUFBVSxDQUFDLEVBQUUsQ0FBQyxlQUFlLENBQUMsRUFBRSxTQUFTLENBQUMsSUFBSSxDQUNqRixDQUNOLENBQUE7Q0FBQSxDQUFDO0FBRUYsTUFBTSxPQUFPLEdBQXFCLENBQUMsRUFBc0IsRUFBRSxFQUFFO1FBQTFCLEVBQUUsU0FBUyxPQUFXLEVBQU4sSUFBSSxjQUFwQixhQUFzQixDQUFGO0lBQU8sT0FBQSxDQUM1RCwwQ0FBSSxJQUFJLEVBQUMsV0FBVyxJQUFLLElBQUksSUFBRSxTQUFTLEVBQUUsVUFBVSxDQUFDLEVBQUUsQ0FBQyx5QkFBeUIsQ0FBQyxFQUFFLFNBQVMsQ0FBQyxJQUFJLENBQ25HLENBQUE7Q0FBQSxDQUFDO0FBRUYsTUFBTSxJQUFJLEdBQStDLENBQUMsRUFBOEIsRUFBRSxFQUFFO1FBQWxDLEVBQUUsU0FBUyxFQUFFLE1BQU0sT0FBVyxFQUFOLElBQUksY0FBNUIsdUJBQThCLENBQUY7SUFBTyxPQUFBLENBQzNGLDRCQUFJLElBQUksRUFBQyxjQUFjO1FBQ3JCLDJDQUNNLElBQUksSUFDUixJQUFJLEVBQUMsVUFBVSxFQUNmLFNBQVMsRUFBRSxVQUFVLENBQ25CLEVBQUUsQ0FBQyw4RkFBOEYsRUFBRTtnQkFDakcsY0FBYyxFQUFFLENBQUMsTUFBTTtnQkFDdkIsc0JBQXNCLEVBQUUsQ0FBQyxDQUFDLE1BQU07YUFDakMsQ0FBQyxFQUNGLFNBQVMsQ0FDVixJQUNELENBQ0MsQ0FDTixDQUFBO0NBQUEsQ0FBQztBQUVGLFVBQVUsQ0FBQyxNQUFNLEdBQUcsTUFBTSxDQUFDO0FBQzNCLFVBQVUsQ0FBQyxNQUFNLEdBQUcsTUFBTSxDQUFDO0FBQzNCLFVBQVUsQ0FBQyxPQUFPLEdBQUcsT0FBTyxDQUFDO0FBQzdCLFVBQVUsQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDO0FBQ3ZCLFVBQVUsQ0FBQyxPQUFPLEdBQUcsT0FBTyxDQUFDIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTmF2aWdhdGlvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9hdG9tcy9OYXZpZ2F0aW9uL05hdmlnYXRpb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7O0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBRTFCLE9BQU8sRUFBRSxVQUFVLEVBQUUsRUFBRSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFlcEQsTUFBTSxDQUFDLE1BQU0sVUFBVSxHQUFtRCxDQUFDLEVBSzFFLEVBQUUsRUFBRTtRQUxzRSxFQUN6RSxTQUFTLEVBQ1QsUUFBUSxFQUNSLFlBQVksRUFBRSxTQUFTLE9BRXhCLEVBREksSUFBSSxjQUprRSx1Q0FLMUUsQ0FEUTtJQUNILE9BQUEsQ0FDSiw2QkFBSyxTQUFTLEVBQUUsVUFBVSxDQUFDLEVBQUUsQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDLGdCQUFjLFNBQVM7UUFDdEUsNENBQVEsSUFBSSxJQUFFLFNBQVMsRUFBRSxVQUFVLENBQUMsRUFBRSxDQUFDLHNCQUFzQixDQUFDLEVBQUUsU0FBUyxDQUFDLEVBQUUsSUFBSSxFQUFDLFNBQVMsS0FDdkYsUUFBUSxDQUNOLENBQ0QsQ0FDUCxDQUFBO0NBQUEsQ0FBQztBQUVGLE1BQU0sTUFBTSxHQUFxQixDQUFDLEVBQXNCLEVBQUUsRUFBRTtRQUExQixFQUFFLFNBQVMsT0FBVyxFQUFOLElBQUksY0FBcEIsYUFBc0IsQ0FBRjtJQUFPLE9BQUEsQ0FDM0QsNENBQVEsSUFBSSxJQUFFLElBQUksRUFBQyxjQUFjLEVBQUMsU0FBUyxFQUFFLFVBQVUsQ0FBQyxFQUFFLENBQUMsV0FBVyxDQUFDLEVBQUUsU0FBUyxDQUFDLElBQUksQ0FDeEYsQ0FBQTtDQUFBLENBQUM7QUFFRixNQUFNLE1BQU0sR0FBcUIsQ0FBQyxFQUFzQixFQUFFLEVBQUU7UUFBMUIsRUFBRSxTQUFTLE9BQVcsRUFBTixJQUFJLGNBQXBCLGFBQXNCLENBQUY7SUFB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

package/dist/src/atoms/RadioButton/RadioButton.d.ts

@@ -4,7 +4,7 @@ export type RadioButtonProps = Omit<React.DetailedHTMLProps<React.InputHTMLAttri
     name?: string;
     value: string;
 };
-export declare const RadioButton: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref" | "id" | "name" | "type" | "value"> & {
+export declare const RadioButton: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "id" | "name" | "type" | "ref" | "value"> & {
     id?: string;
     name?: string;
     value: string;

package/dist/src/atoms/Switch/Switch.d.ts

@@ -4,7 +4,7 @@ export type SwitchProps = Omit<React.DetailedHTMLProps<React.InputHTMLAttributes
     name?: string;
     value?: string;
 };
-export declare const Switch: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref" | "id" | "name" | "type" | "value"> & {
+export declare const Switch: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "id" | "name" | "type" | "ref" | "value"> & {
     id?: string;
     name?: string;
     value?: string;

package/dist/src/icons/caretDownFilled.d.ts

@@ -0,0 +1,9 @@
+export const __esModule: true;
+export default data;
+declare namespace data {
+    let body: string;
+    let left: number;
+    let top: number;
+    let width: number;
+    let height: number;
+}