@hitachivantara/uikit-react-core 5.97.0 → 5.99.0

package/dist/cjs/themes/ds3.cjs

@@ -21,6 +21,10 @@ const ds3 = uikitStyles.mergeTheme(uikitStyles.ds3, {
       classes: {
         root: {
           borderRadius: 0
+        },
+        messageIcon: {
+          color: "inherit !important",
+          padding: 0
         }
       }
     },
@@ -486,6 +490,22 @@ const ds3 = uikitStyles.mergeTheme(uikitStyles.ds3, {
       classes: {
         titleText: {
           ...uikitStyles.theme.typography.xxsTitle
+        },
+        root: {
+          "& .HvStatusIcon-root": {
+            padding: 0
+          },
+          "& .HvIconContainer-root": {
+            color: `${uikitStyles.theme.colors.secondary}!important`
+          }
+        }
+      }
+    },
+    HvDialogContent: {
+      classes: {
+        root: {
+          borderTop: "none!important",
+          borderBottom: "none!important"
         }
       }
     },
@@ -1202,6 +1222,9 @@ const ds3 = uikitStyles.mergeTheme(uikitStyles.ds3, {
           maxHeight: "calc(100% - (2 * 100px))"
         }
       }
+    },
+    HvStatusIcon: {
+      type: "simple"
     }
   }
 });

package/dist/cjs/themes/ds5.cjs

@@ -78,6 +78,14 @@ const ds5 = uikitStyles.mergeTheme(uikitStyles.ds5, {
         }
       }
     },
+    HvCallout: {
+      classes: {
+        messageIcon: {
+          color: "inherit !important",
+          padding: 0
+        }
+      }
+    },
     HvDropdownButton: {
       classes: {
         open: {
@@ -118,6 +126,9 @@ const ds5 = uikitStyles.mergeTheme(uikitStyles.ds5, {
         }
       }
     },
+    HvStatusIcon: {
+      type: "simple"
+    },
     HvTab: {
       classes: {
         root: {
@@ -136,6 +147,26 @@ const ds5 = uikitStyles.mergeTheme(uikitStyles.ds5, {
           "--tagColor": uikitStyles.theme.alpha("cat1", 0.2)
         }
       }
+    },
+    HvDialogTitle: {
+      classes: {
+        root: {
+          "& .HvStatusIcon-root": {
+            padding: 0
+          },
+          "& .HvIconContainer-root": {
+            color: `${uikitStyles.theme.colors.secondary}!important`
+          }
+        }
+      }
+    },
+    HvDialogContent: {
+      classes: {
+        root: {
+          borderTop: "none",
+          borderBottom: "none"
+        }
+      }
     }
   }
 });

package/dist/cjs/themes/pentahoPlus.cjs

@@ -53,29 +53,23 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
             {
               backgroundColor: uikitStyles.theme.mix(`${color}Dimmed`, 0.5, "dimmer"),
               "--icolor": uikitStyles.theme.colors[color],
-              "--outline": uikitStyles.theme.colors[`${color}Border`],
-              "--bg": uikitStyles.theme.colors[`${color}Subtle`],
               "--title": uikitStyles.theme.colors[`${color}Deep`]
             }
           ])
         ),
         message: {
           "&&": {
-            color: uikitStyles.theme.colors.secondary
+            color: uikitStyles.theme.colors.text
           }
         },
         messageIcon: {
-          alignSelf: "start",
-          borderRadius: uikitStyles.theme.radii.round,
-          color: "var(--icolor)",
-          outline: `1px solid var(--outline)`,
-          backgroundColor: "var(--bg)"
+          alignSelf: "start"
         },
         messageTitle: {
           color: "var(--title)"
         },
         actionClose: {
-          color: uikitStyles.theme.colors.secondary
+          color: uikitStyles.theme.colors.text
         }
       }
     },
@@ -99,7 +93,7 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
         },
         checked: {
           "--bg-color": uikitStyles.theme.colors.primary,
-          color: uikitStyles.theme.colors.atmo1
+          color: uikitStyles.theme.colors.bgContainer
         }
       }
     },
@@ -156,6 +150,14 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
         }
       }
     },
+    HvSection: {
+      classes: {
+        content: {
+          backgroundColor: uikitStyles.theme.colors.bgPage
+          // = bgContainerSecondary
+        }
+      }
+    },
     HvSelect: {
       classes: {
         root: {
@@ -291,7 +293,7 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
         sm: { fontSize: 20, padding: 2 },
         md: { fontSize: 26, padding: 3 },
         lg: { fontSize: 36, padding: 6 },
-        xl: { fontSize: 48, padding: 8 }
+        xl: { fontSize: 48, padding: 5 }
       }
     },
     HvInlineEditor: {
@@ -299,7 +301,7 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
         button: {
           borderRadius: 2,
           "&:focus": {
-            borderColor: uikitStyles.theme.colors.secondary
+            borderColor: uikitStyles.theme.colors.text
           }
         },
         inputRoot: {
@@ -443,6 +445,25 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
         }
       }
     },
