@alfadocs/ui-kit-debug 0.1.8 → 0.1.9

package/dist/_chunks/navigation-menu-EVFau1O2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"navigation-menu-EVFau1O2.js","sources":["../../src/components/navigation-menu/navigation-menu.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useRef,\n  type ComponentPropsWithoutRef,\n  type ElementRef,\n} from 'react';\nimport * as RadixNavigationMenu from '@radix-ui/react-navigation-menu';\nimport { Slot } from '@radix-ui/react-slot';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { ChevronDown } from 'lucide-react';\nimport { useDirection } from '../_shared/use-direction';\nimport { composeRefs } from '../_shared/compose-refs';\n// SkipLink moved to its own module — re-imported for the navigation-menu\n// barrel's backwards-compat re-export. New consumers should import it\n// directly from `@alfadocs/ui-kit`.\nimport { SkipLink } from '../skip-link';\n\n/* -------------------------------------------------------------------- */\n/* Root                                                                  */\n/* -------------------------------------------------------------------- */\n\nconst rootClasses = [\n  'ds:relative ds:z-[var(--z-dropdown)]',\n  'ds:flex ds:max-w-max ds:items-center ds:justify-center',\n].join(' ');\n\nexport interface NavigationMenuProps\n  extends ComponentPropsWithoutRef<typeof RadixNavigationMenu.Root> {\n  'aria-label'?: string;\n}\n\nconst NavigationMenu = forwardRef<\n  ElementRef<typeof RadixNavigationMenu.Root>,\n  NavigationMenuProps\n>(({ 'aria-label': ariaLabel, className, children, ...rest }, ref) => {\n  const { t } = useTranslation();\n  const rootRef = useRef<ElementRef<typeof RadixNavigationMenu.Root>>(null);\n  const composedRef = composeRefs(ref, rootRef);\n  const dir = useDirection(rootRef);\n  return (\n    <RadixNavigationMenu.Root\n      ref={composedRef}\n      dir={dir}\n      aria-label={ariaLabel ?? t('ui.navigation.nav.label')}\n      className={[rootClasses, className].filter(Boolean).join(' ')}\n      data-component=\"navigation-menu\"\n      {...rest}\n    >\n      {children}\n      <NavigationMenuViewport />\n    </RadixNavigationMenu.Root>\n  );\n});\nNavigationMenu.displayName = 'NavigationMenu';\n\n/* -------------------------------------------------------------------- */\n/* List + Item                                                           */\n/* -------------------------------------------------------------------- */\n\nconst listClasses = [\n  'ds:group ds:flex ds:flex-1',\n  'ds:list-none ds:items-center ds:justify-center',\n  'ds:gap-[var(--spacing-xs)]',\n  'ds:m-0 ds:ps-0',\n].join(' ');\n\nconst NavigationMenuList = forwardRef<\n  ElementRef<typeof RadixNavigationMenu.List>,\n  ComponentPropsWithoutRef<typeof RadixNavigationMenu.List>\n>(({ className, ...rest }, ref) => (\n  <RadixNavigationMenu.List\n    ref={ref}\n    className={[listClasses, className].filter(Boolean).join(' ')}\n    {...rest}\n  />\n));\nNavigationMenuList.displayName = 'NavigationMenuList';\n\nconst NavigationMenuItem = RadixNavigationMenu.Item;\n\n/* -------------------------------------------------------------------- */\n/* Trigger                                                               */\n/* -------------------------------------------------------------------- */\n\nconst triggerClasses = [\n  'ds:group ds:inline-flex ds:items-center ds:justify-center',\n  'ds:min-h-[var(--min-target-size)]',\n  'ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-sm)]',\n  'ds:rounded-[var(--radius-sm)]',\n  'ds:text-[var(--font-size-sm)] ds:font-[var(--font-weight-medium)]',\n  'ds:text-[var(--foreground)]',\n  'ds:hover:bg-[var(--muted)]/20',\n  'ds:data-[state=open]:bg-[var(--muted)]/20',\n  'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n  'ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n  'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n  'ds:disabled:cursor-not-allowed ds:disabled:opacity-50',\n  'ds:gap-[var(--spacing-xs)]',\n].join(' ');\n\nconst chevronClasses = [\n  'ds:size-3 ds:transition-transform ds:duration-[var(--animation-duration)]',\n  'ds:group-data-[state=open]:rotate-180',\n  'ds:rtl:-scale-x-100 ds:motion-reduce:transition-none',\n].join(' ');\n\nconst NavigationMenuTrigger = forwardRef<\n  ElementRef<typeof RadixNavigationMenu.Trigger>,\n  ComponentPropsWithoutRef<typeof RadixNavigationMenu.Trigger>\n>(({ className, children, ...rest }, ref) => (\n  <RadixNavigationMenu.Trigger\n    ref={ref}\n    className={[triggerClasses, className].filter(Boolean).join(' ')}\n    {...rest}\n  >\n    {children}\n    <ChevronDown aria-hidden=\"true\" className={chevronClasses} />\n  </RadixNavigationMenu.Trigger>\n));\nNavigationMenuTrigger.displayName = 'NavigationMenuTrigger';\n\n/* -------------------------------------------------------------------- */\n/* Content                                                               */\n/* -------------------------------------------------------------------- */\n\nconst contentBase = [\n  'ds:absolute ds:start-0 ds:top-0 ds:w-full',\n  'ds:md:w-auto',\n  'ds:bg-[var(--background)] ds:text-[var(--foreground)]',\n  'ds:rounded-[var(--radius-md)] ds:border ds:border-[var(--border)]',\n  'ds:shadow-[var(--shadow-lg)]',\n  'ds:p-[var(--spacing-md)]',\n  'ds:data-[motion^=from-]:animate-in ds:data-[motion^=to-]:animate-out',\n  // Logical start/end motion mapped onto physical Tailwind animation utilities.\n  // The `rtl:` variants mirror the slide direction so `from-start` enters from\n  // the inline-start edge in both LTR and RTL.\n  'ds:data-[motion=from-start]:slide-in-from-left-52 ds:rtl:data-[motion=from-start]:slide-in-from-right-52',\n  'ds:data-[motion=from-end]:slide-in-from-right-52 ds:rtl:data-[motion=from-end]:slide-in-from-left-52',\n  'ds:data-[motion=to-start]:slide-out-to-left-52 ds:rtl:data-[motion=to-start]:slide-out-to-right-52',\n  'ds:data-[motion=to-end]:slide-out-to-right-52 ds:rtl:data-[motion=to-end]:slide-out-to-left-52',\n  'ds:motion-reduce:animate-none',\n].join(' ');\n\nconst contentVariants = cva(contentBase, {\n  variants: {\n    layout: {\n      simple: 'ds:min-w-[16rem]',\n      mega: 'ds:grid ds:grid-cols-[repeat(auto-fit,minmax(12rem,1fr))] ds:gap-[var(--spacing-md)] ds:min-w-[32rem]',\n    },\n  },\n  defaultVariants: { layout: 'simple' },\n});\n\nexport interface NavigationMenuContentProps\n  extends ComponentPropsWithoutRef<typeof RadixNavigationMenu.Content>,\n    VariantProps<typeof contentVariants> {}\n\nconst NavigationMenuContent = forwardRef<\n  ElementRef<typeof RadixNavigationMenu.Content>,\n  NavigationMenuContentProps\n>(({ layout, className, ...rest }, ref) => (\n  <RadixNavigationMenu.Content\n    ref={ref}\n    className={contentVariants({ layout, className })}\n    {...rest}\n  />\n));\nNavigationMenuContent.displayName = 'NavigationMenuContent';\n\n/* -------------------------------------------------------------------- */\n/* Link                                                                  */\n/* -------------------------------------------------------------------- */\n\nconst linkClasses = [\n  'ds:block ds:rounded-[var(--radius-sm)]',\n  'ds:min-h-[var(--min-target-size)]',\n  'ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]',\n  'ds:py-[var(--spacing-xs)]',\n  'ds:text-[var(--font-size-sm)] ds:font-[var(--font-weight-medium)]',\n  'ds:text-[var(--foreground)]',\n  'ds:no-underline',\n  'ds:hover:bg-[var(--muted)]/20',\n  'ds:data-[active]:underline ds:data-[active]:underline-offset-[var(--spacing-xs)]',\n  'ds:aria-[current=page]:underline ds:aria-[current=page]:underline-offset-[var(--spacing-xs)]',\n  'ds:aria-[current=page]:font-[var(--font-weight-semibold)]',\n  'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n  'ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n  'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n].join(' ');\n\nexport interface NavigationMenuLinkProps\n  extends ComponentPropsWithoutRef<typeof RadixNavigationMenu.Link> {\n  /** Render through Radix Slot so routers can inject their own link element. */\n  asChild?: boolean;\n}\n\nconst NavigationMenuLink = forwardRef<\n  ElementRef<typeof RadixNavigationMenu.Link>,\n  NavigationMenuLinkProps\n>(({ asChild = false, className, children, ...rest }, ref) => (\n  <RadixNavigationMenu.Link\n    ref={ref}\n    asChild={asChild}\n    className={asChild ? undefined : [linkClasses, className].filter(Boolean).join(' ')}\n    {...rest}\n  >\n    {asChild ? (\n      <Slot className={[linkClasses, className].filter(Boolean).join(' ')}>\n        {children}\n      </Slot>\n    ) : (\n      children\n    )}\n  </RadixNavigationMenu.Link>\n));\nNavigationMenuLink.displayName = 'NavigationMenuLink';\n\n/* -------------------------------------------------------------------- */\n/* Indicator + Viewport                                                  */\n/* -------------------------------------------------------------------- */\n\nconst indicatorClasses = [\n  'ds:top-full ds:z-[1] ds:flex ds:h-2 ds:items-end ds:justify-center ds:overflow-hidden',\n  'ds:data-[state=visible]:animate-in ds:data-[state=hidden]:animate-out',\n  'ds:data-[state=visible]:fade-in ds:data-[state=hidden]:fade-out',\n  'ds:motion-reduce:animate-none',\n].join(' ');\n\nconst NavigationMenuIndicator = forwardRef<\n  ElementRef<typeof RadixNavigationMenu.Indicator>,\n  ComponentPropsWithoutRef<typeof RadixNavigationMenu.Indicator>\n>(({ className, ...rest }, ref) => (\n  <RadixNavigationMenu.Indicator\n    ref={ref}\n    className={[indicatorClasses, className].filter(Boolean).join(' ')}\n    {...rest}\n  >\n    <span className=\"ds:relative ds:top-[60%] ds:h-2 ds:w-2 ds:rotate-45 ds:rounded-tl-sm ds:bg-[var(--border)]\" />\n  </RadixNavigationMenu.Indicator>\n));\nNavigationMenuIndicator.displayName = 'NavigationMenuIndicator';\n\nconst viewportClasses = [\n  'ds:origin-top-center ds:relative ds:mt-[var(--spacing-xs)]',\n  'ds:h-[var(--radix-navigation-menu-viewport-height)]',\n  'ds:w-full ds:overflow-hidden',\n  'ds:rounded-[var(--radius-md)] ds:border ds:border-[var(--border)]',\n  'ds:bg-[var(--background)] ds:text-[var(--foreground)]',\n  'ds:shadow-[var(--shadow-lg)]',\n  'ds:data-[state=open]:animate-in ds:data-[state=closed]:animate-out',\n  'ds:data-[state=open]:zoom-in-90 ds:data-[state=closed]:zoom-out-95',\n  'ds:motion-reduce:animate-none',\n].join(' ');\n\nconst NavigationMenuViewport = forwardRef<\n  ElementRef<typeof RadixNavigationMenu.Viewport>,\n  ComponentPropsWithoutRef<typeof RadixNavigationMenu.Viewport>\n>(({ className, ...rest }, ref) => (\n  <div className=\"ds:absolute ds:start-0 ds:top-full ds:flex ds:justify-center\">\n    <RadixNavigationMenu.Viewport\n      ref={ref}\n      className={[viewportClasses, className].filter(Boolean).join(' ')}\n      {...rest}\n    />\n  </div>\n));\nNavigationMenuViewport.displayName = 'NavigationMenuViewport';\n\n/* -------------------------------------------------------------------- */\n/* Exports                                                               */\n/* -------------------------------------------------------------------- */\n\nexport {\n  NavigationMenu,\n  NavigationMenuList,\n  NavigationMenuItem,\n  NavigationMenuTrigger,\n  NavigationMenuContent,\n  NavigationMenuLink,\n  NavigationMenuIndicator,\n  NavigationMenuViewport,\n  SkipLink,\n};\n"],"names":["rootClasses","NavigationMenu","forwardRef","ariaLabel","className","children","rest","ref","t","useTranslation","rootRef","useRef","composedRef","composeRefs","dir","useDirection","jsxs","RadixNavigationMenu","NavigationMenuViewport","listClasses","NavigationMenuList","jsx","NavigationMenuItem","triggerClasses","chevronClasses","NavigationMenuTrigger","ChevronDown","contentBase","contentVariants","cva","NavigationMenuContent","layout","linkClasses","NavigationMenuLink","asChild","Slot","indicatorClasses","NavigationMenuIndicator","viewportClasses"],"mappings":";;;;;;;;;AAsBA,MAAMA,IAAc;AAAA,EAClB;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAOJC,IAAiBC,EAGrB,CAAC,EAAE,cAAcC,GAAW,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAAQC,MAAQ;AACpE,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAA,GACRC,IAAUC,EAAoD,IAAI,GAClEC,IAAcC,EAAYN,GAAKG,CAAO,GACtCI,IAAMC,EAAaL,CAAO;AAChC,SACE,gBAAAM;AAAA,IAACC,EAAoB;AAAA,IAApB;AAAA,MACC,KAAKL;AAAA,MACL,KAAAE;AAAA,MACA,cAAYX,KAAaK,EAAE,yBAAyB;AAAA,MACpD,WAAW,CAACR,GAAaI,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,MAC5D,kBAAe;AAAA,MACd,GAAGE;AAAA,MAEH,UAAA;AAAA,QAAAD;AAAA,0BACAa,GAAA,CAAA,CAAuB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG9B,CAAC;AACDjB,EAAe,cAAc;AAM7B,MAAMkB,IAAc;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAEJC,IAAqBlB,EAGzB,CAAC,EAAE,WAAAE,GAAW,GAAGE,EAAA,GAAQC,MACzB,gBAAAc;AAAA,EAACJ,EAAoB;AAAA,EAApB;AAAA,IACC,KAAAV;AAAA,IACA,WAAW,CAACY,GAAaf,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,IAC3D,GAAGE;AAAA,EAAA;AACN,CACD;AACDc,EAAmB,cAAc;AAEjC,MAAME,IAAqBL,EAAoB,MAMzCM,IAAiB;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAEJC,IAAiB;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAEJC,IAAwBvB,EAG5B,CAAC,EAAE,WAAAE,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAAQC,MACnC,gBAAAS;AAAA,EAACC,EAAoB;AAAA,EAApB;AAAA,IACC,KAAAV;AAAA,IACA,WAAW,CAACgB,GAAgBnB,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,IAC9D,GAAGE;AAAA,IAEH,UAAA;AAAA,MAAAD;AAAA,MACD,gBAAAgB,EAACK,GAAA,EAAY,eAAY,QAAO,WAAWF,EAAA,CAAgB;AAAA,IAAA;AAAA,EAAA;AAC7D,CACD;AACDC,EAAsB,cAAc;AAMpC,MAAME,IAAc;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA;AAAA;AAAA,EAIA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAEJC,IAAkBC,EAAIF,GAAa;AAAA,EACvC,UAAU;AAAA,IACR,QAAQ;AAAA,MACN,QAAQ;AAAA,MACR,MAAM;AAAA,IAAA;AAAA,EACR;AAAA,EAEF,iBAAiB,EAAE,QAAQ,SAAA;AAC7B,CAAC,GAMKG,IAAwB5B,EAG5B,CAAC,EAAE,QAAA6B,GAAQ,WAAA3B,GAAW,GAAGE,EAAA,GAAQC,MACjC,gBAAAc;AAAA,EAACJ,EAAoB;AAAA,EAApB;AAAA,IACC,KAAAV;AAAA,IACA,WAAWqB,EAAgB,EAAE,QAAAG,GAAQ,WAAA3B,GAAW;AAAA,IAC/C,GAAGE;AAAA,EAAA;AACN,CACD;AACDwB,EAAsB,cAAc;AAMpC,MAAME,IAAc;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAQJC,IAAqB/B,EAGzB,CAAC,EAAE,SAAAgC,IAAU,IAAO,WAAA9B,GAAW,UAAAC,GAAU,GAAGC,KAAQC,MACpD,gBAAAc;AAAA,EAACJ,EAAoB;AAAA,EAApB;AAAA,IACC,KAAAV;AAAA,IACA,SAAA2B;AAAA,IACA,WAAWA,IAAU,SAAY,CAACF,GAAa5B,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,IACjF,GAAGE;AAAA,IAEH,UAAA4B,IACC,gBAAAb,EAACc,GAAA,EAAK,WAAW,CAACH,GAAa5B,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,GAC/D,UAAAC,GACH,IAEAA;AAAA,EAAA;AAEJ,CACD;AACD4B,EAAmB,cAAc;AAMjC,MAAMG,IAAmB;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAEJC,IAA0BnC,EAG9B,CAAC,EAAE,WAAAE,GAAW,GAAGE,EAAA,GAAQC,MACzB,gBAAAc;AAAA,EAACJ,EAAoB;AAAA,EAApB;AAAA,IACC,KAAAV;AAAA,IACA,WAAW,CAAC6B,GAAkBhC,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,IAChE,GAAGE;AAAA,IAEJ,UAAA,gBAAAe,EAAC,QAAA,EAAK,WAAU,6FAAA,CAA6F;AAAA,EAAA;AAC/G,CACD;AACDgB,EAAwB,cAAc;AAEtC,MAAMC,IAAkB;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAEJpB,IAAyBhB,EAG7B,CAAC,EAAE,WAAAE,GAAW,GAAGE,EAAA,GAAQC,MACzB,gBAAAc,EAAC,OAAA,EAAI,WAAU,gEACb,UAAA,gBAAAA;AAAA,EAACJ,EAAoB;AAAA,EAApB;AAAA,IACC,KAAAV;AAAA,IACA,WAAW,CAAC+B,GAAiBlC,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,IAC/D,GAAGE;AAAA,EAAA;AACN,GACF,CACD;AACDY,EAAuB,cAAc;"}

