@mieweb/ui 0.10.0-dev.1 → 0.10.0-dev.3

package/dist/chunk-5GUOOLPR.cjs

@@ -0,0 +1,436 @@
+'use strict';
+
+var chunkVNYW4C4J_cjs = require('./chunk-VNYW4C4J.cjs');
+var chunkS5RVSXDV_cjs = require('./chunk-S5RVSXDV.cjs');
+var React = require('react');
+var lucideReact = require('lucide-react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var OPEN_DELAY_MS = 70;
+var CLOSE_DELAY_MS = 150;
+function normalizePath(href) {
+  const path = href.split("#")[0].split("?")[0];
+  let end = path.length;
+  while (end > 0 && path[end - 1] === "/") end--;
+  return path.slice(0, end) || "/";
+}
+function MegaMenu({
+  menu,
+  open,
+  onOpenChange,
+  currentPath,
+  variant = "dark",
+  resolveFeatured = (item, m) => item?.featured ?? m.featured,
+  onNavigate,
+  hoverMinWidth = 900,
+  className
+}) {
+  const rootRef = React__namespace.useRef(null);
+  const panelRef = React__namespace.useRef(null);
+  const triggerRef = React__namespace.useRef(null);
+  const openTimer = React__namespace.useRef(null);
+  const closeTimer = React__namespace.useRef(null);
+  const [left, setLeft] = React__namespace.useState();
+  const [hovered, setHovered] = React__namespace.useState(null);
+  const panelId = React__namespace.useId();
+  const isHoverViewport = () => typeof window !== "undefined" && window.innerWidth >= hoverMinWidth;
+  const clearTimers = React__namespace.useCallback(() => {
+    if (openTimer.current !== null) window.clearTimeout(openTimer.current);
+    if (closeTimer.current !== null) window.clearTimeout(closeTimer.current);
+    openTimer.current = closeTimer.current = null;
+  }, []);
+  const requestOpen = React__namespace.useCallback(() => {
+    clearTimers();
+    openTimer.current = window.setTimeout(
+      () => onOpenChange(true),
+      OPEN_DELAY_MS
+    );
+  }, [clearTimers, onOpenChange]);
+  const requestClose = React__namespace.useCallback(() => {
+    clearTimers();
+    closeTimer.current = window.setTimeout(
+      () => onOpenChange(false),
+      CLOSE_DELAY_MS
+    );
+  }, [clearTimers, onOpenChange]);
+  const position = React__namespace.useCallback(() => {
+    const root = rootRef.current;
+    const panel = panelRef.current;
+    if (!root || !panel || !isHoverViewport()) {
+      setLeft(void 0);
+      return;
+    }
+    const rect = root.getBoundingClientRect();
+    const pad = 16;
+    const vw = document.documentElement.clientWidth;
+    const clamped = Math.min(
+      Math.max(rect.left, pad),
+      Math.max(pad, vw - pad - panel.offsetWidth)
+    );
+    setLeft(clamped - rect.left);
+  }, [hoverMinWidth]);
+  const curPath = currentPath ? normalizePath(currentPath) : null;
+  const isCurrent = (href) => curPath !== null && normalizePath(href) === curPath;
+  const featured = resolveFeatured(hovered, menu);
+  React__namespace.useEffect(() => {
+    if (open) position();
+    else setHovered(null);
+  }, [open, position, featured]);
+  React__namespace.useEffect(() => {
+    window.addEventListener("resize", position);
+    return () => window.removeEventListener("resize", position);
+  }, [position]);
+  React__namespace.useEffect(() => clearTimers, [clearTimers]);
+  const onKeyDown = (e) => {
+    if (e.key === "Escape" && open) {
+      e.stopPropagation();
+      clearTimers();
+      onOpenChange(false);
+      triggerRef.current?.focus();
+    }
+  };
+  const triggerClass = chunkS5RVSXDV_cjs.cn(
+    "inline-flex items-center rounded-lg px-3 py-2 text-sm font-medium transition-colors",
+    variant === "light" ? "text-white/90 hover:bg-white/10 hover:text-white" : "text-foreground/80 hover:bg-muted hover:text-foreground",
+    open && (variant === "light" ? "bg-white/10 text-white" : "bg-muted text-foreground")
+  );
+  const navigate = () => {
+    onOpenChange(false);
+    onNavigate?.();
+  };
+  return (
+    // Hover/focus delegation region only — the trigger, toggle and links inside are the interactive elements.
+    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref: rootRef,
+        "data-slot": "mega-menu",
+        "data-state": open ? "open" : "closed",
+        className: chunkS5RVSXDV_cjs.cn("relative", className),
+        onMouseEnter: () => isHoverViewport() && requestOpen(),
+        onMouseLeave: () => isHoverViewport() && requestClose(),
+        onFocusCapture: () => {
+          if (!isHoverViewport()) return;
+          clearTimers();
+          onOpenChange(true);
+        },
+        onBlurCapture: (e) => {
+          if (!isHoverViewport()) return;
+          if (!rootRef.current?.contains(e.relatedTarget))
+            requestClose();
+        },
+        onKeyDown,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center", children: [
+            menu.href ? /* @__PURE__ */ jsxRuntime.jsx(
+              "a",
+              {
+                ref: triggerRef,
+                href: menu.href,
+                className: triggerClass,
+                "aria-haspopup": "true",
+                "aria-expanded": open,
+                "aria-controls": panelId,
+                "aria-current": isCurrent(menu.href) ? "page" : void 0,
+                onClick: navigate,
+                children: menu.label
+              }
+            ) : /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                ref: triggerRef,
+                type: "button",
+                className: triggerClass,
+                "aria-haspopup": "true",
+                "aria-expanded": open,
+                "aria-controls": panelId,
+                onClick: () => {
+                  clearTimers();
+                  onOpenChange(!open);
+                },
+                children: menu.label
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                type: "button",
+                "aria-label": `Toggle ${menu.label} menu`,
+                "aria-expanded": open,
+                "aria-controls": panelId,
+                onClick: () => {
+                  clearTimers();
+                  onOpenChange(!open);
+                },
+                className: chunkS5RVSXDV_cjs.cn(
+                  "-ms-1 rounded-md p-1 transition-transform",
+                  variant === "light" ? "text-white/70 hover:text-white" : "text-muted-foreground hover:text-foreground",
+                  open && "rotate-180"
+                ),
+                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { size: 16, "aria-hidden": "true" })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              id: panelId,
+              ref: panelRef,
+              role: "region",
+              "aria-label": menu.label,
+              "data-slot": "mega-menu-panel",
+              style: { left },
+              className: chunkS5RVSXDV_cjs.cn(
+                "border-border bg-card text-card-foreground absolute top-full z-50 mt-3 origin-top-left rounded-2xl border shadow-xl",
+                "transition-[opacity,transform] duration-200",
+                open ? "visible translate-y-0 opacity-100" : "pointer-events-none invisible -translate-y-1 opacity-0",
+                featured ? "grid w-[min(880px,calc(100vw-2rem))] grid-cols-[1fr_280px]" : "w-[min(600px,calc(100vw-2rem))]"
+              ),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-6", children: [
+                  menu.heading && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground mb-4 text-[11px] font-bold tracking-[0.14em] uppercase", children: menu.heading }),
+                  menu.groups ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-6 sm:grid-cols-2 lg:grid-cols-3", children: menu.groups.map((g) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+                    g.href ? /* @__PURE__ */ jsxRuntime.jsxs(
+                      "a",
+                      {
+                        href: g.href,
+                        "aria-current": isCurrent(g.href) ? "page" : void 0,
+                        onClick: navigate,
+                        className: "text-foreground hover:text-primary-700 dark:hover:text-primary-300 mb-2 inline-flex items-center gap-1 text-sm font-semibold",
+                        children: [
+                          g.label,
+                          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { size: 14, "aria-hidden": "true" })
+                        ]
+                      }
+                    ) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground mb-2 text-sm font-semibold", children: g.label }),
+                    /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-0.5", children: g.items.map((it) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
+                      ItemLink,
+                      {
+                        item: it,
+                        compact: true,
+                        current: isCurrent(it.href),
+                        onHover: setHovered,
+                        onNavigate: navigate
+                      }
+                    ) }, it.href)) })
+                  ] }, g.label)) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-1 sm:grid-cols-2", children: menu.items?.map((it) => /* @__PURE__ */ jsxRuntime.jsx(
+                    ItemLink,
+                    {
+                      item: it,
+                      current: isCurrent(it.href),
+                      onHover: setHovered,
+                      onNavigate: navigate
+                    },
+                    it.href
+                  )) }),
+                  (menu.allHref || menu.ctaHref) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-border mt-5 flex items-center justify-between gap-4 border-t pt-4", children: [
+                    menu.allHref ? /* @__PURE__ */ jsxRuntime.jsxs(
+                      "a",
+                      {
+                        href: menu.allHref,
+                        onClick: navigate,
+                        className: "text-foreground hover:text-primary-700 dark:hover:text-primary-300 inline-flex items-center gap-1.5 text-sm font-semibold",
+                        children: [
+                          menu.allLabel ?? "Browse all",
+                          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { size: 16, "aria-hidden": "true" })
+                        ]
+                      }
+                    ) : /* @__PURE__ */ jsxRuntime.jsx("span", {}),
+                    menu.ctaHref && /* @__PURE__ */ jsxRuntime.jsx(
+                      "a",
+                      {
+                        href: menu.ctaHref,
+                        onClick: navigate,
+                        className: chunkVNYW4C4J_cjs.buttonVariants({ size: "sm", effect: "sheen" }),
+                        children: menu.ctaLabel ?? "Get started"
+                      }
+                    )
+                  ] })
+                ] }),
+                featured && /* @__PURE__ */ jsxRuntime.jsx(FeaturedPanel, { featured, onNavigate: navigate })
+              ]
+            }
+          )
+        ]
+      }
+    )
+  );
+}
+function ItemLink({
+  item,
+  compact,
+  current,
+  onHover,
+  onNavigate
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "a",
+    {
+      href: item.href,
+      target: item.external ? "_blank" : void 0,
+      rel: item.external ? "noopener noreferrer" : void 0,
+      "aria-current": current ? "page" : void 0,
+      "data-slot": "mega-menu-item",
+      onClick: onNavigate,
+      onMouseEnter: () => onHover(item),
+      onFocus: () => onHover(item),
+      className: chunkS5RVSXDV_cjs.cn(
+        "group flex items-start gap-3 rounded-xl text-start transition-colors",
+        compact ? "px-2 py-1.5" : "p-3",
+        "hover:bg-primary-500/10 focus-visible:bg-primary-500/10 focus-visible:outline-none",
+        current && "bg-primary-500/10"
+      ),
+      children: [
+        item.icon && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: chunkS5RVSXDV_cjs.cn(
+              "inline-flex shrink-0 items-center justify-center rounded-lg transition-colors",
+              compact ? "h-7 w-7 [&_svg]:h-4 [&_svg]:w-4" : "h-10 w-10 [&_svg]:h-5 [&_svg]:w-5",
+              "bg-muted text-foreground/70 group-hover:bg-primary-800 group-hover:text-white",
+              current && "bg-primary-800 text-white"
+            ),
+            children: item.icon
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: chunkS5RVSXDV_cjs.cn(
+                "text-foreground group-hover:text-primary-800 dark:group-hover:text-primary-200 block font-semibold",
+                compact ? "text-sm" : "text-base"
+              ),
+              children: item.label
+            }
+          ),
+          !compact && item.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground mt-0.5 block text-sm leading-snug", children: item.description })
+        ] })
+      ]
+    }
+  );
+}
+var TONE = {
+  primary: "bg-gradient-to-br from-primary-800 to-primary-950 text-white",
+  accent: "text-white [background:linear-gradient(160deg,color-mix(in_srgb,var(--mieweb-accent,var(--mieweb-primary-700))_70%,#000)_0%,var(--mieweb-primary-950)_100%)]",
+  neutral: "bg-muted text-foreground"
+};
+function FeaturedPanel({
+  featured,
+  onNavigate
+}) {
+  const tone = featured.tone ?? "primary";
+  const onDark = tone !== "neutral";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-slot": "mega-menu-featured",
+      className: chunkS5RVSXDV_cjs.cn(
+        "flex flex-col rounded-e-2xl p-6 motion-safe:animate-[mie-fade-in_0.2s_ease-out]",
+        TONE[tone]
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "p",
+          {
+            className: chunkS5RVSXDV_cjs.cn(
+              "text-[11px] font-bold tracking-[0.14em] uppercase",
+              onDark ? "text-white/70" : "text-muted-foreground"
+            ),
+            children: featured.eyebrow
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children: featured.media ?? (featured.icon && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: chunkS5RVSXDV_cjs.cn(
+              "inline-flex h-14 w-14 items-center justify-center rounded-xl [&_svg]:h-7 [&_svg]:w-7",
+              onDark ? "bg-white/15 text-white" : "bg-card text-foreground"
+            ),
+            children: featured.icon
+          }
+        )) }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-xl leading-tight font-semibold", children: featured.title }),
+        featured.description && /* @__PURE__ */ jsxRuntime.jsx(
+          "p",
+          {
+            className: chunkS5RVSXDV_cjs.cn(
+              "mt-2 text-sm leading-snug",
+              onDark ? "text-white/80" : "text-muted-foreground"
+            ),
+            children: featured.description
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-auto pt-5", children: /* @__PURE__ */ jsxRuntime.jsxs(
+          "a",
+          {
+            href: featured.ctaHref,
+            onClick: onNavigate,
+            className: chunkS5RVSXDV_cjs.cn(
+              chunkVNYW4C4J_cjs.buttonVariants({ variant: "outline", effect: "sheen" }),
+              onDark && "border-white/40 text-white hover:border-white hover:bg-white/10 hover:text-white dark:border-white/40 dark:text-white dark:hover:border-white dark:hover:bg-white/10"
+            ),
+            children: [
+              featured.ctaLabel,
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { size: 16, "aria-hidden": "true" })
+            ]
+          }
+        ) })
+      ]
+    },
+    featured.title
+  );
+}
+function MegaMenuBar({
+  menus,
+  className,
+  "aria-label": ariaLabel = "Main navigation",
+  ...rest
+}) {
+  const [openKey, setOpenKey] = React__namespace.useState(null);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "nav",
+    {
+      "data-slot": "mega-menu-bar",
+      "aria-label": ariaLabel,
+      className: chunkS5RVSXDV_cjs.cn("flex items-center gap-1", className),
+      children: menus.map((m) => /* @__PURE__ */ jsxRuntime.jsx(
+        MegaMenu,
+        {
+          menu: m,
+          open: openKey === m.key,
+          onOpenChange: (o) => setOpenKey(o ? m.key : openKey === m.key ? null : openKey),
+          ...rest
+        },
+        m.key
+      ))
+    }
+  );
+}
+
+exports.MegaMenu = MegaMenu;
+exports.MegaMenuBar = MegaMenuBar;
+exports.normalizePath = normalizePath;
+//# sourceMappingURL=chunk-5GUOOLPR.cjs.map
+//# sourceMappingURL=chunk-5GUOOLPR.cjs.map

