"use strict";
const jsxRuntime = require("react/jsx-runtime");
const styles_lib_components_Box_Box_cjs = require("../Box/Box.cjs");
const styles_lib_components_Columns_Columns_cjs = require("../Columns/Columns.cjs");
const styles_lib_components_Column_Column_cjs = require("../Column/Column.cjs");
const styles_lib_components_Accordion_AccordionItem_cjs = require("../Accordion/AccordionItem.cjs");
const styles_lib_components_Box_BackgroundContext_cjs = require("../Box/BackgroundContext.cjs");
const styles_lib_css_textAlignedToIcon_css_cjs = require("../../css/textAlignedToIcon.css.cjs");
const styles_lib_components_Accordion_Accordion_cjs = require("../Accordion/Accordion.cjs");
const styles_lib_components_private_touchable_virtualTouchable_cjs = require("../private/touchable/virtualTouchable.cjs");
const styles_lib_hooks_useIcon_index_cjs = require("../../hooks/useIcon/index.cjs");
const sideEffects_lib_components_BraidProvider_BraidProvider_cjs = require("../../../../side-effects/lib/components/BraidProvider/BraidProvider.cjs");
const styles_lib_components_Alert_Alert_css_cjs = require("./Alert.css.cjs");
const borderRadius = "large";
const backgroundForTone = {
  promote: "promoteLight",
  info: "infoLight",
  positive: "positiveLight",
  caution: "cautionLight",
  critical: "criticalLight"
};
const borderForTone = {
  promote: "borderPromoteLight",
  info: "borderInfoLight",
  positive: "borderPositiveLight",
  caution: "borderCautionLight",
  critical: "borderCriticalLight"
};
const icons = {
  positive: styles_lib_components_Accordion_AccordionItem_cjs.IconPositive,
  info: styles_lib_components_Accordion_AccordionItem_cjs.IconInfo,
  promote: styles_lib_components_Accordion_AccordionItem_cjs.IconPromote,
  caution: styles_lib_components_Accordion_AccordionItem_cjs.IconCaution,
  critical: styles_lib_components_Accordion_AccordionItem_cjs.IconCritical
};
const Alert = ({
  tone = "info",
  children,
  id,
  closeLabel = "Close",
  data,
  onClose,
  ...restProps
}) => {
  const isLegacyTheme = sideEffects_lib_components_BraidProvider_BraidProvider_cjs.useBraidTheme().legacy;
  const parentBackground = styles_lib_components_Box_BackgroundContext_cjs.useBackground();
  const Icon = icons[tone];
  return /* @__PURE__ */ jsxRuntime.jsxs(
    styles_lib_components_Box_Box_cjs.Box,
    {
      id,
      background: backgroundForTone[tone],
      paddingY: "medium",
      paddingX: "gutter",
      borderRadius,
      position: "relative",
      overflow: "hidden",
      role: "alert",
      "aria-live": "polite",
      ...styles_lib_components_Accordion_Accordion_cjs.buildDataAttributes({ data, validateRestProps: restProps }),
      children: [
        /* @__PURE__ */ jsxRuntime.jsxs(styles_lib_components_Columns_Columns_cjs.Columns, { space: "small", children: [
          /* @__PURE__ */ jsxRuntime.jsx(styles_lib_components_Column_Column_cjs.Column, { width: "content", children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { tone }) }),
          /* @__PURE__ */ jsxRuntime.jsx(styles_lib_components_Column_Column_cjs.Column, { children: /* @__PURE__ */ jsxRuntime.jsx(styles_lib_components_Box_Box_cjs.Box, { className: styles_lib_css_textAlignedToIcon_css_cjs.textAlignedToIcon.standard, children }) }),
          onClose ? /* @__PURE__ */ jsxRuntime.jsx(styles_lib_components_Column_Column_cjs.Column, { width: "content", children: /* @__PURE__ */ jsxRuntime.jsxs(
            styles_lib_components_Box_Box_cjs.Box,
            {
              component: "button",
              "aria-label": closeLabel,
              borderRadius: "full",
              cursor: "pointer",
              position: "relative",
              onClick: onClose,
              outline: "none",
              transition: "touchable",
              transform: { active: "touchable" },
              display: "flex",
              alignItems: "center",
              justifyContent: "center",
              className: [
                styles_lib_components_Alert_Alert_css_cjs.closeButton,
                styles_lib_hooks_useIcon_index_cjs.iconContainerSize(),
                styles_lib_components_private_touchable_virtualTouchable_cjs.virtualTouchable()
              ],
              children: [
                /* @__PURE__ */ jsxRuntime.jsx(
                  styles_lib_components_Accordion_AccordionItem_cjs.Overlay,
                  {
                    component: "span",
                    boxShadow: "outlineFocus",
                    transition: "fast",
                    onlyVisibleForKeyboardNavigation: true,
                    borderRadius: "full",
                    className: styles_lib_components_Alert_Alert_css_cjs.closeButtonFocus
                  }
                ),
                /* @__PURE__ */ jsxRuntime.jsx(
                  styles_lib_components_Accordion_AccordionItem_cjs.Overlay,
                  {
                    component: "span",
                    background: "surface",
                    transition: "fast",
                    borderRadius: "full",
                    className: styles_lib_components_Alert_Alert_css_cjs.closeButtonHover
                  }
                ),
                /* @__PURE__ */ jsxRuntime.jsx(
                  styles_lib_components_Box_Box_cjs.Box,
                  {
                    component: "span",
                    display: "block",
                    zIndex: 1,
                    position: "relative",
                    children: /* @__PURE__ */ jsxRuntime.jsx(styles_lib_components_Accordion_AccordionItem_cjs.IconClear, { size: "fill", tone })
                  }
                )
              ]
            }
          ) }) : null
        ] }),
        isLegacyTheme && parentBackground.lightMode !== "surface" && /* @__PURE__ */ jsxRuntime.jsx(
          styles_lib_components_Accordion_AccordionItem_cjs.Overlay,
          {
            borderRadius,
            boxShadow: { lightMode: borderForTone[tone] },
            visible: true
          }
        )
      ]
    }
  );
};
exports.Alert = Alert;
