@hitachivantara/uikit-react-core/dist/cjs/utils/Callout.cjs

UI Kit Core React components.

"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const SnackbarContent = require("@mui/material/SnackbarContent");
const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
const uikitStyles = require("@hitachivantara/uikit-styles");
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", {
  root: {
    position: "relative",
    boxShadow: "none",
    flexWrap: "nowrap",
    padding: 0,
    borderRadius: uikitStyles.theme.radii.round
  },
  success: {
    backgroundColor: uikitStyles.theme.colors.positiveDimmed
  },
  warning: {
    backgroundColor: uikitStyles.theme.colors.warningDimmed
  },
  error: {
    backgroundColor: uikitStyles.theme.colors.negativeDimmed
  },
  info: {
    backgroundColor: uikitStyles.theme.colors.infoDimmed
  },
  accent: {
    backgroundColor: uikitStyles.theme.colors.accentDimmed
  },
  default: {
    backgroundColor: uikitStyles.theme.colors.infoDimmed
  },
  message: {
    display: "flex",
    alignItems: "center",
    padding: 0,
    color: uikitStyles.theme.colors.textDark
  },
  messageContent: {
    textWrap: "balance",
    overflow: "hidden",
    wordBreak: "break-word"
  },
  messageIcon: {},
  messageTitle: {
    display: "block",
    fontWeight: uikitStyles.theme.fontWeights.semibold
  },
  action: {
    marginRight: 0
  },
  actionContent: {
    display: "flex",
    flexDirection: "column",
    height: "100%",
    justifyContent: "space-between",
    gap: uikitStyles.theme.space.xs
  },
  actionCustom: {
    flex: "0 0 auto"
  },
  actionClose: {
    alignSelf: "flex-end"
  }
});
const HvCallout = React.forwardRef(function HvCallout2(props, ref) {
  const {
    id,
    classes: classesProp,
    className,
    title,
    showClose,
    showIcon,
    customIcon,
    variant = "default",
    onClose,
    actions,
    onAction,
    actionsPosition: actionsPositionProp = "auto",
    children,
    actionProps,
    ...others
  } = uikitReactUtils.useDefaultProps("HvCallout", props);
  const { classes, cx } = useClasses(classesProp, false);
  const { activeTheme } = uikitReactUtils.useTheme();
  const icon = customIcon || showIcon && iconVariant.iconVariant(variant);
  const actionsPosition = actionsPositionProp === "auto" ? "inline" : actionsPositionProp;
  const actionsContent = /* @__PURE__ */ jsxRuntime.jsx(
    ActionsGeneric.HvActionsGeneric,
    {
      id,
      className: classes.actionCustom,
      variant: activeTheme?.snackbar.actionButtonVariant,
      actions,
      onAction,
      style: {
        marginTop: actionsPosition === "bottom-right" ? "auto" : void 0
      }
    }
  );
  const showCustomActions = actions && actionsPosition === "bottom-right";
  return /* @__PURE__ */ jsxRuntime.jsx(
    SnackbarContent__default.default,
    {
      ref,
      id,
      classes: {
        root: cx(classes.root, classes[variant], className),
        message: classes.message,
        action: classes.action
      },
      message: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
        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
        ] }),
        actions && actionsPosition === "inline" && actionsContent
      ] }),
      action: (showClose || showCustomActions) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.actionContent, children: [
        showClose && /* @__PURE__ */ jsxRuntime.jsx(
          Button.HvButton,
          {
            icon: true,
            className: classes.actionClose,
            variant: "semantic",
            "aria-label": "Close",
            onClick: (evt) => onClose?.(evt, "clickaway"),
            ...actionProps,
            children: /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { size: "xs", name: "Close" })
          }
        ),
        showCustomActions && actionsContent
      ] }),
      ...others
    }
  );
});
exports.HvCallout = HvCallout;