package/dist/_chunks/notification-tray-B7U5YZYg.js

@@ -1,328 +0,0 @@
-import { jsx as e, jsxs as d, Fragment as S } from "react/jsx-runtime";
-import { forwardRef as te, useState as I, useCallback as V, useLayoutEffect as ae, useEffect as R, useRef as B } from "react";
-import * as f from "@radix-ui/react-popover";
-import { c as y } from "./index-D2ZczOXr.js";
-import { useTranslation as E } from "react-i18next";
-import { I as se } from "./icon-button-Wnnde5lc.js";
-import { B as L } from "./button-7mLWcMp_.js";
-import { S as P } from "./separator-B4wXDLNC.js";
-import { S as u } from "./skeleton-dtqyF09N.js";
-import { N as ie } from "./notification-card-BF2_veHy.js";
-import { c as ne } from "./createLucideIcon-CrFbzy84.js";
-/**
- * @license lucide-react v1.8.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-const oe = [
-  ["path", { d: "M10.268 21a2 2 0 0 0 3.464 0", key: "vwvbt9" }],
-  [
-    "path",
-    {
-      d: "M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326",
-      key: "11g9vi"
-    }
-  ]
-], A = ne("bell", oe), re = y("ds:relative ds:inline-flex ds:items-center", {
-  variants: {
-    size: {
-      sm: "",
-      md: ""
-    }
-  },
-  defaultVariants: {
-    size: "md"
-  }
-}), de = y(
-  [
-    "ds:flex ds:flex-col",
-    "ds:bg-[var(--popover)] ds:text-[var(--popover-foreground)]",
-    // Border kept (transparent) so the forced-colors override below can
-    // repaint a visible edge in HCM. In normal modes the soft drop-shadow
-    // carries the edge cue.
-    "ds:border ds:border-transparent",
-    "ds:rounded-[var(--radius-md)]",
-    "ds:shadow-[var(--shadow-lg)]",
-    "ds:z-[var(--z-popover)]",
-    // Width: fluid below the design cap so narrow viewports keep a visible
-    // gutter on *both* sides of the panel (shadow included). The legacy
-    // `min-w` approach clamped at 20rem, which flush-mounted the panel
-    // against the inline-start viewport edge on phones.
-    "ds:w-[min(24rem,calc(100vw-2*var(--spacing-md)))]",
-    // Height: below the `sm` breakpoint the panel takes a near-full-screen
-    // sheet shape so the user gets room to triage messages / notifications
-    // without scrolling a tiny popover. `6rem` reserves space for the
-    // Header (≈4rem) plus the sideOffset + collisionPadding (≈2rem).
-    // Above `sm` it returns to `h-auto` so the list's own
-    // `--*-tray-max-block-size` cap governs the height.
-    "ds:h-[calc(100dvh-6rem)] ds:sm:h-auto",
-    "ds:data-[state=open]:animate-in ds:data-[state=closed]:animate-out",
-    "ds:data-[state=closed]:fade-out-0 ds:data-[state=open]:fade-in-0",
-    "ds:data-[state=closed]:zoom-out-95 ds:data-[state=open]:zoom-in-95",
-    "ds:motion-reduce:transition-none ds:motion-reduce:animate-none",
-    "ds:focus-visible:outline-none",
-    "ds:forced-colors:border-[CanvasText]"
-  ].join(" "),
-  {
-    variants: {
-      size: {
-        sm: "ds:p-[var(--spacing-xs)]",
-        md: "ds:p-[var(--spacing-sm)]"
-      }
-    },
-    defaultVariants: {
-      size: "md"
-    }
-  }
-), ce = y(
-  [
-    // Anchored to the top-end corner of the trigger, nudged outward so
-    // the bell icon isn't covered.
-    "ds:absolute ds:-top-[var(--spacing-xs)] ds:-end-[var(--spacing-xs)]",
-    "ds:inline-flex ds:items-center ds:justify-center",
-    // Circle at 1-2 digits; widens into a pill only for "99+".
-    "ds:min-w-[calc(var(--spacing-md)+var(--spacing-xs))] ds:h-[calc(var(--spacing-md)+var(--spacing-xs))] ds:ps-[calc(var(--spacing-xs)/1.5)] ds:pe-[calc(var(--spacing-xs)/1.5)]",
-    "ds:rounded-[var(--radius-full)]",
-    "ds:bg-[color:var(--destructive)] ds:text-[color:var(--destructive-foreground)]",
-    "ds:text-[length:var(--font-size-xs)] ds:font-semibold ds:leading-none",
-    "ds:pointer-events-none ds:select-none",
-    "ds:forced-colors:outline ds:forced-colors:outline-1 ds:forced-colors:outline-[CanvasText]"
-  ].join(" ")
-);
-function le(a, p) {
-  return a > 99 ? p : String(a);
-}
-function h() {
-  return /* @__PURE__ */ d(
-    "div",
-    {
-      "aria-hidden": "true",
-      className: "ds:flex ds:items-start ds:gap-[var(--spacing-sm)] ds:p-[var(--spacing-sm)]",
-      children: [
-        /* @__PURE__ */ e(u, { variant: "circular", size: "sm" }),
-        /* @__PURE__ */ d("div", { className: "ds:flex-1 ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]", children: [
-          /* @__PURE__ */ e(u, { variant: "text", size: "md", width: "70%" }),
-          /* @__PURE__ */ e(u, { variant: "text", size: "sm", width: "90%" }),
-          /* @__PURE__ */ e(u, { variant: "text", size: "sm", width: "30%" })
-        ] })
-      ]
-    }
-  );
-}
-function me() {
-  const { t: a } = E();
-  return /* @__PURE__ */ d(
-    "div",
-    {
-      role: "status",
-      "aria-live": "polite",
-      className: "ds:flex ds:flex-col ds:items-center ds:justify-center ds:gap-[var(--spacing-xs)] ds:p-[var(--spacing-lg)] ds:text-center",
-      children: [
-        /* @__PURE__ */ e(
-          "span",
-          {
-            "aria-hidden": "true",
-            className: "ds:inline-flex ds:items-center ds:justify-center ds:size-10 ds:rounded-[var(--radius-full)] ds:bg-[color:var(--muted)] ds:text-[color:var(--muted-foreground)] ds:[&>svg]:size-5",
-            children: /* @__PURE__ */ e(A, {})
-          }
-        ),
-        /* @__PURE__ */ e("p", { className: "type-title-item ds:text-[color:var(--foreground)]", children: a("ui.notificationTray.noNotifications", "No notifications") }),
-        /* @__PURE__ */ e("p", { className: "type-meta ds:text-[color:var(--muted-foreground)]", children: a(
-          "ui.notificationTray.noNotificationsDescription",
-          "You're all caught up."
-        ) })
-      ]
-    }
-  );
-}
-const fe = te(
-  ({
-    items: a,
-    unseenCount: p,
-    open: N,
-    onOpenChange: c,
-    onItemClick: D,
-    onDismiss: F,
-    onMarkAllRead: b,
-    loading: M = !1,
-    maxVisible: O,
-    viewAllLabel: w,
-    onViewAll: _,
-    align: W = "end",
-    side: Y = "bottom",
-    size: v = "md",
-    className: q,
-    ...G
-  }, H) => {
-    var k;
-    const { t: o } = E(), g = N !== void 0, [J, K] = I(!1), Q = g ? N : J, U = V(
-      (t) => {
-        g || K(t), c == null || c(t);
-      },
-      [g, c]
-    ), [l, T] = I(
-      () => a.map((t) => ({ item: t, leaving: !1 }))
-    ), z = V(() => {
-      if (typeof window > "u") return 200;
-      const t = window.getComputedStyle(document.documentElement).getPropertyValue("--animation-duration");
-      if (!t) return 200;
-      const i = t.trim(), s = parseFloat(i);
-      return Number.isFinite(s) ? i.endsWith("ms") ? s : s * 1e3 : 200;
-    }, []);
-    ae(() => {
-      T((t) => {
-        const i = new Set(a.map((n) => n.id)), s = new Set(t.map((n) => n.item.id)), r = t.map((n) => {
-          if (i.has(n.item.id)) {
-            const j = a.find((ee) => ee.id === n.item.id);
-            return j ? { item: j, leaving: !1 } : { ...n, leaving: !0 };
-          }
-          return { ...n, leaving: !0 };
-        });
-        for (const n of a)
-          s.has(n.id) || r.push({ item: n, leaving: !1 });
-        return r;
-      });
-    }, [a]), R(() => {
-      if (!l.some((s) => s.leaving)) return;
-      const t = z(), i = setTimeout(() => {
-        T((s) => s.filter((r) => !r.leaving));
-      }, t);
-      return () => clearTimeout(i);
-    }, [l, z]);
-    const x = B(null), C = B((k = a[0]) == null ? void 0 : k.id);
-    R(() => {
-      var s;
-      const t = (s = a[0]) == null ? void 0 : s.id, i = C.current;
-      if (i && t && i !== t && x.current) {
-        const r = a[0];
-        r && !r.read && (x.current.textContent = o(
-          "ui.notificationTray.newNotification",
-          {
-            title: r.title,
-            defaultValue: "New notification: {{title}}"
-          }
-        ));
-      }
-      C.current = t;
-    }, [a, o]);
-    const m = p ?? 0, X = m > 0 ? o("ui.notificationTray.triggerLabel", {
-      count: m,
-      defaultValue: "Notifications, {{count}} unread"
-    }) : o(
-      "ui.notificationTray.triggerLabelNone",
-      "Notifications, none unread"
-    ), Z = le(
-      m,
-      o("ui.notificationTray.badgeCountOverflow", "99+")
-    ), $ = de({ size: v });
-    return /* @__PURE__ */ e(
-      "div",
-      {
-        ref: H,
-        "data-component": "notification-tray",
-        className: [re({ size: v }), q].filter(Boolean).join(" "),
-        ...G,
-        children: /* @__PURE__ */ d(f.Root, { open: Q, onOpenChange: U, children: [
-          /* @__PURE__ */ e(f.Trigger, { asChild: !0, children: /* @__PURE__ */ e(
-            se,
-            {
-              icon: /* @__PURE__ */ e(A, {}),
-              intent: "outline",
-              size: v === "sm" ? "sm" : "md",
-              "aria-label": X,
-              "aria-haspopup": "dialog"
-            }
-          ) }),
-          m > 0 ? /* @__PURE__ */ e(
-            "span",
-            {
-              "aria-hidden": "true",
-              "data-testid": "notification-tray-badge",
-              className: ce(),
-              children: Z
-            }
-          ) : null,
-          /* @__PURE__ */ e(
-            "div",
-            {
-              ref: x,
-              "aria-live": "polite",
-              "aria-atomic": "true",
-              className: "ds:sr-only"
-            }
-          ),
-          /* @__PURE__ */ e(f.Portal, { children: /* @__PURE__ */ d(
-            f.Content,
-            {
-              role: "dialog",
-              "aria-label": o("ui.notificationTray.panelTitle", "Notifications"),
-              side: Y,
-              align: W,
-              sideOffset: 8,
-              collisionPadding: 16,
-              className: $,
-              children: [
-                /* @__PURE__ */ d("div", { className: "ds:flex ds:items-center ds:justify-between ds:gap-[var(--spacing-sm)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:pb-[var(--spacing-xs)]", children: [
-                  /* @__PURE__ */ e("h3", { className: "ds:m-0 type-title-card ds:text-[color:var(--foreground)]", children: o("ui.notificationTray.panelTitle", "Notifications") }),
-                  b && a.some((t) => !t.read) ? /* @__PURE__ */ e(
-                    L,
-                    {
-                      intent: "link",
-                      size: "sm",
-                      onClick: b,
-                      className: "ds:text-[length:var(--font-size-xs)]",
-                      children: o("ui.notificationTray.markAllRead", "Mark all as read")
-                    }
-                  ) : null
-                ] }),
-                /* @__PURE__ */ e(P, {}),
-                /* @__PURE__ */ e(
-                  "div",
-                  {
-                    role: "list",
-                    "data-max-visible": O,
-                    className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:overflow-y-auto ds:pt-[var(--spacing-xs)] ds:flex-1 ds:sm:flex-none ds:sm:[max-block-size:var(--notification-tray-max-block-size,24rem)]",
-                    children: M ? /* @__PURE__ */ d(S, { children: [
-                      /* @__PURE__ */ e(h, {}),
-                      /* @__PURE__ */ e(h, {}),
-                      /* @__PURE__ */ e(h, {})
-                    ] }) : l.length === 0 ? /* @__PURE__ */ e(me, {}) : l.map(({ item: t, leaving: i }) => /* @__PURE__ */ e(
-                      ie,
-                      {
-                        item: t,
-                        variant: "compact",
-                        leaving: i,
-                        onActivate: D,
-                        onDismiss: F
-                      },
-                      t.id
-                    ))
-                  }
-                ),
-                w ? /* @__PURE__ */ d(S, { children: [
-                  /* @__PURE__ */ e(P, {}),
-                  /* @__PURE__ */ e("div", { className: "ds:pt-[var(--spacing-xs)]", children: /* @__PURE__ */ e(
-                    L,
-                    {
-                      intent: "link",
-                      size: "sm",
-                      onClick: _,
-                      className: "ds:w-full ds:justify-center",
-                      children: w
-                    }
-                  ) })
-                ] }) : null
-              ]
-            }
-          ) })
-        ] })
-      }
-    );
-  }
-);
-fe.displayName = "NotificationTray";
-export {
-  fe as N
-};
-//# sourceMappingURL=notification-tray-B7U5YZYg.js.map