+    HvDialog: {
+      classes: {
+        paper: {
+          borderRadius: uikitStyles.theme.radii.large
+        },
+        statusBar: {
+          border: "none",
+          borderTopLeftRadius: uikitStyles.theme.radii.large,
+          borderTopRightRadius: uikitStyles.theme.radii.large
+        }
+      }
+    },
+    HvDialogActions: {
+      classes: {
+        root: {
+          borderTop: "none"
+        }
+      }
+    },
     HvDropdownButton: {
       classes: {
         disabled: {
@@ -466,7 +487,7 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
     HvHeader: {
       classes: {
         root: {
-          borderBottom: `1px solid ${uikitStyles.theme.colors.atmo3}`,
+          borderBottom: `1px solid ${uikitStyles.theme.colors.borderSubtle}`,
           boxShadow: "none"
         }
       }
@@ -474,7 +495,7 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
     HvHeaderBrand: {
       classes: {
         separator: {
-          backgroundColor: uikitStyles.theme.colors.atmo4,
+          backgroundColor: uikitStyles.theme.colors.border,
           margin: uikitStyles.theme.spacing(0, "md"),
           height: 32
         }
@@ -484,16 +505,16 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
       classes: {
         active: {
           boxShadow: "none",
-          borderBottom: `1px solid ${uikitStyles.theme.colors.atmo3}`
+          borderBottom: `1px solid ${uikitStyles.theme.colors.borderSubtle}`
         },
         list: {
           "& li:hover > .HvHeader-MenuBar-hidden": {
             boxShadow: "none",
-            borderBottom: `1px solid ${uikitStyles.theme.colors.atmo3}`
+            borderBottom: `1px solid ${uikitStyles.theme.colors.borderSubtle}`
           },
           "& li:focus-within > .HvHeader-MenuBar-hidden": {
             boxShadow: "none",
-            borderBottom: `1px solid ${uikitStyles.theme.colors.atmo3}`
+            borderBottom: `1px solid ${uikitStyles.theme.colors.borderSubtle}`
           }
         }
       }
@@ -502,7 +523,7 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
       classes: {
         root: {
           width: 280,
-          color: uikitStyles.theme.colors.base_light,
+          color: uikitStyles.theme.colors.textLight,
           backgroundColor: uikitStyles.slate[900],
           borderRight: `1px solid ${uikitStyles.slate[500]}`,
           "& > :not(nav:first-of-type)": {
@@ -618,12 +639,14 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
         },
         selectable: {
           ":hover": {
-            outlineColor: uikitStyles.theme.colors.bgHover,
-            backgroundColor: uikitStyles.theme.colors.primaryDimmed
+            outlineColor: uikitStyles.theme.colors.primarySubtle,
+            backgroundColor: uikitStyles.theme.colors.bgHover
           }
         },
         selected: {
-          outlineColor: uikitStyles.theme.colors.primaryDeep
+          "&,&:hover,&:focus": {
+            outlineColor: uikitStyles.theme.colors.primary
+          }
         },
         semanticBar: {
           "--bar-height": "2px",
@@ -635,8 +658,13 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
       classes: {
         root: {
           flexDirection: "row-reverse",
-          padding: uikitStyles.theme.spacing("xs", "sm"),
-          gap: 0
+          padding: uikitStyles.theme.spacing("xs", "sm")
+        },
+        subheader: {
+          color: uikitStyles.theme.colors.textSubtle
+        },
+        action: {
+          alignSelf: "center"
         }
       }
     },
@@ -651,7 +679,7 @@ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
       }
     },
     HvFooter: {
-      name: "Pentaho+"
+      name: "Pentaho"
     },
     HvTabs: {
       classes: {

package/dist/cjs/utils/Callout.cjs

@@ -9,6 +9,7 @@ const icons = require("../icons.cjs");
 const iconVariant = require("./iconVariant.cjs");
 const ActionsGeneric = require("../ActionsGeneric/ActionsGeneric.cjs");
 const Button = require("../Button/Button.cjs");
+const StatusIcon = require("../StatusIcon/StatusIcon.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const SnackbarContent__default = /* @__PURE__ */ _interopDefault(SnackbarContent);
 const { useClasses } = uikitReactUtils.createClasses("HvCallout", {
@@ -48,10 +49,7 @@ const { useClasses } = uikitReactUtils.createClasses("HvCallout", {
     overflow: "hidden",
     wordBreak: "break-word"
   },
-  messageIcon: {
-    lineHeight: 0,
-    flexShrink: 0
-  },
+  messageIcon: {},
   messageTitle: {
     display: "block",
     fontWeight: uikitStyles.theme.fontWeights.semibold
@@ -117,7 +115,14 @@ const HvCallout = React.forwardRef(function HvCallout2(props, ref) {
         action: classes.action
       },
       message: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.messageIcon, children: icon }),
+        icon && /* @__PURE__ */ jsxRuntime.jsx(
+          StatusIcon.HvStatusIcon,
+          {
+            className: classes.messageIcon,
+            variant: variant === "default" ? "info" : variant,
+            customIcon
+          }
+        ),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.messageContent, children: [
           title && /* @__PURE__ */ jsxRuntime.jsx("b", { className: classes.messageTitle, children: title }),
           children

package/dist/esm/AppSwitcher/Action/Action.js

@@ -70,7 +70,10 @@ const HvAppSwitcherAction = ({
       disabled,
       className: cx(
         classes.root,
-        { [classes.disabled]: disabled, [classes.selected]: isSelected },
+        {
+          [classes.selected]: isSelected,
+          [classes.disabled]: disabled
+        },
         className
       ),
       children: /* @__PURE__ */ jsxs(

package/dist/esm/BaseRadio/BaseRadio.js

@@ -56,10 +56,10 @@ const HvBaseRadio = forwardRef(
         className: cx(
           classes.root,
           {
-            [classes.disabled]: disabled,
             [classes.focusVisible]: focusVisible,
             [classes.checked]: checked,
-            [classes.semantic]: semantic
+            [classes.semantic]: semantic,
+            [classes.disabled]: disabled
           },
           className
         ),

package/dist/esm/BaseSwitch/BaseSwitch.js

@@ -57,9 +57,9 @@ const HvBaseSwitch = forwardRef(
         className: cx(
           classes.root,
           {
-            [classes.disabled]: disabled,
+            [classes.focusVisible]: focusVisible,
             [classes.readOnly]: readOnly,
-            [classes.focusVisible]: focusVisible
+            [classes.disabled]: disabled
           },
           className
         ),

package/dist/esm/Card/Header/Header.styles.js

@@ -4,7 +4,9 @@ const { staticClasses, useClasses } = createClasses("HvCardHeader", {
   root: {
     position: "relative",
     padding: theme.spacing("12px", "xs", "sm", "sm"),
-    gap: theme.space.xs
+    gap: theme.space.xs,
+    alignItems: "center",
+    display: "flex"
   },
   titleShort: {
     ...theme.typography.label,

package/dist/esm/CheckBox/CheckBox.js

@@ -145,8 +145,8 @@ const HvCheckBox = forwardRef(
             "div",
             {
               className: cx(classes.container, {
-                [classes.disabled]: disabled,
-                [classes.invalidContainer]: isStateInvalid
+                [classes.invalidContainer]: isStateInvalid,
+                [classes.disabled]: disabled
               }),
               children: [
                 checkbox,

package/dist/esm/ColorPicker/Fields/Fields.js

@@ -3,7 +3,6 @@ import { useState, useRef, useEffect } from "react";
 import * as color from "react-color/lib/helpers/color";
 import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { useClasses } from "./Fields.styles.js";
-import { staticClasses } from "./Fields.styles.js";
 import { HvInput } from "../../Input/Input.js";
 const Fields = (props) => {
   const {
@@ -131,6 +130,5 @@ const Fields = (props) => {
   ] });
 };
 export {
-  Fields,
-  staticClasses as colorPickerFieldsClasses
+  Fields
 };

package/dist/esm/ColorPicker/Fields/Fields.styles.js

@@ -1,7 +1,6 @@
 import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const name = "HvColorPicker-Fields";
-const { staticClasses, useClasses } = createClasses(name, {
+const { useClasses } = createClasses("HvColorPickerFields", {
   fields: {
     width: "100%",
     display: "flex",
@@ -33,6 +32,5 @@ const { staticClasses, useClasses } = createClasses(name, {
   }
 });
 export {
-  staticClasses,
   useClasses
 };

package/dist/esm/ColorPicker/Picker/Picker.js

@@ -4,7 +4,6 @@ import { CustomPicker } from "react-color";
 import { Saturation, Hue } from "react-color/lib/components/common";
 import { useDefaultProps, useTheme } from "@hitachivantara/uikit-react-utils";
 import { useClasses } from "./Picker.styles.js";
-import { staticClasses } from "./Picker.styles.js";
 import { Fields } from "../Fields/Fields.js";
 import { HvTypography } from "../../Typography/Typography.js";
 const Component = (props) => {
@@ -70,6 +69,5 @@ const Component = (props) => {
 };
 const Picker = CustomPicker(Component);
 export {
-  Picker,
-  staticClasses as colorPickerPickerClasses
+  Picker
 };

package/dist/esm/ColorPicker/Picker/Picker.styles.js

@@ -1,7 +1,6 @@
 import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const name = "HvColorPicker-Picker";
-const { staticClasses, useClasses } = createClasses(name, {
+const { useClasses } = createClasses("HvColorPickerPicker", {
   pickers: {
     display: "flex",
     flexDirection: "column"
@@ -62,6 +61,5 @@ const { staticClasses, useClasses } = createClasses(name, {
   fields: {}
 });
 export {
-  staticClasses,
   useClasses
 };

package/dist/esm/ColorPicker/PresetColors/PresetColors.js

@@ -3,7 +3,6 @@ import { Swatch } from "react-color/lib/components/common";
 import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { getColor } from "@hitachivantara/uikit-styles";
 import { useClasses } from "./PresetColors.styles.js";
-import { staticClasses } from "./PresetColors.styles.js";
 import { HvTypography } from "../../Typography/Typography.js";
 const PresetColors = (props) => {
   const {
@@ -43,6 +42,5 @@ const PresetColors = (props) => {
   ] });
 };
 export {
-  PresetColors,
-  staticClasses as colorPickerPresetColorsClasses
+  PresetColors
 };

package/dist/esm/ColorPicker/PresetColors/PresetColors.styles.js

@@ -1,7 +1,6 @@
 import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const name = "HvColorPicker-PresetColors";
-const { staticClasses, useClasses } = createClasses(name, {
+const { useClasses } = createClasses("HvColorPickerPresetColors", {
   root: { width: "232px" },
   colors: {
     display: "flex",
@@ -25,6 +24,5 @@ const { staticClasses, useClasses } = createClasses(name, {
   }
 });
 export {
-  staticClasses,
   useClasses
 };

package/dist/esm/ColorPicker/SavedColors/SavedColors.js

@@ -3,7 +3,6 @@ import { Swatch } from "react-color/lib/components/common";
 import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { HvIcon } from "../../icons.js";
 import { useClasses } from "./SavedColors.styles.js";
-import { staticClasses } from "./SavedColors.styles.js";
 import { HvIconButton } from "../../IconButton/IconButton.js";
 const SavedColors = (props) => {
   const {
@@ -65,6 +64,5 @@ const SavedColors = (props) => {
   ] });
 };
 export {
-  SavedColors,
-  staticClasses as colorPickerSavedColorsClasses
+  SavedColors
 };

package/dist/esm/ColorPicker/SavedColors/SavedColors.styles.js

@@ -1,7 +1,6 @@
 import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const name = "HvColorPicker-SavedColors";
-const { staticClasses, useClasses } = createClasses(name, {
+const { useClasses } = createClasses("HvColorPickerSavedColors", {
   addButton: {
     margin: theme.space.xxs,
     width: "32px",
@@ -43,6 +42,5 @@ const { staticClasses, useClasses } = createClasses(name, {
   }
 });
 export {
-  staticClasses,
   useClasses
 };

package/dist/esm/Dialog/Content/Content.js

@@ -1,6 +1,7 @@
 import { jsx } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from "react";
 import MuiDialogContent from "@mui/material/DialogContent";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { useDefaultProps, mergeStyles } from "@hitachivantara/uikit-react-utils";
 import { useClasses } from "./Content.styles.js";
 import { staticClasses } from "./Content.styles.js";
 import { HvTypography } from "../../Typography/Typography.js";
@@ -10,18 +11,43 @@ const HvDialogContent = (props) => {
     className,
     children,
     indentContent = false,
+    style,
     ...others
   } = useDefaultProps("HvDialogContent", props);
   const { classes, cx } = useClasses(classesProp);
+  const [hasBorder, setHasBorder] = useState(false);
+  const elRef = useRef(null);
+  useEffect(() => {
+    if (typeof ResizeObserver !== "undefined") {
+      const resizeObserver = new ResizeObserver(() => {
+        const el = elRef.current;
+        if (el) {
+          const hasOverflow = el.scrollHeight > el.clientHeight;
+          setHasBorder(hasOverflow);
+        }
+      });
+      if (elRef.current) {
+        resizeObserver.observe(elRef.current);
+      }
+      return () => {
+        resizeObserver.disconnect();
+      };
+    }
+    return void 0;
+  }, []);
   return /* @__PURE__ */ jsx(
     HvTypography,
     {
+      ref: elRef,
       component: MuiDialogContent,
       className: cx(
         classes.root,
         { [classes.textContent]: !!indentContent },
         className
       ),
+      style: mergeStyles(style, {
+        "--borderW": hasBorder ? "1px" : "0px"
+      }),
       ...others,
       children
     }

package/dist/esm/Dialog/Content/Content.styles.js

@@ -2,10 +2,13 @@ import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
 const { staticClasses, useClasses } = createClasses("HvDialog-Content", {
   root: {
-    padding: theme.spacing(0, "sm", "sm")
+    padding: theme.spacing(0, "sm", "sm"),
+    borderColor: theme.colors.borderSubtle,
+    borderTopWidth: "var(--borderW)",
+    borderBottomWidth: "var(--borderW)"
   },
   textContent: {
-    marginLeft: "42px",
+    paddingLeft: `calc(42px + ${theme.space.sm})`,
     paddingRight: "62px",
     overflowY: "auto"
   }

package/dist/esm/Dialog/Dialog.styles.js

@@ -12,7 +12,9 @@ const { staticClasses, useClasses } = createClasses("HvDialog", {
     borderColor: theme.colors.border,
     borderRadius: theme.radii.round
   },
-  fullscreen: {},
+  fullscreen: {
+    borderRadius: 0
+  },
   fullHeight: {
     height: "100%"
   },

package/dist/esm/Dialog/Title/Title.js

@@ -1,11 +1,11 @@
-import { jsxs } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import MuiDialogTitle from "@mui/material/DialogTitle";
 import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
-import { iconVariant } from "../../utils/iconVariant.js";
 import { useDialogContext } from "../context.js";
 import { useClasses } from "./Title.styles.js";
 import { staticClasses } from "./Title.styles.js";
 import { HvTypography } from "../../Typography/Typography.js";
+import { HvStatusIcon } from "../../StatusIcon/StatusIcon.js";
 const HvDialogTitle = (props) => {
   const {
     classes: classesProp,
@@ -18,7 +18,7 @@ const HvDialogTitle = (props) => {
   } = useDefaultProps("HvDialogTitle", props);
   const { classes, cx } = useClasses(classesProp);
   const { fullScreen } = useDialogContext();
-  const icon = customIcon || showIcon && iconVariant(variant);
+  const icon = customIcon || showIcon && /* @__PURE__ */ jsx(HvStatusIcon, { variant });
   return /* @__PURE__ */ jsxs(
     HvTypography,
     {

package/dist/esm/DropdownButton/DropdownButton.js

@@ -32,8 +32,8 @@ const HvDropdownButton = forwardRef(function HvDropdownButton2(props, ref) {
         classes.root,
         {
           [classes.open]: open,
-          [classes.disabled]: disabled,
-          [classes.readOnly]: readOnly
+          [classes.readOnly]: readOnly,
+          [classes.disabled]: disabled
         },
         className
       ),

package/dist/esm/QueryBuilder/ConfirmationDialog.js

@@ -0,0 +1,32 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { HvDialog } from "../Dialog/Dialog.js";
+import { HvDialogTitle } from "../Dialog/Title/Title.js";
+import { HvDialogContent } from "../Dialog/Content/Content.js";
+import { HvDialogActions } from "../Dialog/Actions/Actions.js";
+import { HvButton } from "../Button/Button.js";
+const ConfirmationDialog = ({
+  title,
+  message,
+  onConfirm,
+  onCancel,
+  confirmButtonLabel,
+  cancelButtonLabel,
+  ...others
+}) => {
+  const handleClose = (_, reason) => {
+    if (reason !== "backdropClick") {
+      onCancel?.();
+    }
+  };
+  return /* @__PURE__ */ jsxs(HvDialog, { onClose: handleClose, ...others, children: [
+    /* @__PURE__ */ jsx(HvDialogTitle, { variant: "warning", showIcon: false, children: title }),
+    /* @__PURE__ */ jsx(HvDialogContent, { indentContent: true, children: message }),
+    /* @__PURE__ */ jsxs(HvDialogActions, { children: [
+      /* @__PURE__ */ jsx(HvButton, { variant: "primaryGhost", onClick: onConfirm, children: confirmButtonLabel }),
+      /* @__PURE__ */ jsx(HvButton, { autoFocus: true, variant: "primaryGhost", onClick: onCancel, children: cancelButtonLabel })
+    ] })
+  ] });
+};
+export {
+  ConfirmationDialog
+};