import { jsx as r } from "react/jsx-runtime";
import w, { useContext as v, createContext as N } from "react";
import { j as O, k as M } from "./Dialog-B0BQfdQa.es.js";
import { createSlotRecipeContext as F, useSlotRecipe as _, chakra as B } from "@chakra-ui/react/styled-system";
import { k as m } from "./index-C2qW4ynb.es.js";
import { a as H } from "./Button-BjcDZ5eb.es.js";
import { e as u } from "./extract-style-props-BdibuNZ7.es.js";
import { $ as I, a as j } from "./Modal-K4JEy19g.es.js";
import { H as k } from "./heading-nfjoR4vL.es.js";
import { Close as z } from "@commercetools/nimbus-icons";
import { n as c, u as E } from "./normalize-messages-D5T4I93D.es.js";
import { I as L } from "./icon-button-CosIm3oY.es.js";
const { withProvider: V, withContext: a } = /* @__PURE__ */ F({
  recipe: m
}), A = /* @__PURE__ */ V(
  "div",
  "root"
), K = /* @__PURE__ */ a("button", "trigger"), q = /* @__PURE__ */ a("div", "modalOverlay"), G = /* @__PURE__ */ a("div", "modal"), J = /* @__PURE__ */ a("div", "content"), Q = /* @__PURE__ */ a(
  "header",
  "header"
), U = /* @__PURE__ */ a(
  "div",
  "body"
), W = /* @__PURE__ */ a(
  "footer",
  "footer"
), X = /* @__PURE__ */ a("h2", "title"), Y = /* @__PURE__ */ a("div", "closeTrigger"), h = /* @__PURE__ */ N(
  void 0
), Z = () => {
  const e = v(h);
  if (!e)
    throw new Error("useDrawerContext must be used within Drawer.Root");
  return e;
}, ee = ({
  children: e,
  value: t
}) => /* @__PURE__ */ r(h, { value: t, children: e }), D = (e) => {
  const t = _({ recipe: m }), [s] = t.splitVariantProps(e), { children: o, isOpen: n, onOpenChange: i, defaultOpen: f = !1 } = e, d = /* @__PURE__ */ r(A, { ...s, children: o }), g = w.Children.toArray(o).some((l) => {
    if (w.isValidElement(l) && typeof l.type == "function") {
      const p = l.type?.displayName;
      return p === "DrawerTrigger" || p === "Drawer.Trigger";
    }
    return !1;
  });
  return /* @__PURE__ */ r(ee, { value: { ...e, hasDrawerTrigger: g }, children: g ? (
    // When there's a Drawer.Trigger, use DialogTrigger for React Aria integration
    /* @__PURE__ */ r(
      O,
      {
        isOpen: n,
        onOpenChange: i,
        defaultOpen: f,
        children: d
      }
    )
  ) : (
    // When no Drawer.Trigger, skip DialogTrigger to avoid the warning
    d
  ) });
};
D.displayName = "Drawer.Root";
const C = ({
  ref: e,
  children: t,
  asChild: s,
  ...o
}) => {
  if (s)
    return /* @__PURE__ */ r(B.button, { ref: e, asChild: !0, ...o, children: t });
  const [n, i] = u(o);
  return /* @__PURE__ */ r(K, { ...n, asChild: !0, children: /* @__PURE__ */ r(H, { ref: e, ...i, children: t }) });
};
C.displayName = "Drawer.Trigger";
const y = (e) => {
  const { ref: t, children: s, ...o } = e, {
    hasDrawerTrigger: n,
    isDismissable: i = !0,
    // Default to true so clicking outside closes the drawer
    isKeyboardDismissDisabled: f,
    shouldCloseOnInteractOutside: d,
    isOpen: g,
    onOpenChange: l,
    defaultOpen: p
  } = Z(), P = n ? {
    // With trigger: Only pass dismissal props, state is managed by DialogTrigger
    isDismissable: i,
    isKeyboardDismissDisabled: f,
    shouldCloseOnInteractOutside: d
  } : {
    // Without trigger: Pass state management props to ModalOverlay
    isDismissable: i,
    isKeyboardDismissDisabled: f,
    shouldCloseOnInteractOutside: d,
    isOpen: g,
    onOpenChange: l,
    defaultOpen: p
  }, [R] = u(o);
  return /* @__PURE__ */ r(q, { asChild: !0, children: /* @__PURE__ */ r(I, { ...P, children: /* @__PURE__ */ r(G, { asChild: !0, children: /* @__PURE__ */ r(j, { children: /* @__PURE__ */ r(J, { asChild: !0, ...R, children: /* @__PURE__ */ r(M, { ref: t, children: s }) }) }) }) }) });
};
y.displayName = "Drawer.Content";
const b = (e) => {
  const { ref: t, children: s, ...o } = e;
  return /* @__PURE__ */ r(Q, { ref: t, ...o, children: s });
};
b.displayName = "Drawer.Header";
const T = (e) => {
  const { ref: t, children: s, ...o } = e;
  return /* @__PURE__ */ r(U, { ref: t, ...{
    /**
     * Set tabIndex to 0 to allow the body to receive focus,
     * effectively enabling scrolling via keyboard arrow keys.
     */
    tabIndex: 0
  }, ...o, children: s });
};
T.displayName = "Drawer.Body";
const x = (e) => {
  const { ref: t, children: s, ...o } = e;
  return /* @__PURE__ */ r(W, { ref: t, ...o, children: s });
};
x.displayName = "Drawer.Footer";
const S = (e) => {
  const { ref: t, children: s, ...o } = e;
  return /* @__PURE__ */ r(X, { asChild: !0, ...o, children: /* @__PURE__ */ r(k, { ref: t, slot: "title", as: "h2", textStyle: "lg", children: s }) });
};
S.displayName = "Drawer.Title";
const re = { closeTrigger: "Close drawer" }, te = { closeTrigger: "Schublade schließen" }, oe = { closeTrigger: "Cerrar bandeja" }, se = { closeTrigger: "Fermer le volet" }, ae = { closeTrigger: "Fechar gaveta" }, ne = {
  en: /* @__PURE__ */ c(re),
  de: /* @__PURE__ */ c(te),
  es: /* @__PURE__ */ c(oe),
  "fr-FR": /* @__PURE__ */ c(se),
  "pt-BR": /* @__PURE__ */ c(ae)
}, $ = (e) => {
  const t = E(ne), { ref: s, "aria-label": o, ...n } = e;
  return /* @__PURE__ */ r(Y, { children: /* @__PURE__ */ r(
    L,
    {
      ref: s,
      slot: "close",
      size: "xs",
      variant: "ghost",
      "aria-label": o || t.format("closeTrigger"),
      ...n,
      children: /* @__PURE__ */ r(z, {})
    }
  ) });
};
$.displayName = "Drawer.CloseTrigger";
const Ce = {
  /**
   * # Drawer.Root
   *
   * The root component that provides context and state management for the drawer.
   * Handles accessibility and keyboard interaction.
   *
   * This component must wrap all drawer parts (Trigger, Content, etc.) and provides
   * the drawer open/close state and variant styling context.
   *
   * @example
   * ```tsx
   * <Drawer.Root>
   *   <Drawer.Trigger>Open Drawer</Drawer.Trigger>
   *   <Drawer.Content>
   *     <Drawer.Header>
   *       <Drawer.Title>Drawer Title</Drawer.Title>
   *     </Drawer.Header>
   *     <Drawer.Body>Drawer content</Drawer.Body>
   *   </Drawer.Content>
   * </Drawer.Root>
   * ```
   */
  Root: D,
  /**
   * # Drawer.Trigger
   *
   * The trigger element that opens the drawer when activated.
   * Provides accessibility and keyboard support.
   *
   * @example
   * ```tsx
   * <Drawer.Root>
   *   <Drawer.Trigger>Open Drawer</Drawer.Trigger>
   *   <Drawer.Content>...</Drawer.Content>
   * </Drawer.Root>
   * ```
   */
  Trigger: C,
  /**
   * # Drawer.Content
   *
   * The main drawer content container that handles portalling, backdrop,
   * positioning, and content styling.
   *
   * This component creates the drawer overlay, positions the content, and provides
   * accessibility features like focus management and keyboard dismissal.
   *
   * @example
   * ```tsx
   * <Drawer.Root>
   *   <Drawer.Trigger>Open Drawer</Drawer.Trigger>
   *   <Drawer.Content size="md" placement="center">
   *     <Drawer.Header>
   *       <Drawer.Title>Title</Drawer.Title>
   *     </Drawer.Header>
   *     <Drawer.Body>Content</Drawer.Body>
   *     <Drawer.Footer>Actions</Drawer.Footer>
   *   </Drawer.Content>
   * </Drawer.Root>
   * ```
   */
  Content: y,
  /**
   * # Drawer.Header
   *
   * The header section of the drawer content.
   * Typically contains the title and close button.
   *
   * @example
   * ```tsx
   * <Drawer.Content>
   *   <Drawer.Header>
   *     <Drawer.Title>Drawer Title</Drawer.Title>
   *     <Drawer.CloseTrigger />
   *   </Drawer.Header>
   *   <Drawer.Body>...</Drawer.Body>
   * </Drawer.Content>
   * ```
   */
  Header: b,
  /**
   * # Drawer.Body
   *
   * The main body content section of the drawer.
   * Contains the primary drawer content and handles overflow/scrolling.
   *
   * @example
   * ```tsx
   * <Drawer.Content>
   *   <Drawer.Header>...</Drawer.Header>
   *   <Drawer.Body>
   *     <p>This is the main content of the drawer.</p>
   *   </Drawer.Body>
   *   <Drawer.Footer>...</Drawer.Footer>
   * </Drawer.Content>
   * ```
   */
  Body: T,
  /**
   * # Drawer.Footer
   *
   * The footer section of the drawer, typically containing action buttons.
   * Provides consistent spacing and alignment for drawer actions.
   *
   * @example
   * ```tsx
   * <Drawer.Content>
   *   <Drawer.Header>...</Drawer.Header>
   *   <Drawer.Body>...</Drawer.Body>
   *   <Drawer.Footer>
   *     <Button variant="outline">Cancel</Button>
   *     <Button>Confirm</Button>
   *   </Drawer.Footer>
   * </Drawer.Content>
   * ```
   */
  Footer: x,
  /**
   * # Drawer.Title
   *
   * The accessible title element for the drawer.
   * Provides proper accessibility and screen reader support.
   *
   * @example
   * ```tsx
   * <Drawer.Content>
   *   <Drawer.Header>
   *     <Drawer.Title>Confirm Action</Drawer.Title>
   *   </Drawer.Header>
   *   <Drawer.Body>...</Drawer.Body>
   * </Drawer.Content>
   * ```
   */
  Title: S,
  /**
   * # Drawer.CloseTrigger
   *
   * A button that closes the drawer when activated.
   * Displays an IconButton with a close (X) icon by default.
   *
   * The component automatically handles the close behavior,
   * so no additional onPress handler is needed.
   *
   * @example
   * ```tsx
   * <Drawer.Root>
   *   <Drawer.Trigger>Open Drawer</Drawer.Trigger>
   *   <Drawer.Content>
   *     <Drawer.Header>
   *       <Drawer.Title>Title</Drawer.Title>
   *       <Drawer.CloseTrigger aria-label="Close drawer" />
   *     </Drawer.Header>
   *     <Drawer.Body>Content</Drawer.Body>
   *   </Drawer.Content>
   * </Drawer.Root>
   * ```
   */
  CloseTrigger: $
};
export {
  Ce as D,
  D as a,
  C as b,
  y as c,
  b as d,
  T as e,
  x as f,
  S as g,
  $ as h
};
//# sourceMappingURL=drawer-BPcEUbUt.es.js.map