package/dist/_chunks/notification-tray-B7U5YZYg.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"notification-tray-B7U5YZYg.js","sources":["../../node_modules/lucide-react/dist/esm/icons/bell.js","../../src/components/notification-tray/notification-tray.tsx"],"sourcesContent":["/**\n * @license lucide-react v1.8.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.js';\n\nconst __iconNode = [\n  [\"path\", { d: \"M10.268 21a2 2 0 0 0 3.464 0\", key: \"vwvbt9\" }],\n  [\n    \"path\",\n    {\n      d: \"M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326\",\n      key: \"11g9vi\"\n    }\n  ]\n];\nconst Bell = createLucideIcon(\"bell\", __iconNode);\n\nexport { __iconNode, Bell as default };\n//# sourceMappingURL=bell.js.map\n","import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n  type HTMLAttributes,\n} from 'react';\nimport * as RadixPopover from '@radix-ui/react-popover';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { Bell } from 'lucide-react';\nimport { IconButton } from '../button/icon-button';\nimport { Button } from '../button/button';\nimport { Separator } from '../separator/separator';\nimport { Skeleton } from '../skeleton/skeleton';\nimport {\n  NotificationCard,\n  type NotificationItem,\n} from '../notification-card/notification-card';\n\n/* ------------------------------------------------------------------ */\n/* Types                                                               */\n/* ------------------------------------------------------------------ */\n\nexport interface NotificationTrayProps\n  extends Omit<\n      HTMLAttributes<HTMLDivElement>,\n      'onClick' | 'children' | 'role'\n    >,\n    VariantProps<typeof notificationTrayVariants> {\n  /** Notifications rendered in the dropdown panel. */\n  items: NotificationItem[];\n  /** Number of unseen notifications. Drives the badge count. */\n  unseenCount?: number;\n  /** Controlled open state. */\n  open?: boolean;\n  /** Fires when the open state changes. */\n  onOpenChange?: (open: boolean) => void;\n  /** Fires when the user activates an item (click or Enter/Space). */\n  onItemClick?: (item: NotificationItem) => void;\n  /** Fires when the user dismisses a notification. */\n  onDismiss?: (item: NotificationItem) => void;\n  /** Fires when the user clicks the header \"Mark all as read\" action. */\n  onMarkAllRead?: () => void;\n  /** When true the panel shows skeleton placeholders. */\n  loading?: boolean;\n  /** Advisory item count before the list scrolls. Consumers override the cap\n   *  via the `--notification-tray-max-block-size` custom property. */\n  maxVisible?: number;\n  /** When set renders a footer link that invokes `onViewAll`. */\n  viewAllLabel?: string;\n  /** Fires when the footer \"View all\" link is clicked. */\n  onViewAll?: () => void;\n  /** Panel alignment relative to the trigger. Default `'end'`. */\n  align?: 'start' | 'center' | 'end';\n  /** Side of the trigger to open on. Default `'bottom'`. */\n  side?: 'top' | 'bottom';\n}\n\n/* ------------------------------------------------------------------ */\n/* CVA                                                                 */\n/* ------------------------------------------------------------------ */\n\nconst notificationTrayVariants = cva('ds:relative ds:inline-flex ds:items-center', {\n  variants: {\n    size: {\n      sm: '',\n      md: '',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\nconst panelVariants = cva(\n  [\n    'ds:flex ds:flex-col',\n    'ds:bg-[var(--popover)] ds:text-[var(--popover-foreground)]',\n    // Border kept (transparent) so the forced-colors override below can\n    // repaint a visible edge in HCM. In normal modes the soft drop-shadow\n    // carries the edge cue.\n    'ds:border ds:border-transparent',\n    'ds:rounded-[var(--radius-md)]',\n    'ds:shadow-[var(--shadow-lg)]',\n    'ds:z-[var(--z-popover)]',\n    // Width: fluid below the design cap so narrow viewports keep a visible\n    // gutter on *both* sides of the panel (shadow included). The legacy\n    // `min-w` approach clamped at 20rem, which flush-mounted the panel\n    // against the inline-start viewport edge on phones.\n    'ds:w-[min(24rem,calc(100vw-2*var(--spacing-md)))]',\n    // Height: below the `sm` breakpoint the panel takes a near-full-screen\n    // sheet shape so the user gets room to triage messages / notifications\n    // without scrolling a tiny popover. `6rem` reserves space for the\n    // Header (≈4rem) plus the sideOffset + collisionPadding (≈2rem).\n    // Above `sm` it returns to `h-auto` so the list's own\n    // `--*-tray-max-block-size` cap governs the height.\n    'ds:h-[calc(100dvh-6rem)] ds:sm:h-auto',\n    'ds:data-[state=open]:animate-in ds:data-[state=closed]:animate-out',\n    'ds:data-[state=closed]:fade-out-0 ds:data-[state=open]:fade-in-0',\n    'ds:data-[state=closed]:zoom-out-95 ds:data-[state=open]:zoom-in-95',\n    'ds:motion-reduce:transition-none ds:motion-reduce:animate-none',\n    'ds:focus-visible:outline-none',\n    'ds:forced-colors:border-[CanvasText]',\n  ].join(' '),\n  {\n    variants: {\n      size: {\n        sm: 'ds:p-[var(--spacing-xs)]',\n        md: 'ds:p-[var(--spacing-sm)]',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  },\n);\n\nconst badgeVariants = cva(\n  [\n    // Anchored to the top-end corner of the trigger, nudged outward so\n    // the bell icon isn't covered.\n    'ds:absolute ds:-top-[var(--spacing-xs)] ds:-end-[var(--spacing-xs)]',\n    'ds:inline-flex ds:items-center ds:justify-center',\n    // Circle at 1-2 digits; widens into a pill only for \"99+\".\n    'ds:min-w-[calc(var(--spacing-md)+var(--spacing-xs))] ds:h-[calc(var(--spacing-md)+var(--spacing-xs))] ds:ps-[calc(var(--spacing-xs)/1.5)] ds:pe-[calc(var(--spacing-xs)/1.5)]',\n    'ds:rounded-[var(--radius-full)]',\n    'ds:bg-[color:var(--destructive)] ds:text-[color:var(--destructive-foreground)]',\n    'ds:text-[length:var(--font-size-xs)] ds:font-semibold ds:leading-none',\n    'ds:pointer-events-none ds:select-none',\n    'ds:forced-colors:outline ds:forced-colors:outline-1 ds:forced-colors:outline-[CanvasText]',\n  ].join(' '),\n);\n\n/* ------------------------------------------------------------------ */\n/* Helpers                                                             */\n/* ------------------------------------------------------------------ */\n\nfunction formatBadgeCount(count: number, overflowLabel: string): string {\n  return count > 99 ? overflowLabel : String(count);\n}\n\nfunction SkeletonRow() {\n  return (\n    <div\n      aria-hidden=\"true\"\n      className=\"ds:flex ds:items-start ds:gap-[var(--spacing-sm)] ds:p-[var(--spacing-sm)]\"\n    >\n      <Skeleton variant=\"circular\" size=\"sm\" />\n      <div className=\"ds:flex-1 ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]\">\n        <Skeleton variant=\"text\" size=\"md\" width=\"70%\" />\n        <Skeleton variant=\"text\" size=\"sm\" width=\"90%\" />\n        <Skeleton variant=\"text\" size=\"sm\" width=\"30%\" />\n      </div>\n    </div>\n  );\n}\n\nfunction EmptyPanel() {\n  const { t } = useTranslation();\n  return (\n    <div\n      role=\"status\"\n      aria-live=\"polite\"\n      className=\"ds:flex ds:flex-col ds:items-center ds:justify-center ds:gap-[var(--spacing-xs)] ds:p-[var(--spacing-lg)] ds:text-center\"\n    >\n      <span\n        aria-hidden=\"true\"\n        className=\"ds:inline-flex ds:items-center ds:justify-center ds:size-10 ds:rounded-[var(--radius-full)] ds:bg-[color:var(--muted)] ds:text-[color:var(--muted-foreground)] ds:[&>svg]:size-5\"\n      >\n        <Bell />\n      </span>\n      <p className=\"type-title-item ds:text-[color:var(--foreground)]\">\n        {t('ui.notificationTray.noNotifications', 'No notifications')}\n      </p>\n      <p className=\"type-meta ds:text-[color:var(--muted-foreground)]\">\n        {t(\n          'ui.notificationTray.noNotificationsDescription',\n          \"You're all caught up.\",\n        )}\n      </p>\n    </div>\n  );\n}\n\n/* ------------------------------------------------------------------ */\n/* Root                                                                */\n/* ------------------------------------------------------------------ */\n\nexport const NotificationTray = forwardRef<HTMLDivElement, NotificationTrayProps>(\n  (\n    {\n      items,\n      unseenCount,\n      open,\n      onOpenChange,\n      onItemClick,\n      onDismiss,\n      onMarkAllRead,\n      loading = false,\n      maxVisible,\n      viewAllLabel,\n      onViewAll,\n      align = 'end',\n      side = 'bottom',\n      size = 'md',\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { t } = useTranslation();\n\n    const isControlled = open !== undefined;\n    const [internalOpen, setInternalOpen] = useState(false);\n    const isOpen = isControlled ? open : internalOpen;\n\n    const handleOpenChange = useCallback(\n      (next: boolean) => {\n        if (!isControlled) setInternalOpen(next);\n        onOpenChange?.(next);\n      },\n      [isControlled, onOpenChange],\n    );\n\n    /* Exit-animation list (AnimatePresence-style).\n     * `displayed` holds an entry per card that's currently mounted, even\n     * briefly after the consumer removes an item from `items`. When the\n     * consumer drops an id from `items`, we flip that entry to\n     * `leaving: true` for one animation cycle, then prune it. */\n    type Displayed = { item: NotificationItem; leaving: boolean };\n    const [displayed, setDisplayed] = useState<Displayed[]>(() =>\n      items.map((item) => ({ item, leaving: false })),\n    );\n\n    const animationDurationMs = useCallback((): number => {\n      if (typeof window === 'undefined') return 200;\n      const raw = window\n        .getComputedStyle(document.documentElement)\n        .getPropertyValue('--animation-duration');\n      if (!raw) return 200;\n      const trimmed = raw.trim();\n      const n = parseFloat(trimmed);\n      if (!Number.isFinite(n)) return 200;\n      return trimmed.endsWith('ms') ? n : n * 1000;\n    }, []);\n\n    // `useLayoutEffect` so the `leaving=true` flip applies in the same paint\n    // as the consumer's `items` update. With `useEffect` the browser paints\n    // once with the dismissed card still at `leaving=false` (no animation)\n    // before the flag flips — a visible lag before the exit animation starts.\n    useLayoutEffect(() => {\n      setDisplayed((prev) => {\n        const nextIds = new Set(items.map((i) => i.id));\n        const prevIds = new Set(prev.map((d) => d.item.id));\n\n        const merged: Displayed[] = prev.map((d) => {\n          if (nextIds.has(d.item.id)) {\n            const fresh = items.find((i) => i.id === d.item.id);\n            return fresh\n              ? { item: fresh, leaving: false }\n              : { ...d, leaving: true };\n          }\n          return { ...d, leaving: true };\n        });\n\n        for (const i of items) {\n          if (!prevIds.has(i.id)) merged.push({ item: i, leaving: false });\n        }\n        return merged;\n      });\n    }, [items]);\n\n    useEffect(() => {\n      if (!displayed.some((d) => d.leaving)) return;\n      const ms = animationDurationMs();\n      const timer = setTimeout(() => {\n        setDisplayed((prev) => prev.filter((d) => !d.leaving));\n      }, ms);\n      return () => clearTimeout(timer);\n    }, [displayed, animationDurationMs]);\n\n    /* Polite live region — announces when a new unread notification\n       floats to the top of the list, even with the panel closed. */\n    const liveRegionRef = useRef<HTMLDivElement | null>(null);\n    const lastTopIdRef = useRef<string | undefined>(items[0]?.id);\n\n    useEffect(() => {\n      const topId = items[0]?.id;\n      const prev = lastTopIdRef.current;\n      if (prev && topId && prev !== topId && liveRegionRef.current) {\n        const newest = items[0];\n        if (newest && !newest.read) {\n          liveRegionRef.current.textContent = t(\n            'ui.notificationTray.newNotification',\n            {\n              title: newest.title,\n              defaultValue: 'New notification: {{title}}',\n            },\n          );\n        }\n      }\n      lastTopIdRef.current = topId;\n    }, [items, t]);\n\n    const displayCount = unseenCount ?? 0;\n    const triggerAriaLabel =\n      displayCount > 0\n        ? t('ui.notificationTray.triggerLabel', {\n            count: displayCount,\n            defaultValue: 'Notifications, {{count}} unread',\n          })\n        : t(\n            'ui.notificationTray.triggerLabelNone',\n            'Notifications, none unread',\n          );\n\n    const badgeLabel = formatBadgeCount(\n      displayCount,\n      t('ui.notificationTray.badgeCountOverflow', '99+'),\n    );\n\n    const panelClass = panelVariants({ size });\n\n    return (\n      <div\n        ref={ref}\n        data-component=\"notification-tray\"\n        className={[notificationTrayVariants({ size }), className]\n          .filter(Boolean)\n          .join(' ')}\n        {...rest}\n      >\n        <RadixPopover.Root open={isOpen} onOpenChange={handleOpenChange}>\n          <RadixPopover.Trigger asChild>\n            <IconButton\n              icon={<Bell />}\n              intent=\"outline\"\n              size={size === 'sm' ? 'sm' : 'md'}\n              aria-label={triggerAriaLabel}\n              aria-haspopup=\"dialog\"\n            />\n          </RadixPopover.Trigger>\n          {displayCount > 0 ? (\n            <span\n              aria-hidden=\"true\"\n              data-testid=\"notification-tray-badge\"\n              className={badgeVariants()}\n            >\n              {badgeLabel}\n            </span>\n          ) : null}\n          {/* Live region sits outside the popover so it announces even\n              while the panel is closed. */}\n          <div\n            ref={liveRegionRef}\n            aria-live=\"polite\"\n            aria-atomic=\"true\"\n            className=\"ds:sr-only\"\n          />\n          <RadixPopover.Portal>\n            <RadixPopover.Content\n              role=\"dialog\"\n              aria-label={t('ui.notificationTray.panelTitle', 'Notifications')}\n              side={side}\n              align={align}\n              sideOffset={8}\n              // `spacing-md` (16px) keeps Radix's collision-avoidance from\n              // flush-mounting the panel against the viewport edge when the\n              // trigger is near the inline-end of a narrow screen.\n              collisionPadding={16}\n              className={panelClass}\n            >\n              <div className=\"ds:flex ds:items-center ds:justify-between ds:gap-[var(--spacing-sm)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:pb-[var(--spacing-xs)]\">\n                <h3 className=\"ds:m-0 type-title-card ds:text-[color:var(--foreground)]\">\n                  {t('ui.notificationTray.panelTitle', 'Notifications')}\n                </h3>\n                {onMarkAllRead && items.some((item) => !item.read) ? (\n                  <Button\n                    intent=\"link\"\n                    size=\"sm\"\n                    onClick={onMarkAllRead}\n                    className=\"ds:text-[length:var(--font-size-xs)]\"\n                  >\n                    {t('ui.notificationTray.markAllRead', 'Mark all as read')}\n                  </Button>\n                ) : null}\n              </div>\n              <Separator />\n              {/* Cap at ~24rem so ~5 items fit before the list scrolls.\n                  Consumers override via the --notification-tray-max-block-size\n                  custom property on the root element. */}\n              <div\n                role=\"list\"\n                data-max-visible={maxVisible}\n                // Below `sm` the panel is a near-full-screen sheet (see\n                // `panelVariants`) and the list expands to fill the\n                // remaining space with `flex-1`. Above `sm` the list\n                // caps at the `--notification-tray-max-block-size` custom\n                // property so the popover stays compact.\n                className=\"ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:overflow-y-auto ds:pt-[var(--spacing-xs)] ds:flex-1 ds:sm:flex-none ds:sm:[max-block-size:var(--notification-tray-max-block-size,24rem)]\"\n              >\n                {loading ? (\n                  <>\n                    <SkeletonRow />\n                    <SkeletonRow />\n                    <SkeletonRow />\n                  </>\n                ) : displayed.length === 0 ? (\n                  <EmptyPanel />\n                ) : (\n                  displayed.map(({ item, leaving }) => (\n                    <NotificationCard\n                      key={item.id}\n                      item={item}\n                      variant=\"compact\"\n                      leaving={leaving}\n                      onActivate={onItemClick}\n                      onDismiss={onDismiss}\n                    />\n                  ))\n                )}\n              </div>\n              {viewAllLabel ? (\n                <>\n                  <Separator />\n                  <div className=\"ds:pt-[var(--spacing-xs)]\">\n                    <Button\n                      intent=\"link\"\n                      size=\"sm\"\n                      onClick={onViewAll}\n                      className=\"ds:w-full ds:justify-center\"\n                    >\n                      {viewAllLabel}\n                    </Button>\n                  </div>\n                </>\n              ) : null}\n            </RadixPopover.Content>\n          </RadixPopover.Portal>\n        </RadixPopover.Root>\n      </div>\n    );\n  },\n);\n\nNotificationTray.displayName = 'NotificationTray';\n"],"names":["__iconNode","Bell","createLucideIcon","notificationTrayVariants","cva","panelVariants","badgeVariants","formatBadgeCount","count","overflowLabel","SkeletonRow","jsxs","jsx","Skeleton","EmptyPanel","t","useTranslation","NotificationTray","forwardRef","items","unseenCount","open","onOpenChange","onItemClick","onDismiss","onMarkAllRead","loading","maxVisible","viewAllLabel","onViewAll","align","side","size","className","rest","ref","isControlled","internalOpen","setInternalOpen","useState","isOpen","handleOpenChange","useCallback","next","displayed","setDisplayed","item","animationDurationMs","raw","trimmed","n","useLayoutEffect","prev","nextIds","i","prevIds","d","merged","fresh","useEffect","ms","timer","liveRegionRef","useRef","lastTopIdRef","_a","topId","newest","displayCount","triggerAriaLabel","badgeLabel","panelClass","RadixPopover","IconButton","Button","Separator","Fragment","leaving","NotificationCard"],"mappings":"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","x_google_ignoreList":[0]}