import { jsxs as A, jsx as s } from "react/jsx-runtime";
import { createSlotRecipeContext as p } from "@chakra-ui/react";
import { CheckCircleOutline as u, WarningAmber as g, Info as f, ErrorOutline as h, Clear as D } from "@commercetools/nimbus-icons";
import { I as v } from "./icon-button-CosIm3oY.es.js";
import { n as r, u as x } from "./normalize-messages-D5T4I93D.es.js";
const { withProvider: B, withContext: i } = /* @__PURE__ */ p({
  key: "alert"
}), M = /* @__PURE__ */ B(
  "div",
  "root"
), R = /* @__PURE__ */ i(
  "div",
  "title"
), y = /* @__PURE__ */ i("div", "description"), C = /* @__PURE__ */ i(
  "div",
  "icon"
), I = /* @__PURE__ */ i(
  "div",
  "actions"
), w = /* @__PURE__ */ i("div", "dismissButton"), N = (t) => {
  switch (t) {
    case "critical":
      return /* @__PURE__ */ s(h, {});
    case "info":
      return /* @__PURE__ */ s(f, {});
    case "warning":
      return /* @__PURE__ */ s(g, {});
    case "positive":
      return /* @__PURE__ */ s(u, {});
    default:
      return null;
  }
}, n = (t) => {
  const { ref: e, children: d, ...o } = t;
  return /* @__PURE__ */ A(M, { ref: e, ...o, role: "alert", children: [
    /* @__PURE__ */ s(C, { alignItems: "flex-start", children: N(o.colorPalette) }),
    d
  ] });
};
n.displayName = "Alert.Root";
const a = ({ children: t, ...e }) => /* @__PURE__ */ s(R, { ...e, fontWeight: "600", children: t });
a.displayName = "Alert.Title";
const l = ({
  children: t,
  ...e
}) => /* @__PURE__ */ s(y, { ...e, children: t });
l.displayName = "Alert.Description";
const c = ({ children: t, ...e }) => /* @__PURE__ */ s(I, { ...e, children: t });
c.displayName = "Alert.Actions";
const _ = { dismiss: "Dismiss" }, $ = { dismiss: "Verwerfen" }, F = { dismiss: "Desechar" }, P = { dismiss: "Fermer" }, T = { dismiss: "Dispensar" }, b = {
  en: /* @__PURE__ */ r(_),
  de: /* @__PURE__ */ r($),
  es: /* @__PURE__ */ r(F),
  "fr-FR": /* @__PURE__ */ r(P),
  "pt-BR": /* @__PURE__ */ r(T)
}, m = ({ ...t }) => {
  const e = x(b);
  return /* @__PURE__ */ s(w, { children: /* @__PURE__ */ s(
    v,
    {
      "aria-label": e.format("dismiss"),
      ...t,
      variant: "ghost",
      size: "2xs",
      children: /* @__PURE__ */ s(D, { role: "img" })
    }
  ) });
};
m.displayName = "Alert.DismissButton";
const W = {
  /**
   * # Alert.Root
   *
   * The root component that provides context and configuration for the alert.
   * Must wrap all alert parts (Title, Description, Actions, DismissButton) to coordinate their behavior.
   *
   * @example
   * ```tsx
   * <Alert.Root tone="info" variant="outlined">
   *   <Alert.Title>Title</Alert.Title>
   *   <Alert.Description>Description</Alert.Description>
   * </Alert.Root>
   * ```
   */
  Root: n,
  /**
   * # Alert.Title
   *
   * Displays the title text for the alert.
   * Typically shown in bold to provide a clear heading for the alert message.
   *
   * @example
   * ```tsx
   * <Alert.Root tone="critical">
   *   <Alert.Title>Error Occurred</Alert.Title>
   * </Alert.Root>
   * ```
   */
  Title: a,
  /**
   * # Alert.Description
   *
   * Displays the descriptive text for the alert.
   * Provides detailed information about the alert's purpose or the action required.
   *
   * @example
   * ```tsx
   * <Alert.Root tone="warning">
   *   <Alert.Title>Warning</Alert.Title>
   *   <Alert.Description>Please review the following items before proceeding.</Alert.Description>
   * </Alert.Root>
   * ```
   */
  Description: l,
  /**
   * # Alert.Actions
   *
   * Container for action buttons within the alert.
   * Allows users to take actions directly from the alert message.
   *
   * @example
   * ```tsx
   * <Alert.Root tone="positive">
   *   <Alert.Title>Success</Alert.Title>
   *   <Alert.Description>Your changes have been saved.</Alert.Description>
   *   <Alert.Actions>
   *     <Button>View Details</Button>
   *   </Alert.Actions>
   * </Alert.Root>
   * ```
   */
  Actions: c,
  /**
   * # Alert.DismissButton
   *
   * Button to dismiss or close the alert.
   * Provides users with the ability to manually remove the alert from view.
   *
   * @example
   * ```tsx
   * <Alert.Root tone="info">
   *   <Alert.Title>Notification</Alert.Title>
   *   <Alert.Description>You have new messages.</Alert.Description>
   *   <Alert.DismissButton onClick={() => console.log('Dismissed')} />
   * </Alert.Root>
   * ```
   */
  DismissButton: m
};
export {
  W as A,
  n as a,
  a as b,
  l as c,
  c as d,
  m as e
};
//# sourceMappingURL=alert-DCgWOaY2.es.js.map
