@aivenio/aquarium 2.19.0-rc1 → 2.20.0

package/dist/atoms.cjs

@@ -1262,6 +1262,22 @@ var require_creditCard = __commonJS({
   }
 });
 
+// src/icons/creditMemo.js
+var require_creditMemo = __commonJS({
+  "src/icons/creditMemo.js"(exports2) {
+    "use strict";
+    var data = {
+      "body": '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"><path d="M9.333 1.513v2.754c0 .373 0 .56.073.702a.667.667 0 00.291.292c.143.072.33.072.703.072h2.753m.18 1.326c0-.49 0-.734-.055-.964a2.01 2.01 0 00-.24-.578c-.123-.202-.296-.375-.642-.721L10.27 2.271c-.345-.346-.518-.52-.72-.643a2 2 0 00-.578-.24c-.23-.055-.475-.055-.964-.055H5.867c-1.12 0-1.68 0-2.108.218a2 2 0 00-.875.874c-.217.428-.217.988-.217 2.108v6.934c0 1.12 0 1.68.217 2.108a2 2 0 00.875.874c.427.218.987.218 2.108.218h2.14m.502-3.334H5.333M8 8.667H5.333"/><path d="M9.818 12.58c0 .686.556 1.24 1.24 1.24h1.152a1.329 1.329 0 100-2.656h-1.063a1.329 1.329 0 010-2.658h1.152c.684 0 1.24.555 1.24 1.24m-1.86-2.037v.797m0 5.315v.797"/></g>',
+      "left": 0,
+      "top": 0,
+      "width": 16,
+      "height": 16
+    };
+    exports2.__esModule = true;
+    exports2.default = data;
+  }
+});
+
 // src/icons/cross.js
 var require_cross = __commonJS({
   "src/icons/cross.js"(exports2) {
@@ -4268,6 +4284,7 @@ __export(atoms_exports, {
   Table: () => Table,
   Toast: () => Toast,
   Typography: () => Typography,
+  VisuallyHidden: () => VisuallyHidden,
   cellClassNames: () => cellClassNames,
   getAlignClassNames: () => getAlignClassNames,
   getBodyCellClassNames: () => getBodyCellClassNames,
@@ -4289,20 +4306,18 @@ var import_utils2 = require("@react-aria/utils");
 
 // src/molecules/Button/Button.tsx
 var import_react18 = __toESM(require("react"));
-var import_lodash_es4 = require("lodash-es");
+var import_lodash_es7 = require("lodash-es");
 
 // src/molecules/Flexbox/Flexbox.tsx
 var import_react13 = __toESM(require("react"));
 
 // src/molecules/Tailwindify/Tailwindify.tsx
 var import_react12 = __toESM(require("react"));
-var import_lodash_es3 = require("lodash-es");
+var import_lodash_es6 = require("lodash-es");
 
 // src/utils/useStyle.ts
 var import_react11 = require("react");
-var import_get = __toESM(require("lodash/get"));
-var import_isPlainObject2 = __toESM(require("lodash/isPlainObject"));
-var import_isUndefined3 = __toESM(require("lodash/isUndefined"));
+var import_lodash_es5 = require("lodash-es");
 
 // tailwind.theme.json
 var tailwind_theme_default = {
@@ -5233,9 +5248,7 @@ var import_i18n = require("@react-aria/i18n");
 var import_overlays = require("@react-aria/overlays");
 
 // src/utils/breakpoints.ts
-var import_isPlainObject = __toESM(require("lodash/isPlainObject"));
-var import_isUndefined = __toESM(require("lodash/isUndefined"));
-var import_orderBy = __toESM(require("lodash/orderBy"));
+var import_lodash_es = require("lodash-es");
 
 // src/tokens/tokens.json
 var tokens_default = {
@@ -5990,7 +6003,7 @@ var tokens_default = {
 // src/utils/breakpoints.ts
 var { screens: allBreakpoints } = tokens_default;
 var SCREEN_TO_PX_MAPPING = getPxMapping(allBreakpoints);
-var BREAKPOINT_PRIORITY = (0, import_orderBy.default)(
+var BREAKPOINT_PRIORITY = (0, import_lodash_es.orderBy)(
   Object.keys(SCREEN_TO_PX_MAPPING).map((key) => {
     return {
       breakpoint: key,
@@ -6015,7 +6028,7 @@ function getPxMapping(breakpoints2) {
 function getMatches(windowSize) {
   const mapping = getPxMapping(allBreakpoints);
   return Object.keys(allBreakpoints).reduce((acc, key) => {
-    const isMatch = !(0, import_isUndefined.default)(windowSize) && windowSize.width > 0 ? windowSize.width > mapping[key] : key === "default" ? true : false;
+    const isMatch = !(0, import_lodash_es.isUndefined)(windowSize) && windowSize.width > 0 ? windowSize.width > mapping[key] : key === "default" ? true : false;
     return {
       ...acc,
       [key]: isMatch
@@ -6024,10 +6037,10 @@ function getMatches(windowSize) {
 }
 function selectBreakpointValue(value, matches) {
   const bp = BREAKPOINT_PRIORITY.find((bp2) => {
-    const pickBreakpoint = (0, import_isPlainObject.default)(value) && bp2.breakpoint in value ? bp2.breakpoint : void 0;
-    return !(0, import_isUndefined.default)(pickBreakpoint) && matches[bp2.breakpoint];
+    const pickBreakpoint = (0, import_lodash_es.isPlainObject)(value) && bp2.breakpoint in value ? bp2.breakpoint : void 0;
+    return !(0, import_lodash_es.isUndefined)(pickBreakpoint) && matches[bp2.breakpoint];
   });
-  if (!(0, import_isUndefined.default)(bp)) {
+  if (!(0, import_lodash_es.isUndefined)(bp)) {
     return value[bp.breakpoint];
   }
   return value;
@@ -6035,12 +6048,11 @@ function selectBreakpointValue(value, matches) {
 
 // src/utils/useWindowSize.ts
 var import_react = require("react");
-var import_debounce = __toESM(require("lodash/debounce"));
-var import_isUndefined2 = __toESM(require("lodash/isUndefined"));
+var import_lodash_es2 = require("lodash-es");
 
 // src/molecules/Toast/Toast.tsx
 var import_react9 = __toESM(require("react"));
-var import_lodash_es2 = require("lodash-es");
+var import_lodash_es4 = require("lodash-es");
 
 // src/molecules/Spacing/Spacing.tsx
 var import_react5 = __toESM(require("react"));
@@ -6048,7 +6060,7 @@ var import_react5 = __toESM(require("react"));
 // src/molecules/Box/Box.tsx
 var import_react4 = __toESM(require("react"));
 var import_classnames2 = __toESM(require("classnames"));
-var import_lodash_es = require("lodash-es");
+var import_lodash_es3 = require("lodash-es");
 
 // src/molecules/Element/Element.tsx
 var import_react2 = __toESM(require("react"));
@@ -6158,15 +6170,15 @@ var Box = ({
     alignSelf,
     flexDirection,
     flexWrap,
-    paddingTop: (0, import_lodash_es.isUndefined)(paddingY) ? paddingTop : paddingY,
-    paddingRight: (0, import_lodash_es.isUndefined)(paddingX) ? paddingRight : paddingX,
-    paddingBottom: (0, import_lodash_es.isUndefined)(paddingY) ? paddingBottom : paddingY,
-    paddingLeft: (0, import_lodash_es.isUndefined)(paddingX) ? paddingLeft : paddingX,
+    paddingTop: (0, import_lodash_es3.isUndefined)(paddingY) ? paddingTop : paddingY,
+    paddingRight: (0, import_lodash_es3.isUndefined)(paddingX) ? paddingRight : paddingX,
+    paddingBottom: (0, import_lodash_es3.isUndefined)(paddingY) ? paddingBottom : paddingY,
+    paddingLeft: (0, import_lodash_es3.isUndefined)(paddingX) ? paddingLeft : paddingX,
     margin,
-    marginTop: (0, import_lodash_es.isUndefined)(marginY) ? marginTop : marginY,
-    marginRight: (0, import_lodash_es.isUndefined)(marginX) ? marginRight : marginX,
-    marginBottom: (0, import_lodash_es.isUndefined)(marginY) ? marginBottom : marginY,
-    marginLeft: (0, import_lodash_es.isUndefined)(marginX) ? marginLeft : marginX,
+    marginTop: (0, import_lodash_es3.isUndefined)(marginY) ? marginTop : marginY,
+    marginRight: (0, import_lodash_es3.isUndefined)(marginX) ? marginRight : marginX,
+    marginBottom: (0, import_lodash_es3.isUndefined)(marginY) ? marginBottom : marginY,
+    marginLeft: (0, import_lodash_es3.isUndefined)(marginX) ? marginLeft : marginX,
     width,
     height,
     maxWidth,
@@ -6320,6 +6332,7 @@ var import_console = __toESM(require_console());
 var import_container = __toESM(require_container());
 var import_cpuChip = __toESM(require_cpuChip());
 var import_creditCard = __toESM(require_creditCard());
+var import_creditMemo = __toESM(require_creditMemo());
 var import_cross = __toESM(require_cross());
 var import_currencyDollar = __toESM(require_currencyDollar());
 var import_dashboard = __toESM(require_dashboard());
@@ -6535,8 +6548,8 @@ var THEME_MAPPING = {
 };
 function resolveTailwindThemeValue(key, val) {
   const resolvedKey = key in THEME_MAPPING ? THEME_MAPPING[key] : key;
-  const found = (0, import_get.default)(tailwind_theme_default, [resolvedKey, val], void 0) ?? (0, import_get.default)(tailwind_theme_default, [resolvedKey, ...(val ?? "").toString().split("-")], void 0);
-  if (!(0, import_isUndefined3.default)(found)) {
+  const found = (0, import_lodash_es5.get)(tailwind_theme_default, [resolvedKey, val], void 0) ?? (0, import_lodash_es5.get)(tailwind_theme_default, [resolvedKey, ...(val ?? "").toString().split("-")], void 0);
+  if (!(0, import_lodash_es5.isUndefined)(found)) {
     return found;
   }
   return val;
@@ -6545,16 +6558,16 @@ function useStyle(styles) {
   const context2 = (0, import_react11.useContext)(DesignSystemContext);
   return Object.keys(styles).reduce((acc, key) => {
     const property = styles[key];
-    const isStylesObject = (0, import_isPlainObject2.default)(property) && "value" in property;
+    const isStylesObject = (0, import_lodash_es5.isPlainObject)(property) && "value" in property;
     const value = isStylesObject ? property.value : property;
     const resolvedValue = selectBreakpointValue(value, context2.breakpointMatches);
-    const transformer = (0, import_isUndefined3.default)(property?.transformer) ? (val) => resolveTailwindThemeValue(key, val) : (
+    const transformer = (0, import_lodash_es5.isUndefined)(property?.transformer) ? (val) => resolveTailwindThemeValue(key, val) : (
       // Even if transformer is set, we pass it through the default transformer
       // which will resolve possible tailwind theme mapping values
       (val) => resolveTailwindThemeValue(key, property.transformer(val))
     );
     const cssPropertyValue = transformer(resolvedValue);
-    if ((0, import_isUndefined3.default)(cssPropertyValue)) {
+    if ((0, import_lodash_es5.isUndefined)(cssPropertyValue)) {
       return acc;
     }
     return {
@@ -6598,15 +6611,15 @@ function Tailwindify(Component) {
   }) => {
     const tailwindifyStyle = useStyle({
       padding,
-      paddingTop: (0, import_lodash_es3.isUndefined)(paddingY) ? paddingTop : paddingY,
-      paddingRight: (0, import_lodash_es3.isUndefined)(paddingX) ? paddingRight : paddingX,
-      paddingBottom: (0, import_lodash_es3.isUndefined)(paddingY) ? paddingBottom : paddingY,
-      paddingLeft: (0, import_lodash_es3.isUndefined)(paddingX) ? paddingLeft : paddingX,
+      paddingTop: (0, import_lodash_es6.isUndefined)(paddingY) ? paddingTop : paddingY,
+      paddingRight: (0, import_lodash_es6.isUndefined)(paddingX) ? paddingRight : paddingX,
+      paddingBottom: (0, import_lodash_es6.isUndefined)(paddingY) ? paddingBottom : paddingY,
+      paddingLeft: (0, import_lodash_es6.isUndefined)(paddingX) ? paddingLeft : paddingX,
       margin,
-      marginTop: (0, import_lodash_es3.isUndefined)(marginY) ? marginTop : marginY,
-      marginRight: (0, import_lodash_es3.isUndefined)(marginX) ? marginRight : marginX,
-      marginBottom: (0, import_lodash_es3.isUndefined)(marginY) ? marginBottom : marginY,
-      marginLeft: (0, import_lodash_es3.isUndefined)(marginX) ? marginLeft : marginX,
+      marginTop: (0, import_lodash_es6.isUndefined)(marginY) ? marginTop : marginY,
+      marginRight: (0, import_lodash_es6.isUndefined)(marginX) ? marginRight : marginX,
+      marginBottom: (0, import_lodash_es6.isUndefined)(marginY) ? marginBottom : marginY,
+      marginLeft: (0, import_lodash_es6.isUndefined)(marginX) ? marginLeft : marginX,
       backgroundColor,
       width,
       height,
@@ -6631,20 +6644,20 @@ function Tailwindify(Component) {
       const isLastChild = index === children.length - 1;
       const childProps = {};
       const additionalStyle = {};
-      if (!isLastChild && !(0, import_lodash_es3.isUndefined)(space)) {
+      if (!isLastChild && !(0, import_lodash_es6.isUndefined)(space)) {
         additionalStyle.marginBottom = resolveTailwindThemeValue("margin", space);
         additionalStyle.marginRight = resolveTailwindThemeValue("margin", space);
       }
-      if (!isLastChild && !(0, import_lodash_es3.isUndefined)(spaceY)) {
+      if (!isLastChild && !(0, import_lodash_es6.isUndefined)(spaceY)) {
         additionalStyle.marginBottom = resolveTailwindThemeValue("margin", spaceY);
       }
-      if (!isLastChild && !(0, import_lodash_es3.isUndefined)(spaceX)) {
+      if (!isLastChild && !(0, import_lodash_es6.isUndefined)(spaceX)) {
         additionalStyle.marginRight = resolveTailwindThemeValue("margin", spaceX);
       }
       if (Object.keys(childProps).length === 0 && Object.keys(additionalStyle).length === 0) {
         return child;
       }
-      const childStyle = (0, import_lodash_es3.get)(child, ["props", "style"], {});
+      const childStyle = (0, import_lodash_es6.get)(child, ["props", "style"], {});
       const newProps = { ...childProps, style: { ...childStyle, ...additionalStyle } };
       return import_react12.default.cloneElement(child, newProps);
     });
@@ -6718,7 +6731,7 @@ function useTooltipTriggerState(props = {}) {
   const { delay = TOOLTIP_DELAY } = props;
   const { isOpen, open, close } = (0, import_overlays2.useOverlayTriggerState)(props);
   const id = (0, import_react16.useMemo)(() => `${++tooltipId}`, []);
-  const closeTimeout = (0, import_react16.useRef)(null);
+  const closeTimeout = (0, import_react16.useRef)();
   const isUnmounted = (0, import_react16.useRef)(false);
   const ensureTooltipEntry = () => {
     tooltips[id] = hideTooltip;
@@ -7038,7 +7051,7 @@ var asButton = (Component, isDropdownButton) => {
             hasChildren && /* @__PURE__ */ import_react18.default.createElement("div", null, children)
           );
         } else {
-          return /* @__PURE__ */ import_react18.default.createElement(import_react18.default.Fragment, null, children);
+          return children;
         }
       };
       const buttonComponent = /* @__PURE__ */ import_react18.default.createElement(
@@ -7049,7 +7062,7 @@ var asButton = (Component, isDropdownButton) => {
           className: classNames(
             "Aquarium-Button",
             {
-              [`Aquarium-Button.${capitalize((0, import_lodash_es4.camelCase)(kind))}`]: !isIconOnlyButton,
+              [`Aquarium-Button.${capitalize((0, import_lodash_es7.camelCase)(kind))}`]: !isIconOnlyButton,
               "Aquarium-Button.Icon": isIconOnlyButton,
               "Aquarium-Dense": dense,
               "Aquarium-Busy": loading2
@@ -7124,7 +7137,7 @@ Button.GhostDropdown = GhostDropdownButton;
 
 // src/atoms/Typography/Typography.tsx
 var import_react19 = __toESM(require("react"));
-var import_lodash_es5 = require("lodash-es");
+var import_lodash_es8 = require("lodash-es");
 var typographies = Object.fromEntries(Object.keys(tokens_default.typography).map((key) => [key, `typography-${key}`]));
 var Typography = ({
   children,
@@ -7136,7 +7149,7 @@ var Typography = ({
   ...rest
 }) => {
   const HtmlElement = htmlTag;
-  const resolvedColorName = (0, import_lodash_es5.isUndefined)(color) || color === "current" ? "default" : color;
+  const resolvedColorName = (0, import_lodash_es8.isUndefined)(color) || color === "current" ? "default" : color;
   const style = useStyle({ fontWeight });
   return /* @__PURE__ */ import_react19.default.createElement(
     HtmlElement,
@@ -7360,7 +7373,7 @@ Banner2.DismissContainer = ({ layout, children, className, ...rest }) => /* @__P
 
 // src/atoms/Card/Card.tsx
 var import_react24 = __toESM(require("react"));
-var import_lodash_es6 = require("lodash-es");
+var import_lodash_es9 = require("lodash-es");
 
 // src/molecules/Typography/Typography.tsx
 var import_react22 = __toESM(require("react"));
@@ -7524,11 +7537,11 @@ var Image = ({ image, imageAlt, fullSize = false, imageHeight }) => /* @__PURE__
       "h-[174px]": !imageHeight && !fullSize,
       "h-[225px]": !imageHeight && fullSize
     }),
-    style: { height: (0, import_lodash_es6.isNumber)(imageHeight) ? `${imageHeight}px` : imageHeight }
+    style: { height: (0, import_lodash_es9.isNumber)(imageHeight) ? `${imageHeight}px` : imageHeight }
   }
 );
 var Title = (props) => /* @__PURE__ */ import_react24.default.createElement(Box.Flex, { component: "div", alignItems: "center", gap: "2", ...props });
-var Content = ({ className, dense, ...rest }) => /* @__PURE__ */ import_react24.default.createElement("div", { ...rest, className: classNames(tw("flex flex-col", { "gap-4": !dense }), className) });
+var Content = ({ className, dense, ...rest }) => /* @__PURE__ */ import_react24.default.createElement("div", { ...rest, className: classNames(tw("flex flex-col flex-auto", { "gap-4": !dense }), className) });
 var Actions = ({ className, dense, ...rest }) => /* @__PURE__ */ import_react24.default.createElement("div", { ...rest, className: classNames(tw("flex gap-3 items-center", { "pt-3 ": !dense }), className) });
 Card.Label = Label;
 Card.Title = Title;
@@ -7683,7 +7696,7 @@ var TableRow = ({ children, className, disabled, ...rest }) => /* @__PURE__ */ i
   "tr",
   {
     ...rest,
-    ...{ inert: disabled },
+    ...{ inert: disabled ? "" : void 0 },
     className: classNames(rowClassNames, className, {
       "opacity-70": disabled
     })
@@ -7843,7 +7856,7 @@ var Row = ({
     {
       ...rest,
       role: isGroup ? "rowgroup" : "row",
-      ...{ inert: disabled },
+      ...{ inert: disabled ? "" : void 0 },
       className: classNames(tw("contents"), className, {
         "[&>*]:border-b-transparent": noDivider,
         "children:opacity-70": disabled,
@@ -7947,7 +7960,7 @@ var import_react31 = __toESM(require("react"));
 
 // src/atoms/Skeleton/Skeleton.tsx
 var import_react30 = __toESM(require("react"));
-var import_lodash_es7 = require("lodash-es");
+var import_lodash_es10 = require("lodash-es");
 var import_tailwind_variants = require("tailwind-variants");
 var skeletonStyles = (0, import_tailwind_variants.tv)({
   base: "bg-default",
@@ -7978,11 +7991,11 @@ var Skeleton = ({
   ...rest
 }) => {
   const styles = {
-    width: (0, import_lodash_es7.isNumber)(width) ? `${width}px` : width,
-    height: (0, import_lodash_es7.isNumber)(height) ? `${height}px` : height
+    width: (0, import_lodash_es10.isNumber)(width) ? `${width}px` : width,
+    height: (0, import_lodash_es10.isNumber)(height) ? `${height}px` : height
   };
   const classes2 = skeletonStyles({
-    hasHeight: !(0, import_lodash_es7.isUndefined)(height),
+    hasHeight: !(0, import_lodash_es10.isUndefined)(height),
     display,
     rounded,
     animate,
@@ -8143,7 +8156,7 @@ var import_react34 = __toESM(require("react"));
 
 // src/molecules/Grid/Grid.tsx
 var import_react33 = __toESM(require("react"));
-var import_lodash_es8 = require("lodash-es");
+var import_lodash_es11 = require("lodash-es");
 var breakpoints = Object.keys(tokens_default.screens);
 var GridItem = Tailwindify(
   ({
@@ -8163,8 +8176,8 @@ var GridItem = Tailwindify(
     rowEnd,
     ...props
   }) => {
-    const breakPointableProperties = (0, import_lodash_es8.pick)(props, breakpoints);
-    const gridColumn = !(0, import_lodash_es8.isEmpty)(breakPointableProperties) ? (0, import_lodash_es8.mapValues)(breakPointableProperties, (value) => value === "full" ? "1 / -1" : value ? `span-${value}` : "auto") : void 0;
+    const breakPointableProperties = (0, import_lodash_es11.pick)(props, breakpoints);
+    const gridColumn = !(0, import_lodash_es11.isEmpty)(breakPointableProperties) ? (0, import_lodash_es11.mapValues)(breakPointableProperties, (value) => value === "full" ? "1 / -1" : value ? `span-${value}` : "auto") : void 0;
     const hookStyle = useStyle({
       display,
       justifySelf,
@@ -8558,7 +8571,7 @@ var PopoverDialog = {
 
 // src/atoms/ProgressBar/ProgressBar.tsx
 var import_react41 = __toESM(require("react"));
-var import_lodash_es9 = require("lodash-es");
+var import_lodash_es12 = require("lodash-es");
 var ProgressBar = ({ children, className, ...rest }) => /* @__PURE__ */ import_react41.default.createElement(
   "div",
   {
@@ -8574,7 +8587,7 @@ var STATUS_COLORS = {
   error: tw("bg-danger-intense")
 };
 ProgressBar.Indicator = ({ min, max, value, "aria-label": ariaLabel, status, className, ...rest }) => {
-  const completedPercentage = (0, import_lodash_es9.clamp)((value - min) / (max - min) * 100, 0, 100);
+  const completedPercentage = (0, import_lodash_es12.clamp)((value - min) / (max - min) * 100, 0, 100);
   return /* @__PURE__ */ import_react41.default.createElement(
     "div",
     {
@@ -8916,6 +8929,13 @@ var Switch = import_react45.default.forwardRef(
     disabled && /* @__PURE__ */ import_react45.default.createElement(Icon, { icon: import_ban2.default, width: "10px", height: "10px" })
   ))
 );
+
+// src/atoms/VisuallyHidden/VisuallyHidden.tsx
+var import_react46 = __toESM(require("react"));
+var import_visually_hidden = require("@react-aria/visually-hidden");
+var VisuallyHidden = (props) => {
+  return /* @__PURE__ */ import_react46.default.createElement(import_visually_hidden.VisuallyHidden, { ...props });
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Alert,
@@ -8945,6 +8965,7 @@ var Switch = import_react45.default.forwardRef(
   Table,
   Toast,
   Typography,
+  VisuallyHidden,
   cellClassNames,
   getAlignClassNames,
   getBodyCellClassNames,

package/dist/atoms.mjs

@@ -1256,6 +1256,22 @@ var require_creditCard = __commonJS({
   }
 });
 
+// src/icons/creditMemo.js
+var require_creditMemo = __commonJS({
+  "src/icons/creditMemo.js"(exports) {
+    "use strict";
+    var data = {
+      "body": '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"><path d="M9.333 1.513v2.754c0 .373 0 .56.073.702a.667.667 0 00.291.292c.143.072.33.072.703.072h2.753m.18 1.326c0-.49 0-.734-.055-.964a2.01 2.01 0 00-.24-.578c-.123-.202-.296-.375-.642-.721L10.27 2.271c-.345-.346-.518-.52-.72-.643a2 2 0 00-.578-.24c-.23-.055-.475-.055-.964-.055H5.867c-1.12 0-1.68 0-2.108.218a2 2 0 00-.875.874c-.217.428-.217.988-.217 2.108v6.934c0 1.12 0 1.68.217 2.108a2 2 0 00.875.874c.427.218.987.218 2.108.218h2.14m.502-3.334H5.333M8 8.667H5.333"/><path d="M9.818 12.58c0 .686.556 1.24 1.24 1.24h1.152a1.329 1.329 0 100-2.656h-1.063a1.329 1.329 0 010-2.658h1.152c.684 0 1.24.555 1.24 1.24m-1.86-2.037v.797m0 5.315v.797"/></g>',
+      "left": 0,
+      "top": 0,
+      "width": 16,
+      "height": 16
+    };
+    exports.__esModule = true;
+    exports.default = data;
+  }
+});
+
 // src/icons/cross.js
 var require_cross = __commonJS({
   "src/icons/cross.js"(exports) {
@@ -4249,9 +4265,7 @@ import { get as get2, isUndefined as isUndefined5 } from "lodash-es";
 
 // src/utils/useStyle.ts
 import { useContext as useContext2 } from "react";
-import get from "lodash/get";
-import isPlainObject2 from "lodash/isPlainObject";
-import isUndefined4 from "lodash/isUndefined";
+import { get, isPlainObject as isPlainObject2, isUndefined as isUndefined4 } from "lodash-es";
 
 // tailwind.theme.json
 var tailwind_theme_default = {
@@ -5182,9 +5196,7 @@ import { I18nProvider } from "@react-aria/i18n";
 import { ModalProvider } from "@react-aria/overlays";
 
 // src/utils/breakpoints.ts
-import isPlainObject from "lodash/isPlainObject";
-import isUndefined from "lodash/isUndefined";
-import orderBy from "lodash/orderBy";
+import { isPlainObject, isUndefined, orderBy } from "lodash-es";
 
 // src/tokens/tokens.json
 var tokens_default = {
@@ -5984,8 +5996,7 @@ function selectBreakpointValue(value, matches) {
 
 // src/utils/useWindowSize.ts
 import { useEffect, useState } from "react";
-import debounce from "lodash/debounce";
-import isUndefined2 from "lodash/isUndefined";
+import { debounce, isUndefined as isUndefined2 } from "lodash-es";
 
 // src/molecules/Toast/Toast.tsx
 import React8, { createContext, useContext, useEffect as useEffect2, useReducer } from "react";
@@ -6269,6 +6280,7 @@ var import_console = __toESM(require_console());
 var import_container = __toESM(require_container());
 var import_cpuChip = __toESM(require_cpuChip());
 var import_creditCard = __toESM(require_creditCard());
+var import_creditMemo = __toESM(require_creditMemo());
 var import_cross = __toESM(require_cross());
 var import_currencyDollar = __toESM(require_currencyDollar());
 var import_dashboard = __toESM(require_dashboard());
@@ -6670,7 +6682,7 @@ function useTooltipTriggerState(props = {}) {
   const { delay = TOOLTIP_DELAY } = props;
   const { isOpen, open, close } = useOverlayTriggerState(props);
   const id = useMemo2(() => `${++tooltipId}`, []);
-  const closeTimeout = useRef(null);
+  const closeTimeout = useRef();
   const isUnmounted = useRef(false);
   const ensureTooltipEntry = () => {
     tooltips[id] = hideTooltip;
@@ -6990,7 +7002,7 @@ var asButton = (Component, isDropdownButton) => {
             hasChildren && /* @__PURE__ */ React14.createElement("div", null, children)
           );
         } else {
-          return /* @__PURE__ */ React14.createElement(React14.Fragment, null, children);
+          return children;
         }
       };
       const buttonComponent = /* @__PURE__ */ React14.createElement(
@@ -7480,7 +7492,7 @@ var Image = ({ image, imageAlt, fullSize = false, imageHeight }) => /* @__PURE__
   }
 );
 var Title = (props) => /* @__PURE__ */ React20.createElement(Box.Flex, { component: "div", alignItems: "center", gap: "2", ...props });
-var Content = ({ className, dense, ...rest }) => /* @__PURE__ */ React20.createElement("div", { ...rest, className: classNames(tw("flex flex-col", { "gap-4": !dense }), className) });
+var Content = ({ className, dense, ...rest }) => /* @__PURE__ */ React20.createElement("div", { ...rest, className: classNames(tw("flex flex-col flex-auto", { "gap-4": !dense }), className) });
 var Actions = ({ className, dense, ...rest }) => /* @__PURE__ */ React20.createElement("div", { ...rest, className: classNames(tw("flex gap-3 items-center", { "pt-3 ": !dense }), className) });
 Card.Label = Label;
 Card.Title = Title;
@@ -7635,7 +7647,7 @@ var TableRow = ({ children, className, disabled, ...rest }) => /* @__PURE__ */ R
   "tr",
   {
     ...rest,
-    ...{ inert: disabled },
+    ...{ inert: disabled ? "" : void 0 },
     className: classNames(rowClassNames, className, {
       "opacity-70": disabled
     })
@@ -7795,7 +7807,7 @@ var Row = ({
     {
       ...rest,
       role: isGroup ? "rowgroup" : "row",
-      ...{ inert: disabled },
+      ...{ inert: disabled ? "" : void 0 },
       className: classNames(tw("contents"), className, {
         "[&>*]:border-b-transparent": noDivider,
         "children:opacity-70": disabled,
@@ -8868,6 +8880,13 @@ var Switch = React41.forwardRef(
     disabled && /* @__PURE__ */ React41.createElement(Icon, { icon: import_ban2.default, width: "10px", height: "10px" })
   ))
 );
+
+// src/atoms/VisuallyHidden/VisuallyHidden.tsx
+import React42 from "react";
+import { VisuallyHidden as AriaVisuallyHidden } from "@react-aria/visually-hidden";
+var VisuallyHidden = (props) => {
+  return /* @__PURE__ */ React42.createElement(AriaVisuallyHidden, { ...props });
+};
 export {
   Alert,
   Banner2 as Banner,
@@ -8896,6 +8915,7 @@ export {
   Table,
   Toast,
   Typography,
+  VisuallyHidden,
   cellClassNames,
   getAlignClassNames,
   getBodyCellClassNames,

package/dist/charts.cjs

@@ -2887,10 +2887,7 @@ var renderChartChildren = (child, chartProps) => {
       return renderYAxis(child, chartProps);
     }
     case Tooltip.displayName: {
-      const tooltip = child;
-      return import_react7.default.cloneElement(tooltip, {
-        content: /* @__PURE__ */ import_react7.default.createElement(TooltipContentWrapper, { content: tooltip.props.content })
-      });
+      return import_react7.default.cloneElement(child, { content: /* @__PURE__ */ import_react7.default.createElement(TooltipContentWrapper, { content: child.props.content }) });
     }
     default: {
       return child;
@@ -3164,17 +3161,13 @@ var renderPieChildren = (children, opts = {}) => {
     }
     switch (getDisplayName(child.type)) {
       case Tooltip.displayName: {
-        const tooltip = child;
-        return import_react14.default.cloneElement(tooltip, {
-          content: /* @__PURE__ */ import_react14.default.createElement(TooltipContentWrapper, { content: tooltip, tooltipColor: opts.tooltipColor }),
+        return import_react14.default.cloneElement(child, {
+          content: /* @__PURE__ */ import_react14.default.createElement(TooltipContentWrapper, { content: child.props.content, tooltipColor: opts.tooltipColor }),
           labelStyle: { paddingBottom: 0 }
         });
       }
       case import_recharts11.Legend.displayName: {
-        return import_react14.default.cloneElement(child, {
-          verticalAlign: "top",
-          align: "center"
-        });
+        return import_react14.default.cloneElement(child, { verticalAlign: "top", align: "center" });
       }
       default: {
         return child;
@@ -3194,7 +3187,7 @@ var DoughnutChart = ({
 var DoughnutChartWrapper = ({ isBusy, busyLabel, ...props }) => {
   const [containerWidth, setContainerWidth] = import_react15.default.useState(0);
   const [containerHeight, setContainerHeight] = import_react15.default.useState(0);
-  const [activeIndex, setActiveIndex] = import_react15.default.useState(void 0);
+  const [activeIndex, setActiveIndex] = import_react15.default.useState(null);
   const { getDefaultColor } = import_react15.default.useContext(DefaultPaletteContext);
   const [chartValue, _children] = extractChildByDisplayName(props.children, ChartValue.displayName);
   const [doughnut, children] = extractChildByDisplayName(_children, DoughnutChart.Doughnut.displayName);
@@ -3219,7 +3212,7 @@ var DoughnutChartWrapper = ({ isBusy, busyLabel, ...props }) => {
     const y = (yOffset + yMargin) / scale;
     return /* @__PURE__ */ import_react15.default.createElement("foreignObject", { width: refSize, height: refSize, x, y, transform: `scale(${scale})` }, chartValue);
   };
-  const highlightActive = activeIndex !== void 0 && tooltip;
+  const highlightActive = activeIndex !== null && tooltip;
   return /* @__PURE__ */ import_react15.default.createElement(
     ResponsiveContainer,
     {
@@ -3233,10 +3226,9 @@ var DoughnutChartWrapper = ({ isBusy, busyLabel, ...props }) => {
       import_recharts12.Pie,
       {
         ...doughnut.props,
-        ref: void 0,
         fill: doughnut.props.fill ?? getDefaultColor(doughnut.props.dataKey),
         onMouseEnter: (_, index) => setActiveIndex(index),
-        onMouseLeave: () => setActiveIndex(void 0),
+        onMouseLeave: () => setActiveIndex(null),
         activeIndex,
         inactiveShape: { className: highlightActive ? "inactive" : void 0 },
         activeShape: { className: highlightActive ? "active" : void 0 }
@@ -3265,7 +3257,7 @@ var PieChart = ({ palette, ...props }) => {
 var PieChartWrapper = ({ isBusy, busyLabel, ...props }) => {
   const [pie, children] = extractChildByDisplayName(props.children, PieChart.Pie.displayName);
   const { getDefaultColor } = import_react16.default.useContext(DefaultPaletteContext);
-  return /* @__PURE__ */ import_react16.default.createElement(ResponsiveContainer, { width: props.width, height: props.height, isBusy, busyLabel }, /* @__PURE__ */ import_react16.default.createElement(import_recharts13.PieChart, { width: 500, height: 500 }, renderPieChildren(children, { tooltipColor: "fill" }), pie && /* @__PURE__ */ import_react16.default.createElement(import_recharts13.Pie, { ...pie.props, ref: void 0, fill: pie.props.fill ?? getDefaultColor(pie.props.dataKey) })));
+  return /* @__PURE__ */ import_react16.default.createElement(ResponsiveContainer, { width: props.width, height: props.height, isBusy, busyLabel }, /* @__PURE__ */ import_react16.default.createElement(import_recharts13.PieChart, { width: 500, height: 500 }, renderPieChildren(children, { tooltipColor: "fill" }), pie && /* @__PURE__ */ import_react16.default.createElement(import_recharts13.Pie, { ...pie.props, fill: pie.props.fill ?? getDefaultColor(pie.props.dataKey) })));
 };
 var Pie = Object.assign((props) => /* @__PURE__ */ import_react16.default.createElement(import_recharts13.Pie, { ...props }), import_recharts13.Pie);
 Pie.defaultProps = Object.assign({}, import_recharts13.Pie.defaultProps, {