package/dist/chunk-5GUOOLPR.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/MegaMenu/MegaMenu.tsx"],"names":["React","cn","jsxs","jsx","ChevronDown","ChevronRight","ArrowRight","buttonVariants"],"mappings":"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","file":"chunk-5GUOOLPR.cjs","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ArrowRight, ChevronDown, ChevronRight } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { buttonVariants } from '../Button';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type MegaMenuTone = 'primary' | 'accent' | 'neutral';\n\n/** The right-column feature panel. */\nexport interface MegaMenuFeatured {\n  /** Small caps label, e.g. \"Whitepaper\". */\n  eyebrow: string;\n  title: string;\n  description?: string;\n  ctaLabel: string;\n  ctaHref: string;\n  /** Icon tile above the title. Ignored when `media` is given. */\n  icon?: React.ReactNode;\n  /** Rich media in place of the icon tile — a `VideoCard variant=\"plate\"`, an image. */\n  media?: React.ReactNode;\n  /** Panel colour. Default `primary`. */\n  tone?: MegaMenuTone;\n}\n\nexport interface MegaMenuItem {\n  label: string;\n  href: string;\n  description?: string;\n  icon?: React.ReactNode;\n  /**\n   * Feature panel to show while this item is hovered/focused. Falls back to\n   * the menu-level `featured` when unset — this is what makes the right\n   * column contextual instead of static.\n   */\n  featured?: MegaMenuFeatured;\n  external?: boolean;\n}\n\nexport interface MegaMenuGroup {\n  label: string;\n  /** Makes the group heading a link. */\n  href?: string;\n  items: MegaMenuItem[];\n}\n\nexport interface MegaMenuConfig {\n  /** Stable id — used by `MegaMenuBar` to track the open menu. */\n  key: string;\n  /** Trigger label. */\n  label: string;\n  /** Trigger destination. Omit for a pure toggle. */\n  href?: string;\n  /** Heading inside the panel, e.g. \"Resources & insight\". */\n  heading?: string;\n  /** Flat 2-column grid of items (icon + label + description). */\n  items?: MegaMenuItem[];\n  /** Grouped columns of compact items. Takes precedence over `items`. */\n  groups?: MegaMenuGroup[];\n  /** \"Browse all …\" footer link. */\n  allLabel?: string;\n  allHref?: string;\n  /** Footer CTA button. */\n  ctaLabel?: string;\n  ctaHref?: string;\n  /** Default right-column feature panel. */\n  featured?: MegaMenuFeatured;\n}\n\nexport interface MegaMenuProps {\n  menu: MegaMenuConfig;\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  /** Current pathname — marks the matching item/group with `aria-current`. */\n  currentPath?: string;\n  /** Trigger colours for light (on dark header) or dark (on light header) chrome. */\n  variant?: 'light' | 'dark';\n  /**\n   * Override how the feature panel is chosen. Receives the hovered item (or\n   * `null` when none) and the menu; return `undefined` to hide the column.\n   * Default: `item?.featured ?? menu.featured`.\n   */\n  resolveFeatured?: (\n    item: MegaMenuItem | null,\n    menu: MegaMenuConfig\n  ) => MegaMenuFeatured | undefined;\n  /** Called after any in-panel navigation (close mobile drawers, etc.). */\n  onNavigate?: () => void;\n  /** Viewport width below which hover-open is disabled (touch/mobile). Default 900. */\n  hoverMinWidth?: number;\n  className?: string;\n}\n\nconst OPEN_DELAY_MS = 70;\nconst CLOSE_DELAY_MS = 150;\n\n/**\n * Normalize an href for `currentPath` comparison (strips hash, query and\n * trailing slashes). Shared with `SiteHeader`'s mobile drawer so desktop and\n * mobile menu links agree on `aria-current`.\n */\nexport function normalizePath(href: string): string {\n  const path = href.split('#')[0].split('?')[0];\n  // Trim trailing slashes with a scan: an anchored `\\/+$` is CodeQL's canonical\n  // polynomial-backtracking pattern on caller-supplied hrefs full of slashes.\n  let end = path.length;\n  while (end > 0 && path[end - 1] === '/') end--;\n  return path.slice(0, end) || '/';\n}\n\n// =============================================================================\n// MegaMenu\n// =============================================================================\n\n/**\n * A hover/click mega-menu: trigger link + chevron toggle, a panel with a\n * heading, a 2-column item grid (or grouped columns), a footer with\n * \"Browse all\" + CTA, and a right-column feature panel that **follows the\n * hovered item** (`item.featured`) before falling back to the menu default.\n * Marks the current route with `aria-current`. Ported from the Enterprise\n * Health frontdoor nav.\n *\n * Controlled — pair with `MegaMenuBar` to keep one menu open at a time.\n */\nexport function MegaMenu({\n  menu,\n  open,\n  onOpenChange,\n  currentPath,\n  variant = 'dark',\n  resolveFeatured = (item, m) => item?.featured ?? m.featured,\n  onNavigate,\n  hoverMinWidth = 900,\n  className,\n}: MegaMenuProps) {\n  const rootRef = React.useRef<HTMLDivElement>(null);\n  const panelRef = React.useRef<HTMLDivElement>(null);\n  const triggerRef = React.useRef<HTMLElement>(null);\n  const openTimer = React.useRef<number | null>(null);\n  const closeTimer = React.useRef<number | null>(null);\n  const [left, setLeft] = React.useState<number | undefined>();\n  const [hovered, setHovered] = React.useState<MegaMenuItem | null>(null);\n  const panelId = React.useId();\n\n  const isHoverViewport = () =>\n    typeof window !== 'undefined' && window.innerWidth >= hoverMinWidth;\n\n  const clearTimers = React.useCallback(() => {\n    if (openTimer.current !== null) window.clearTimeout(openTimer.current);\n    if (closeTimer.current !== null) window.clearTimeout(closeTimer.current);\n    openTimer.current = closeTimer.current = null;\n  }, []);\n\n  const requestOpen = React.useCallback(() => {\n    clearTimers();\n    openTimer.current = window.setTimeout(\n      () => onOpenChange(true),\n      OPEN_DELAY_MS\n    );\n  }, [clearTimers, onOpenChange]);\n\n  const requestClose = React.useCallback(() => {\n    clearTimers();\n    closeTimer.current = window.setTimeout(\n      () => onOpenChange(false),\n      CLOSE_DELAY_MS\n    );\n  }, [clearTimers, onOpenChange]);\n\n  // Clamp the panel inside the viewport (it's absolutely positioned under the trigger).\n  const position = React.useCallback(() => {\n    const root = rootRef.current;\n    const panel = panelRef.current;\n    if (!root || !panel || !isHoverViewport()) {\n      setLeft(undefined);\n      return;\n    }\n    const rect = root.getBoundingClientRect();\n    const pad = 16;\n    const vw = document.documentElement.clientWidth;\n    const clamped = Math.min(\n      Math.max(rect.left, pad),\n      Math.max(pad, vw - pad - panel.offsetWidth)\n    );\n    setLeft(clamped - rect.left);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [hoverMinWidth]);\n\n  const curPath = currentPath ? normalizePath(currentPath) : null;\n  const isCurrent = (href: string) =>\n    curPath !== null && normalizePath(href) === curPath;\n  const featured = resolveFeatured(hovered, menu);\n\n  React.useEffect(() => {\n    if (open) position();\n    else setHovered(null);\n    // `featured` is a dep because the feature column swaps the 600px layout\n    // for the 880px one after open — the wider panel must be re-clamped or a\n    // menu opened near the viewport edge overflows it.\n  }, [open, position, featured]);\n\n  React.useEffect(() => {\n    window.addEventListener('resize', position);\n    return () => window.removeEventListener('resize', position);\n  }, [position]);\n\n  React.useEffect(() => clearTimers, [clearTimers]);\n\n  const onKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === 'Escape' && open) {\n      e.stopPropagation();\n      clearTimers();\n      onOpenChange(false);\n      triggerRef.current?.focus();\n    }\n  };\n\n  const triggerClass = cn(\n    'inline-flex items-center rounded-lg px-3 py-2 text-sm font-medium transition-colors',\n    variant === 'light'\n      ? 'text-white/90 hover:bg-white/10 hover:text-white'\n      : 'text-foreground/80 hover:bg-muted hover:text-foreground',\n    open &&\n      (variant === 'light'\n        ? 'bg-white/10 text-white'\n        : 'bg-muted text-foreground')\n  );\n\n  const navigate = () => {\n    onOpenChange(false);\n    onNavigate?.();\n  };\n\n  return (\n    // Hover/focus delegation region only — the trigger, toggle and links inside are the interactive elements.\n    // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n    <div\n      ref={rootRef}\n      data-slot=\"mega-menu\"\n      data-state={open ? 'open' : 'closed'}\n      className={cn('relative', className)}\n      onMouseEnter={() => isHoverViewport() && requestOpen()}\n      onMouseLeave={() => isHoverViewport() && requestClose()}\n      onFocusCapture={() => {\n        if (!isHoverViewport()) return;\n        clearTimers();\n        onOpenChange(true);\n      }}\n      onBlurCapture={(e) => {\n        if (!isHoverViewport()) return;\n        if (!rootRef.current?.contains(e.relatedTarget as Node | null))\n          requestClose();\n      }}\n      onKeyDown={onKeyDown}\n    >\n      <div className=\"flex items-center\">\n        {menu.href ? (\n          <a\n            ref={triggerRef as React.RefObject<HTMLAnchorElement>}\n            href={menu.href}\n            className={triggerClass}\n            aria-haspopup=\"true\"\n            aria-expanded={open}\n            aria-controls={panelId}\n            aria-current={isCurrent(menu.href) ? 'page' : undefined}\n            onClick={navigate}\n          >\n            {menu.label}\n          </a>\n        ) : (\n          <button\n            ref={triggerRef as React.RefObject<HTMLButtonElement>}\n            type=\"button\"\n            className={triggerClass}\n            aria-haspopup=\"true\"\n            aria-expanded={open}\n            aria-controls={panelId}\n            onClick={() => {\n              clearTimers();\n              onOpenChange(!open);\n            }}\n          >\n            {menu.label}\n          </button>\n        )}\n        <button\n          type=\"button\"\n          aria-label={`Toggle ${menu.label} menu`}\n          aria-expanded={open}\n          aria-controls={panelId}\n          onClick={() => {\n            clearTimers();\n            onOpenChange(!open);\n          }}\n          className={cn(\n            '-ms-1 rounded-md p-1 transition-transform',\n            variant === 'light'\n              ? 'text-white/70 hover:text-white'\n              : 'text-muted-foreground hover:text-foreground',\n            open && 'rotate-180'\n          )}\n        >\n          <ChevronDown size={16} aria-hidden=\"true\" />\n        </button>\n      </div>\n\n      <div\n        id={panelId}\n        ref={panelRef}\n        role=\"region\"\n        aria-label={menu.label}\n        data-slot=\"mega-menu-panel\"\n        style={{ left }}\n        className={cn(\n          'border-border bg-card text-card-foreground absolute top-full z-50 mt-3 origin-top-left rounded-2xl border shadow-xl',\n          'transition-[opacity,transform] duration-200',\n          open\n            ? 'visible translate-y-0 opacity-100'\n            : 'pointer-events-none invisible -translate-y-1 opacity-0',\n          featured\n            ? 'grid w-[min(880px,calc(100vw-2rem))] grid-cols-[1fr_280px]'\n            : 'w-[min(600px,calc(100vw-2rem))]'\n        )}\n      >\n        <div className=\"p-6\">\n          {menu.heading && (\n            <p className=\"text-muted-foreground mb-4 text-[11px] font-bold tracking-[0.14em] uppercase\">\n              {menu.heading}\n            </p>\n          )}\n\n          {menu.groups ? (\n            <div className=\"grid gap-6 sm:grid-cols-2 lg:grid-cols-3\">\n              {menu.groups.map((g) => (\n                <div key={g.label}>\n                  {g.href ? (\n                    <a\n                      href={g.href}\n                      aria-current={isCurrent(g.href) ? 'page' : undefined}\n                      onClick={navigate}\n                      className=\"text-foreground hover:text-primary-700 dark:hover:text-primary-300 mb-2 inline-flex items-center gap-1 text-sm font-semibold\"\n                    >\n                      {g.label}\n                      <ChevronRight size={14} aria-hidden=\"true\" />\n                    </a>\n                  ) : (\n                    <p className=\"text-foreground mb-2 text-sm font-semibold\">\n                      {g.label}\n                    </p>\n                  )}\n                  <ul className=\"space-y-0.5\">\n                    {g.items.map((it) => (\n                      <li key={it.href}>\n                        <ItemLink\n                          item={it}\n                          compact\n                          current={isCurrent(it.href)}\n                          onHover={setHovered}\n                          onNavigate={navigate}\n                        />\n                      </li>\n                    ))}\n                  </ul>\n                </div>\n              ))}\n            </div>\n          ) : (\n            <div className=\"grid gap-1 sm:grid-cols-2\">\n              {menu.items?.map((it) => (\n                <ItemLink\n                  key={it.href}\n                  item={it}\n                  current={isCurrent(it.href)}\n                  onHover={setHovered}\n                  onNavigate={navigate}\n                />\n              ))}\n            </div>\n          )}\n\n          {(menu.allHref || menu.ctaHref) && (\n            <div className=\"border-border mt-5 flex items-center justify-between gap-4 border-t pt-4\">\n              {menu.allHref ? (\n                <a\n                  href={menu.allHref}\n                  onClick={navigate}\n                  className=\"text-foreground hover:text-primary-700 dark:hover:text-primary-300 inline-flex items-center gap-1.5 text-sm font-semibold\"\n                >\n                  {menu.allLabel ?? 'Browse all'}\n                  <ArrowRight size={16} aria-hidden=\"true\" />\n                </a>\n              ) : (\n                <span />\n              )}\n              {menu.ctaHref && (\n                <a\n                  href={menu.ctaHref}\n                  onClick={navigate}\n                  className={buttonVariants({ size: 'sm', effect: 'sheen' })}\n                >\n                  {menu.ctaLabel ?? 'Get started'}\n                </a>\n              )}\n            </div>\n          )}\n        </div>\n\n        {featured && (\n          <FeaturedPanel featured={featured} onNavigate={navigate} />\n        )}\n      </div>\n    </div>\n  );\n}\n\n// =============================================================================\n// Pieces\n// =============================================================================\n\nfunction ItemLink({\n  item,\n  compact,\n  current,\n  onHover,\n  onNavigate,\n}: {\n  item: MegaMenuItem;\n  compact?: boolean;\n  current: boolean;\n  onHover: (item: MegaMenuItem | null) => void;\n  onNavigate: () => void;\n}) {\n  return (\n    <a\n      href={item.href}\n      target={item.external ? '_blank' : undefined}\n      rel={item.external ? 'noopener noreferrer' : undefined}\n      aria-current={current ? 'page' : undefined}\n      data-slot=\"mega-menu-item\"\n      onClick={onNavigate}\n      onMouseEnter={() => onHover(item)}\n      onFocus={() => onHover(item)}\n      className={cn(\n        'group flex items-start gap-3 rounded-xl text-start transition-colors',\n        compact ? 'px-2 py-1.5' : 'p-3',\n        'hover:bg-primary-500/10 focus-visible:bg-primary-500/10 focus-visible:outline-none',\n        current && 'bg-primary-500/10'\n      )}\n    >\n      {item.icon && (\n        <span\n          className={cn(\n            'inline-flex shrink-0 items-center justify-center rounded-lg transition-colors',\n            compact\n              ? 'h-7 w-7 [&_svg]:h-4 [&_svg]:w-4'\n              : 'h-10 w-10 [&_svg]:h-5 [&_svg]:w-5',\n            'bg-muted text-foreground/70 group-hover:bg-primary-800 group-hover:text-white',\n            current && 'bg-primary-800 text-white'\n          )}\n        >\n          {item.icon}\n        </span>\n      )}\n      <span className=\"min-w-0\">\n        <span\n          className={cn(\n            'text-foreground group-hover:text-primary-800 dark:group-hover:text-primary-200 block font-semibold',\n            compact ? 'text-sm' : 'text-base'\n          )}\n        >\n          {item.label}\n        </span>\n        {!compact && item.description && (\n          <span className=\"text-muted-foreground mt-0.5 block text-sm leading-snug\">\n            {item.description}\n          </span>\n        )}\n      </span>\n    </a>\n  );\n}\n\nconst TONE: Record<MegaMenuTone, string> = {\n  primary: 'bg-gradient-to-br from-primary-800 to-primary-950 text-white',\n  accent:\n    'text-white [background:linear-gradient(160deg,color-mix(in_srgb,var(--mieweb-accent,var(--mieweb-primary-700))_70%,#000)_0%,var(--mieweb-primary-950)_100%)]',\n  neutral: 'bg-muted text-foreground',\n};\n\nfunction FeaturedPanel({\n  featured,\n  onNavigate,\n}: {\n  featured: MegaMenuFeatured;\n  onNavigate: () => void;\n}) {\n  const tone = featured.tone ?? 'primary';\n  const onDark = tone !== 'neutral';\n  // `key` re-mounts the panel so swapping between items replays the fade-in.\n  // A `div`, not `aside`: a complementary landmark nested inside the menu\n  // region violates axe landmark-complementary-is-top-level.\n  return (\n    <div\n      data-slot=\"mega-menu-featured\"\n      key={featured.title}\n      className={cn(\n        'flex flex-col rounded-e-2xl p-6 motion-safe:animate-[mie-fade-in_0.2s_ease-out]',\n        TONE[tone]\n      )}\n    >\n      <p\n        className={cn(\n          'text-[11px] font-bold tracking-[0.14em] uppercase',\n          onDark ? 'text-white/70' : 'text-muted-foreground'\n        )}\n      >\n        {featured.eyebrow}\n      </p>\n      <div className=\"mt-4\">\n        {featured.media ??\n          (featured.icon && (\n            <span\n              className={cn(\n                'inline-flex h-14 w-14 items-center justify-center rounded-xl [&_svg]:h-7 [&_svg]:w-7',\n                onDark ? 'bg-white/15 text-white' : 'bg-card text-foreground'\n              )}\n            >\n              {featured.icon}\n            </span>\n          ))}\n      </div>\n      <p className=\"mt-4 text-xl leading-tight font-semibold\">\n        {featured.title}\n      </p>\n      {featured.description && (\n        <p\n          className={cn(\n            'mt-2 text-sm leading-snug',\n            onDark ? 'text-white/80' : 'text-muted-foreground'\n          )}\n        >\n          {featured.description}\n        </p>\n      )}\n      <div className=\"mt-auto pt-5\">\n        <a\n          href={featured.ctaHref}\n          onClick={onNavigate}\n          className={cn(\n            buttonVariants({ variant: 'outline', effect: 'sheen' }),\n            onDark &&\n              'border-white/40 text-white hover:border-white hover:bg-white/10 hover:text-white dark:border-white/40 dark:text-white dark:hover:border-white dark:hover:bg-white/10'\n          )}\n        >\n          {featured.ctaLabel}\n          <ArrowRight size={16} aria-hidden=\"true\" />\n        </a>\n      </div>\n    </div>\n  );\n}\n\n// =============================================================================\n// MegaMenuBar — keeps one menu open at a time\n// =============================================================================\n\nexport interface MegaMenuBarProps extends Pick<\n  MegaMenuProps,\n  'currentPath' | 'variant' | 'resolveFeatured' | 'onNavigate' | 'hoverMinWidth'\n> {\n  menus: MegaMenuConfig[];\n  className?: string;\n  'aria-label'?: string;\n}\n\n/** A row of `MegaMenu` triggers sharing one open-state so only one panel shows. */\nexport function MegaMenuBar({\n  menus,\n  className,\n  'aria-label': ariaLabel = 'Main navigation',\n  ...rest\n}: MegaMenuBarProps) {\n  const [openKey, setOpenKey] = React.useState<string | null>(null);\n  return (\n    <nav\n      data-slot=\"mega-menu-bar\"\n      aria-label={ariaLabel}\n      className={cn('flex items-center gap-1', className)}\n    >\n      {menus.map((m) => (\n        <MegaMenu\n          key={m.key}\n          menu={m}\n          open={openKey === m.key}\n          onOpenChange={(o) =>\n            setOpenKey(o ? m.key : openKey === m.key ? null : openKey)\n          }\n          {...rest}\n        />\n      ))}\n    </nav>\n  );\n}\n"]}

package/dist/{chunk-WUBMDOTG.js → chunk-5JJ2DAE4.js}

@@ -1,8 +1,8 @@
-import { useMotionRuntime, AnimatedPresence, Animated } from './chunk-XCP454Q6.js';
-import { cn } from './chunk-TQONQSJO.js';
 import { useFocusTrap } from './chunk-4SMSH4OY.js';
 import { useEscapeKey } from './chunk-T4ME7QCT.js';
 import { isStorybookDocsMode } from './chunk-VSQF22GL.js';
+import { useMotionRuntime, AnimatedPresence, Animated } from './chunk-XCP454Q6.js';
+import { cn } from './chunk-TQONQSJO.js';
 import * as React from 'react';
 import { cva } from 'class-variance-authority';
 import { jsx, jsxs } from 'react/jsx-runtime';
@@ -294,5 +294,5 @@ function CloseIcon() {
 }
 
 export { Modal, ModalBody, ModalClose, ModalFooter, ModalHeader, ModalTitle, modalContentVariants, modalOverlayVariants };
-//# sourceMappingURL=chunk-WUBMDOTG.js.map
-//# sourceMappingURL=chunk-WUBMDOTG.js.map
+//# sourceMappingURL=chunk-5JJ2DAE4.js.map
+//# sourceMappingURL=chunk-5JJ2DAE4.js.map

package/dist/{chunk-WUBMDOTG.js.map → chunk-5JJ2DAE4.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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","file":"chunk-WUBMDOTG.js","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { isStorybookDocsMode } from '../../utils/environment';\nimport { useFocusTrap } from '../../hooks/useFocusTrap';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { Animated, AnimatedPresence, useMotionRuntime } from '../../motion';\n\n/**\n * Modal scroll lock state manager.\n * Uses a singleton pattern with ref-like storage to track open modals\n * and manage body scroll locking across multiple modal instances.\n * Includes reset capability for testing environments.\n */\nconst scrollLockState = {\n  count: 0,\n  originalOverflow: null as string | null,\n  reset() {\n    this.count = 0;\n    this.originalOverflow = null;\n  },\n};\n\n// Export for testing environments\nexport const __resetScrollLockState = () => scrollLockState.reset();\n\nconst modalOverlayVariants = cva(\n  ['fixed inset-0', 'bg-black/50 backdrop-blur-sm'],\n  {\n    variants: {},\n    defaultVariants: {},\n  }\n);\n\n/**\n * Entry keyframes for the CSS path only.\n *\n * Kept out of the `cva` base so they never run alongside the motion runtime —\n * both drive opacity and transform, and applied together they fight.\n *\n * Entry only: there is no CSS exit. The component unmounts the moment `open`\n * flips to false, so `data-state` is hardcoded `\"open\"` and closed keyframes\n * would be unreachable dead code. That missing exit is the clearest thing the\n * motion opt-in buys back.\n */\nconst MODAL_OVERLAY_FALLBACK_ANIMATION = 'animate-in fade-in-0';\n\nconst MODAL_CONTENT_FALLBACK_ANIMATION =\n  'duration-200 animate-in fade-in-0 zoom-in-95';\n\nconst modalContentVariants = cva(\n  [\n    'relative w-full bg-card text-card-foreground',\n    'border border-border shadow-lg',\n    // Full-screen on mobile, rounded on larger screens\n    'rounded-none sm:rounded-xl',\n    'flex flex-col',\n    // Full viewport height on mobile, constrained on larger screens\n    'max-h-dvh sm:max-h-[calc(100dvh-2rem)]',\n    'min-h-dvh sm:min-h-0',\n    // If a <form> is used as a direct child (wrapping ModalBody + ModalFooter),\n    // make it participate in the flex column layout so overflow constraints work.\n    '[&>form]:flex [&>form]:flex-col [&>form]:flex-1 [&>form]:min-h-0',\n    'focus:outline-none',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'sm:max-w-sm',\n        md: 'sm:max-w-md',\n        lg: 'sm:max-w-lg',\n        xl: 'sm:max-w-xl',\n        '2xl': 'sm:max-w-2xl',\n        '3xl': 'sm:max-w-3xl',\n        '4xl': 'sm:max-w-4xl',\n        full: 'max-w-[calc(100vw-2rem)]',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  }\n);\n\nexport interface ModalProps extends VariantProps<typeof modalContentVariants> {\n  /** Whether the modal is open */\n  open: boolean;\n  /** Callback when the modal should close */\n  onOpenChange: (open: boolean) => void;\n  /** Modal content */\n  children: React.ReactNode;\n  /** Whether to close when clicking the overlay */\n  closeOnOverlayClick?: boolean;\n  /** Whether to close when pressing Escape */\n  closeOnEscape?: boolean;\n  /** Additional class name for the modal content */\n  className?: string;\n  /** ID for the modal, used for accessibility */\n  id?: string;\n  /** Accessible label for the modal */\n  'aria-label'?: string;\n  /** ID of the element that labels the modal */\n  'aria-labelledby'?: string;\n  /** ID of the element that describes the modal */\n  'aria-describedby'?: string;\n}\n\n/**\n * An accessible modal/dialog component.\n *\n * @example\n * ```tsx\n * <Modal open={isOpen} onOpenChange={setIsOpen} size=\"lg\">\n *   <ModalHeader>\n *     <ModalTitle>Confirm Action</ModalTitle>\n *     <ModalClose />\n *   </ModalHeader>\n *   <ModalBody>\n *     Are you sure you want to continue?\n *   </ModalBody>\n *   <ModalFooter>\n *     <Button variant=\"secondary\" onClick={() => setIsOpen(false)}>Cancel</Button>\n *     <Button onClick={handleConfirm}>Confirm</Button>\n *   </ModalFooter>\n * </Modal>\n * ```\n */\nfunction Modal({\n  open,\n  onOpenChange,\n  children,\n  size,\n  closeOnOverlayClick = true,\n  closeOnEscape = true,\n  className,\n  id,\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledBy,\n  'aria-describedby': ariaDescribedBy,\n}: ModalProps) {\n  const generatedId = React.useId();\n  const modalId = id || generatedId;\n\n  /*\n   * The dialog outlives `open`.\n   *\n   * With a motion runtime, `AnimatedPresence` keeps the subtree on screen until\n   * its exit animation finishes. Guards keyed on `open` alone would therefore\n   * release while a `role=\"dialog\" aria-modal=\"true\"` element is still visible:\n   * Tab could reach the page behind it and body scrolling would resume under\n   * it. `isGuarded` stays true until presence reports the exit is done.\n   *\n   * Only tracked when a runtime is actually animating. Without one the subtree\n   * unmounts on the same frame, and `onExitComplete` would never fire to clear\n   * the flag.\n   */\n  const runtime = useMotionRuntime();\n  const animatesExit = Boolean(runtime?.enabled);\n  const [isExiting, setIsExiting] = React.useState(false);\n  const [prevOpen, setPrevOpen] = React.useState(open);\n\n  // Derived synchronously during render (React's \"adjust state when props\n  // change\" pattern), not in an effect. An effect runs after commit, which\n  // would leave one committed frame with the dialog still on screen but\n  // `isGuarded` false — the focus trap would tear down, restore focus, then\n  // re-arm and yank focus into the closing dialog, with the scroll lock\n  // flickering alongside. Setting state during render re-renders before\n  // commit, so the guards never observe the gap.\n  if (prevOpen !== open) {\n    setPrevOpen(open);\n    if (!open && animatesExit) {\n      setIsExiting(true);\n    }\n  }\n\n  // If the runtime disappears or is disabled mid-exit, `onExitComplete` will\n  // never fire — the subtree is already gone. Without this reset the guards\n  // (and the body scroll lock with them) would be held forever.\n  React.useEffect(() => {\n    if (!animatesExit && isExiting) {\n      setIsExiting(false);\n    }\n  }, [animatesExit, isExiting]);\n\n  const isGuarded = open || isExiting;\n\n  // Focus trap. Typed as `HTMLElement` because the content element is supplied\n  // by `Animated`, which is element-agnostic.\n  const focusTrapRef = useFocusTrap<HTMLElement>(isGuarded);\n\n  // Handle escape key\n  useEscapeKey(() => {\n    if (closeOnEscape && open) {\n      onOpenChange(false);\n    }\n  }, open);\n\n  // Handle overlay click\n  const handleOverlayClick = React.useCallback(\n    (e: React.MouseEvent) => {\n      if (closeOnOverlayClick && e.target === e.currentTarget) {\n        onOpenChange(false);\n      }\n    },\n    [closeOnOverlayClick, onOpenChange]\n  );\n\n  // Prevent body scroll while the modal is on screen (handles multiple modals).\n  // Keyed on `isGuarded`, not `open`, so scrolling does not resume underneath a\n  // dialog that is still animating out.\n  // Skip scroll lock in Storybook docs mode where multiple stories render inline\n  React.useEffect(() => {\n    // Skip scroll lock entirely in Storybook docs mode\n    if (!isGuarded || isStorybookDocsMode()) {\n      return undefined;\n    }\n\n    scrollLockState.count++;\n    // Only capture and set overflow when first modal opens\n    if (scrollLockState.count === 1) {\n      scrollLockState.originalOverflow = document.body.style.overflow;\n      document.body.style.overflow = 'hidden';\n    }\n\n    return () => {\n      scrollLockState.count--;\n      // Only restore overflow when last modal closes\n      if (\n        scrollLockState.count === 0 &&\n        scrollLockState.originalOverflow !== null\n      ) {\n        document.body.style.overflow = scrollLockState.originalOverflow;\n        scrollLockState.originalOverflow = null;\n      }\n    };\n  }, [isGuarded]);\n\n  return (\n    <ModalContext.Provider\n      value={{ onClose: () => onOpenChange(false), modalId }}\n    >\n      {/*\n        The `open` check lives inside `AnimatedPresence` rather than as an early\n        `return null` above. On the CSS path this is identical — the tree\n        unmounts immediately. With a motion runtime the subtree is held on\n        screen until the overlay and content finish their exit animations.\n      */}\n      <AnimatedPresence onExitComplete={() => setIsExiting(false)}>\n        {open && (\n          <div key=\"modal-root\" className=\"fixed inset-0 z-50\">\n            {/* Overlay backdrop */}\n            <Animated\n              preset=\"overlay\"\n              mode=\"presence\"\n              className={cn(modalOverlayVariants())}\n              fallbackClassName={MODAL_OVERLAY_FALLBACK_ANIMATION}\n              data-state=\"open\"\n              aria-hidden=\"true\"\n            />\n            {/* Scrollable centering container — click outside to close */}\n            <div className=\"fixed inset-0 overflow-y-auto\">\n              {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}\n              <div\n                className=\"flex min-h-full items-center justify-center p-0 sm:p-4\"\n                onClick={handleOverlayClick}\n              >\n                {/* Content */}\n                <Animated\n                  ref={focusTrapRef}\n                  preset=\"modalContent\"\n                  mode=\"presence\"\n                  role=\"dialog\"\n                  aria-modal=\"true\"\n                  aria-label={ariaLabel}\n                  aria-labelledby={ariaLabelledBy || `${modalId}-title`}\n                  aria-describedby={ariaDescribedBy}\n                  id={modalId}\n                  tabIndex={-1}\n                  data-state=\"open\"\n                  data-slot=\"modal\"\n                  className={cn(modalContentVariants({ size }), className)}\n                  fallbackClassName={MODAL_CONTENT_FALLBACK_ANIMATION}\n                  onClick={(e) => e.stopPropagation()}\n                >\n                  {children}\n                </Animated>\n              </div>\n            </div>\n          </div>\n        )}\n      </AnimatedPresence>\n    </ModalContext.Provider>\n  );\n}\n\nModal.displayName = 'Modal';\n\n// ============================================================================\n// Modal Context\n// ============================================================================\n\ninterface ModalContextValue {\n  onClose: () => void;\n  modalId: string;\n}\n\nconst ModalContext = React.createContext<ModalContextValue | undefined>(\n  undefined\n);\n\nfunction useModalContext() {\n  const context = React.useContext(ModalContext);\n  if (!context) {\n    throw new Error('Modal components must be used within a Modal');\n  }\n  return context;\n}\n\n// ============================================================================\n// Modal Header\n// ============================================================================\n\nexport type ModalHeaderProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Header section of a Modal.\n */\nconst ModalHeader = React.forwardRef<HTMLDivElement, ModalHeaderProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"modal-header\"\n      className={cn(\n        'flex shrink-0 items-center justify-between',\n        'border-border border-b px-6 py-4',\n        className\n      )}\n      {...props}\n    />\n  )\n);\n\nModalHeader.displayName = 'ModalHeader';\n\n// ============================================================================\n// Modal Title\n// ============================================================================\n\nexport type ModalTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\n\n/**\n * Title for a Modal.\n */\nconst ModalTitle = React.forwardRef<HTMLHeadingElement, ModalTitleProps>(\n  ({ className, children, ...props }, ref) => {\n    const { modalId } = useModalContext();\n    return (\n      <h2\n        ref={ref}\n        id={`${modalId}-title`}\n        data-slot=\"modal-title\"\n        className={cn(\n          'text-lg leading-none font-semibold tracking-tight',\n          className\n        )}\n        {...props}\n      >\n        {children}\n      </h2>\n    );\n  }\n);\n\nModalTitle.displayName = 'ModalTitle';\n\n// ============================================================================\n// Modal Close Button\n// ============================================================================\n\nexport type ModalCloseProps = React.ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * Close button for a Modal.\n */\nconst ModalClose = React.forwardRef<HTMLButtonElement, ModalCloseProps>(\n  ({ className, children, onClick, ...props }, ref) => {\n    const { onClose } = useModalContext();\n\n    const handleClick = React.useCallback(\n      (e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        if (!e.defaultPrevented) {\n          onClose();\n        }\n      },\n      [onClick, onClose]\n    );\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        onClick={handleClick}\n        data-slot=\"modal-close\"\n        className={cn(\n          'inline-flex h-8 w-8 items-center justify-center rounded-lg',\n          'text-muted-foreground hover:text-foreground',\n          'hover:bg-muted transition-colors',\n          'focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none',\n          className\n        )}\n        aria-label=\"Close\"\n        {...props}\n      >\n        {children || <CloseIcon />}\n      </button>\n    );\n  }\n);\n\nModalClose.displayName = 'ModalClose';\n\n// ============================================================================\n// Modal Body\n// ============================================================================\n\nexport type ModalBodyProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Main content area of a Modal.\n */\nconst ModalBody = React.forwardRef<HTMLDivElement, ModalBodyProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"modal-body\"\n      className={cn('min-h-0 flex-1 overflow-y-auto px-6 py-4', className)}\n      {...props}\n    />\n  )\n);\n\nModalBody.displayName = 'ModalBody';\n\n// ============================================================================\n// Modal Footer\n// ============================================================================\n\nexport type ModalFooterProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Footer section of a Modal, typically for action buttons.\n */\nconst ModalFooter = React.forwardRef<HTMLDivElement, ModalFooterProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"modal-footer\"\n      className={cn(\n        'flex shrink-0 items-center justify-end gap-3',\n        'border-border border-t px-6 py-4',\n        className\n      )}\n      {...props}\n    />\n  )\n);\n\nModalFooter.displayName = 'ModalFooter';\n\n// ============================================================================\n// Close Icon\n// ============================================================================\n\nfunction CloseIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"M18 6 6 18\" />\n      <path d=\"m6 6 12 12\" />\n    </svg>\n  );\n}\n\nexport {\n  Modal,\n  ModalHeader,\n  ModalTitle,\n  ModalClose,\n  ModalBody,\n  ModalFooter,\n  modalContentVariants,\n  modalOverlayVariants,\n};\n"]}
+{"version":3,"sources":["../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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","file":"chunk-5JJ2DAE4.js","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { isStorybookDocsMode } from '../../utils/environment';\nimport { useFocusTrap } from '../../hooks/useFocusTrap';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { Animated, AnimatedPresence, useMotionRuntime } from '../../motion';\n\n/**\n * Modal scroll lock state manager.\n * Uses a singleton pattern with ref-like storage to track open modals\n * and manage body scroll locking across multiple modal instances.\n * Includes reset capability for testing environments.\n */\nconst scrollLockState = {\n  count: 0,\n  originalOverflow: null as string | null,\n  reset() {\n    this.count = 0;\n    this.originalOverflow = null;\n  },\n};\n\n// Export for testing environments\nexport const __resetScrollLockState = () => scrollLockState.reset();\n\nconst modalOverlayVariants = cva(\n  ['fixed inset-0', 'bg-black/50 backdrop-blur-sm'],\n  {\n    variants: {},\n    defaultVariants: {},\n  }\n);\n\n/**\n * Entry keyframes for the CSS path only.\n *\n * Kept out of the `cva` base so they never run alongside the motion runtime —\n * both drive opacity and transform, and applied together they fight.\n *\n * Entry only: there is no CSS exit. The component unmounts the moment `open`\n * flips to false, so `data-state` is hardcoded `\"open\"` and closed keyframes\n * would be unreachable dead code. That missing exit is the clearest thing the\n * motion opt-in buys back.\n */\nconst MODAL_OVERLAY_FALLBACK_ANIMATION = 'animate-in fade-in-0';\n\nconst MODAL_CONTENT_FALLBACK_ANIMATION =\n  'duration-200 animate-in fade-in-0 zoom-in-95';\n\nconst modalContentVariants = cva(\n  [\n    'relative w-full bg-card text-card-foreground',\n    'border border-border shadow-lg',\n    // Full-screen on mobile, rounded on larger screens\n    'rounded-none sm:rounded-xl',\n    'flex flex-col',\n    // Full viewport height on mobile, constrained on larger screens\n    'max-h-dvh sm:max-h-[calc(100dvh-2rem)]',\n    'min-h-dvh sm:min-h-0',\n    // If a <form> is used as a direct child (wrapping ModalBody + ModalFooter),\n    // make it participate in the flex column layout so overflow constraints work.\n    '[&>form]:flex [&>form]:flex-col [&>form]:flex-1 [&>form]:min-h-0',\n    'focus:outline-none',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'sm:max-w-sm',\n        md: 'sm:max-w-md',\n        lg: 'sm:max-w-lg',\n        xl: 'sm:max-w-xl',\n        '2xl': 'sm:max-w-2xl',\n        '3xl': 'sm:max-w-3xl',\n        '4xl': 'sm:max-w-4xl',\n        full: 'max-w-[calc(100vw-2rem)]',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  }\n);\n\nexport interface ModalProps extends VariantProps<typeof modalContentVariants> {\n  /** Whether the modal is open */\n  open: boolean;\n  /** Callback when the modal should close */\n  onOpenChange: (open: boolean) => void;\n  /** Modal content */\n  children: React.ReactNode;\n  /** Whether to close when clicking the overlay */\n  closeOnOverlayClick?: boolean;\n  /** Whether to close when pressing Escape */\n  closeOnEscape?: boolean;\n  /** Additional class name for the modal content */\n  className?: string;\n  /** ID for the modal, used for accessibility */\n  id?: string;\n  /** Accessible label for the modal */\n  'aria-label'?: string;\n  /** ID of the element that labels the modal */\n  'aria-labelledby'?: string;\n  /** ID of the element that describes the modal */\n  'aria-describedby'?: string;\n}\n\n/**\n * An accessible modal/dialog component.\n *\n * @example\n * ```tsx\n * <Modal open={isOpen} onOpenChange={setIsOpen} size=\"lg\">\n *   <ModalHeader>\n *     <ModalTitle>Confirm Action</ModalTitle>\n *     <ModalClose />\n *   </ModalHeader>\n *   <ModalBody>\n *     Are you sure you want to continue?\n *   </ModalBody>\n *   <ModalFooter>\n *     <Button variant=\"secondary\" onClick={() => setIsOpen(false)}>Cancel</Button>\n *     <Button onClick={handleConfirm}>Confirm</Button>\n *   </ModalFooter>\n * </Modal>\n * ```\n */\nfunction Modal({\n  open,\n  onOpenChange,\n  children,\n  size,\n  closeOnOverlayClick = true,\n  closeOnEscape = true,\n  className,\n  id,\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledBy,\n  'aria-describedby': ariaDescribedBy,\n}: ModalProps) {\n  const generatedId = React.useId();\n  const modalId = id || generatedId;\n\n  /*\n   * The dialog outlives `open`.\n   *\n   * With a motion runtime, `AnimatedPresence` keeps the subtree on screen until\n   * its exit animation finishes. Guards keyed on `open` alone would therefore\n   * release while a `role=\"dialog\" aria-modal=\"true\"` element is still visible:\n   * Tab could reach the page behind it and body scrolling would resume under\n   * it. `isGuarded` stays true until presence reports the exit is done.\n   *\n   * Only tracked when a runtime is actually animating. Without one the subtree\n   * unmounts on the same frame, and `onExitComplete` would never fire to clear\n   * the flag.\n   */\n  const runtime = useMotionRuntime();\n  const animatesExit = Boolean(runtime?.enabled);\n  const [isExiting, setIsExiting] = React.useState(false);\n  const [prevOpen, setPrevOpen] = React.useState(open);\n\n  // Derived synchronously during render (React's \"adjust state when props\n  // change\" pattern), not in an effect. An effect runs after commit, which\n  // would leave one committed frame with the dialog still on screen but\n  // `isGuarded` false — the focus trap would tear down, restore focus, then\n  // re-arm and yank focus into the closing dialog, with the scroll lock\n  // flickering alongside. Setting state during render re-renders before\n  // commit, so the guards never observe the gap.\n  if (prevOpen !== open) {\n    setPrevOpen(open);\n    if (!open && animatesExit) {\n      setIsExiting(true);\n    }\n  }\n\n  // If the runtime disappears or is disabled mid-exit, `onExitComplete` will\n  // never fire — the subtree is already gone. Without this reset the guards\n  // (and the body scroll lock with them) would be held forever.\n  React.useEffect(() => {\n    if (!animatesExit && isExiting) {\n      setIsExiting(false);\n    }\n  }, [animatesExit, isExiting]);\n\n  const isGuarded = open || isExiting;\n\n  // Focus trap. Typed as `HTMLElement` because the content element is supplied\n  // by `Animated`, which is element-agnostic.\n  const focusTrapRef = useFocusTrap<HTMLElement>(isGuarded);\n\n  // Handle escape key\n  useEscapeKey(() => {\n    if (closeOnEscape && open) {\n      onOpenChange(false);\n    }\n  }, open);\n\n  // Handle overlay click\n  const handleOverlayClick = React.useCallback(\n    (e: React.MouseEvent) => {\n      if (closeOnOverlayClick && e.target === e.currentTarget) {\n        onOpenChange(false);\n      }\n    },\n    [closeOnOverlayClick, onOpenChange]\n  );\n\n  // Prevent body scroll while the modal is on screen (handles multiple modals).\n  // Keyed on `isGuarded`, not `open`, so scrolling does not resume underneath a\n  // dialog that is still animating out.\n  // Skip scroll lock in Storybook docs mode where multiple stories render inline\n  React.useEffect(() => {\n    // Skip scroll lock entirely in Storybook docs mode\n    if (!isGuarded || isStorybookDocsMode()) {\n      return undefined;\n    }\n\n    scrollLockState.count++;\n    // Only capture and set overflow when first modal opens\n    if (scrollLockState.count === 1) {\n      scrollLockState.originalOverflow = document.body.style.overflow;\n      document.body.style.overflow = 'hidden';\n    }\n\n    return () => {\n      scrollLockState.count--;\n      // Only restore overflow when last modal closes\n      if (\n        scrollLockState.count === 0 &&\n        scrollLockState.originalOverflow !== null\n      ) {\n        document.body.style.overflow = scrollLockState.originalOverflow;\n        scrollLockState.originalOverflow = null;\n      }\n    };\n  }, [isGuarded]);\n\n  return (\n    <ModalContext.Provider\n      value={{ onClose: () => onOpenChange(false), modalId }}\n    >\n      {/*\n        The `open` check lives inside `AnimatedPresence` rather than as an early\n        `return null` above. On the CSS path this is identical — the tree\n        unmounts immediately. With a motion runtime the subtree is held on\n        screen until the overlay and content finish their exit animations.\n      */}\n      <AnimatedPresence onExitComplete={() => setIsExiting(false)}>\n        {open && (\n          <div key=\"modal-root\" className=\"fixed inset-0 z-50\">\n            {/* Overlay backdrop */}\n            <Animated\n              preset=\"overlay\"\n              mode=\"presence\"\n              className={cn(modalOverlayVariants())}\n              fallbackClassName={MODAL_OVERLAY_FALLBACK_ANIMATION}\n              data-state=\"open\"\n              aria-hidden=\"true\"\n            />\n            {/* Scrollable centering container — click outside to close */}\n            <div className=\"fixed inset-0 overflow-y-auto\">\n              {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}\n              <div\n                className=\"flex min-h-full items-center justify-center p-0 sm:p-4\"\n                onClick={handleOverlayClick}\n              >\n                {/* Content */}\n                <Animated\n                  ref={focusTrapRef}\n                  preset=\"modalContent\"\n                  mode=\"presence\"\n                  role=\"dialog\"\n                  aria-modal=\"true\"\n                  aria-label={ariaLabel}\n                  aria-labelledby={ariaLabelledBy || `${modalId}-title`}\n                  aria-describedby={ariaDescribedBy}\n                  id={modalId}\n                  tabIndex={-1}\n                  data-state=\"open\"\n                  data-slot=\"modal\"\n                  className={cn(modalContentVariants({ size }), className)}\n                  fallbackClassName={MODAL_CONTENT_FALLBACK_ANIMATION}\n                  onClick={(e) => e.stopPropagation()}\n                >\n                  {children}\n                </Animated>\n              </div>\n            </div>\n          </div>\n        )}\n      </AnimatedPresence>\n    </ModalContext.Provider>\n  );\n}\n\nModal.displayName = 'Modal';\n\n// ============================================================================\n// Modal Context\n// ============================================================================\n\ninterface ModalContextValue {\n  onClose: () => void;\n  modalId: string;\n}\n\nconst ModalContext = React.createContext<ModalContextValue | undefined>(\n  undefined\n);\n\nfunction useModalContext() {\n  const context = React.useContext(ModalContext);\n  if (!context) {\n    throw new Error('Modal components must be used within a Modal');\n  }\n  return context;\n}\n\n// ============================================================================\n// Modal Header\n// ============================================================================\n\nexport type ModalHeaderProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Header section of a Modal.\n */\nconst ModalHeader = React.forwardRef<HTMLDivElement, ModalHeaderProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"modal-header\"\n      className={cn(\n        'flex shrink-0 items-center justify-between',\n        'border-border border-b px-6 py-4',\n        className\n      )}\n      {...props}\n    />\n  )\n);\n\nModalHeader.displayName = 'ModalHeader';\n\n// ============================================================================\n// Modal Title\n// ============================================================================\n\nexport type ModalTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\n\n/**\n * Title for a Modal.\n */\nconst ModalTitle = React.forwardRef<HTMLHeadingElement, ModalTitleProps>(\n  ({ className, children, ...props }, ref) => {\n    const { modalId } = useModalContext();\n    return (\n      <h2\n        ref={ref}\n        id={`${modalId}-title`}\n        data-slot=\"modal-title\"\n        className={cn(\n          'text-lg leading-none font-semibold tracking-tight',\n          className\n        )}\n        {...props}\n      >\n        {children}\n      </h2>\n    );\n  }\n);\n\nModalTitle.displayName = 'ModalTitle';\n\n// ============================================================================\n// Modal Close Button\n// ============================================================================\n\nexport type ModalCloseProps = React.ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * Close button for a Modal.\n */\nconst ModalClose = React.forwardRef<HTMLButtonElement, ModalCloseProps>(\n  ({ className, children, onClick, ...props }, ref) => {\n    const { onClose } = useModalContext();\n\n    const handleClick = React.useCallback(\n      (e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        if (!e.defaultPrevented) {\n          onClose();\n        }\n      },\n      [onClick, onClose]\n    );\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        onClick={handleClick}\n        data-slot=\"modal-close\"\n        className={cn(\n          'inline-flex h-8 w-8 items-center justify-center rounded-lg',\n          'text-muted-foreground hover:text-foreground',\n          'hover:bg-muted transition-colors',\n          'focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none',\n          className\n        )}\n        aria-label=\"Close\"\n        {...props}\n      >\n        {children || <CloseIcon />}\n      </button>\n    );\n  }\n);\n\nModalClose.displayName = 'ModalClose';\n\n// ============================================================================\n// Modal Body\n// ============================================================================\n\nexport type ModalBodyProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Main content area of a Modal.\n */\nconst ModalBody = React.forwardRef<HTMLDivElement, ModalBodyProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"modal-body\"\n      className={cn('min-h-0 flex-1 overflow-y-auto px-6 py-4', className)}\n      {...props}\n    />\n  )\n);\n\nModalBody.displayName = 'ModalBody';\n\n// ============================================================================\n// Modal Footer\n// ============================================================================\n\nexport type ModalFooterProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Footer section of a Modal, typically for action buttons.\n */\nconst ModalFooter = React.forwardRef<HTMLDivElement, ModalFooterProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"modal-footer\"\n      className={cn(\n        'flex shrink-0 items-center justify-end gap-3',\n        'border-border border-t px-6 py-4',\n        className\n      )}\n      {...props}\n    />\n  )\n);\n\nModalFooter.displayName = 'ModalFooter';\n\n// ============================================================================\n// Close Icon\n// ============================================================================\n\nfunction CloseIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"M18 6 6 18\" />\n      <path d=\"m6 6 12 12\" />\n    </svg>\n  );\n}\n\nexport {\n  Modal,\n  ModalHeader,\n  ModalTitle,\n  ModalClose,\n  ModalBody,\n  ModalFooter,\n  modalContentVariants,\n  modalOverlayVariants,\n};\n"]}