npm - @alfadocs/ui-kit - Versions diffs - 0.1.4 → 0.1.5 - Mend

@alfadocs/ui-kit 0.1.4 → 0.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (273) hide show

package/dist/_chunks/{notification-card-DgW-vVg-.js → notification-card-BF2_veHy.js} RENAMED Viewed

@@ -2,8 +2,8 @@ import { jsx as a, jsxs as n } from "react/jsx-runtime";
 import { forwardRef as M, useMemo as P, useState as R, useRef as B, useCallback as L } from "react";
 import { c as U } from "./index-D2ZczOXr.js";
 import { useTranslation as W } from "react-i18next";
-import { I as E } from "./icon-button-CNjWCD1X.js";
-import { B as N } from "./button-7dTew-IV.js";
+import { I as E } from "./icon-button-Wnnde5lc.js";
+import { B as N } from "./button-7mLWcMp_.js";
 import { T as H } from "./timestamp-BV2lC-wV.js";
 import { X } from "./x-CCcI3eJp.js";
 const q = U(
@@ -64,14 +64,14 @@ const q = U(
     }
   }
 ), C = [
-  "focus-visible:outline-none",
-  "after:content-[''] after:absolute after:inset-0 after:rounded-[var(--radius-sm)]",
-  "after:pointer-events-auto",
-  "focus-visible:after:outline-[length:var(--focus-ring-width)]",
-  "focus-visible:after:outline-solid",
-  "focus-visible:after:outline-[color:var(--ring)]",
-  "focus-visible:after:outline-offset-[length:var(--focus-ring-offset)]",
-  "forced-colors:focus-visible:after:outline-[CanvasText]"
+  "ds:focus-visible:outline-none",
+  "ds:after:content-[''] ds:after:absolute ds:after:inset-0 ds:after:rounded-[var(--radius-sm)]",
+  "ds:after:pointer-events-auto",
+  "ds:focus-visible:after:outline-[length:var(--focus-ring-width)]",
+  "ds:focus-visible:after:outline-solid",
+  "ds:focus-visible:after:outline-[color:var(--ring)]",
+  "ds:focus-visible:after:outline-offset-[length:var(--focus-ring-offset)]",
+  "ds:forced-colors:focus-visible:after:outline-[CanvasText]"
 ].join(" ");
 function G(e) {
   return /^(https?:\/\/(?!\/)|\/(?!\/)|#)/.test(e);
@@ -253,4 +253,4 @@ export {
   J as N,
   G as i
 };
-//# sourceMappingURL=notification-card-DgW-vVg-.js.map
+//# sourceMappingURL=notification-card-BF2_veHy.js.map

package/dist/_chunks/notification-card-BF2_veHy.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"notification-card-BF2_veHy.js","sources":["../../src/components/notification-card/notification-card.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useMemo,\n useRef,\n useState,\n type HTMLAttributes,\n type ReactNode,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { X } from 'lucide-react';\nimport { IconButton } from '../button/icon-button';\nimport { Button } from '../button/button';\nimport { Timestamp } from '../timestamp';\n\n/* ------------------------------------------------------------------ */\n/* Types */\n/* ------------------------------------------------------------------ */\n\nexport interface NotificationItem {\n /** Unique identifier for the notification. */\n id: string;\n /** Notification title — rendered on the first line. */\n title: string;\n /** Notification body — rendered as plain text. */\n description?: string;\n /** Optional leading glyph — a React node (usually a Lucide icon). */\n icon?: ReactNode;\n /** Optional action URL — when present the card title is an anchor. */\n url?: string;\n /** ISO-8601 timestamp of when the notification was created. */\n createdAt: string;\n /** Whether the notification has been seen. Unread items get accent styling. */\n read?: boolean;\n}\n\nexport interface NotificationCardProps\n extends Omit<HTMLAttributes<HTMLDivElement>, 'onClick' | 'role' | 'title'>,\n VariantProps<typeof cardVariants> {\n /** The notification to render. */\n item: NotificationItem;\n /**\n * Layout shape.\n * - `compact` — single-line row with the whole card clickable (used by\n * NotificationTray).\n * - `dashboard` — alert-style block with explicit CTA and mark-as-read\n * controls (used by dashboards / sidebars).\n */\n variant?: 'compact' | 'dashboard';\n /** Visual density. */\n size?: 'sm' | 'md';\n /** Fires when the card title / body is activated. */\n onActivate?: (item: NotificationItem) => void;\n /** Fires when the dismiss control is activated. */\n onDismiss?: (item: NotificationItem) => void;\n /**\n * Label for the dashboard-variant CTA. Only rendered when `variant` is\n * `'dashboard'` and the item has a `url`.\n */\n ctaLabel?: string;\n /**\n * Label for the dashboard-variant mark-as-read link. Only rendered when\n * `variant` is `'dashboard'` and `onDismiss` is supplied.\n */\n dismissLabel?: string;\n /**\n * External exit-animation control. When supplied the card plays its\n * fade-out when this turns `true` and the consumer owns the subsequent\n * unmount (see NotificationTray). If omitted, the card self-manages the\n * exit on internal dismiss.\n */\n leaving?: boolean;\n}\n\n/* ------------------------------------------------------------------ */\n/* CVA */\n/* ------------------------------------------------------------------ */\n\nconst cardVariants = cva(\n [\n 'ds:relative ds:flex ds:gap-[var(--spacing-sm)]',\n 'ds:rounded-[var(--radius-sm)]',\n 'ds:transition-colors',\n // Mount: fade + slide-down so a fresh notification reads as arriving.\n // `data-leaving=true` plays the matching exit, driven by the owning\n // tray's AnimatePresence loop.\n 'ds:motion-safe:animate-in ds:motion-safe:fade-in-0 ds:motion-safe:slide-in-from-top-2 ds:motion-safe:duration-[var(--animation-duration)]',\n 'ds:data-[leaving=true]:motion-safe:animate-out ds:data-[leaving=true]:motion-safe:fade-out-0 ds:data-[leaving=true]:motion-safe:slide-out-to-top-2',\n // Pin the exit's end-state until React unmounts. Without `fill-mode-forwards`\n // tw-animate-css leaves the element at opacity:1 for one paint frame after\n // the animation ends — the \"flicker before it animates away\" bug.\n 'ds:data-[leaving=true]:motion-safe:fill-mode-forwards',\n 'ds:data-[leaving=true]:pointer-events-none',\n 'ds:motion-reduce:transition-none',\n 'ds:text-start',\n 'ds:forced-colors:border ds:forced-colors:border-[CanvasText]',\n ].join(' '),\n {\n variants: {\n variant: {\n compact: 'ds:items-start',\n dashboard:\n 'ds:flex-col ds:sm:flex-row ds:items-stretch ds:sm:items-start ds:shadow-[var(--shadow-md)] ds:bg-[color:var(--card)]',\n },\n size: {\n sm: 'ds:p-[var(--spacing-sm)]',\n md: 'ds:p-[var(--spacing-md)]',\n },\n state: {\n unread: '',\n read: 'ds:bg-transparent',\n },\n },\n compoundVariants: [\n {\n variant: 'compact',\n state: 'unread',\n class: 'ds:bg-[color:var(--accent)]/5',\n },\n {\n variant: 'compact',\n state: 'read',\n class: 'ds:hover:bg-[color:var(--muted)]/40',\n },\n {\n variant: 'dashboard',\n state: 'unread',\n class: 'ds:bg-[color:var(--accent)]/5',\n },\n ],\n defaultVariants: {\n variant: 'compact',\n size: 'sm',\n state: 'read',\n },\n },\n);\n\nconst stretchedLinkClass = [\n 'ds:focus-visible:outline-none',\n 'ds:after:content-[\\'\\'] ds:after:absolute ds:after:inset-0 ds:after:rounded-[var(--radius-sm)]',\n 'ds:after:pointer-events-auto',\n 'ds:focus-visible:after:outline-[length:var(--focus-ring-width)]',\n 'ds:focus-visible:after:outline-solid',\n 'ds:focus-visible:after:outline-[color:var(--ring)]',\n 'ds:focus-visible:after:outline-offset-[length:var(--focus-ring-offset)]',\n 'ds:forced-colors:focus-visible:after:outline-[CanvasText]',\n].join(' ');\n\n/* ------------------------------------------------------------------ */\n/* Helpers */\n/* ------------------------------------------------------------------ */\n\nexport function isSafeNotificationUrl(url: string): boolean {\n // Reject protocol-relative (//host), javascript:, data:, mailto: etc.\n // Only http(s), same-origin absolute paths (/), and hash (#) anchors pass.\n return /^(https?:\\/\\/(?!\\/)|\\/(?!\\/)|#)/.test(url);\n}\n\n/* ------------------------------------------------------------------ */\n/* Component */\n/* ------------------------------------------------------------------ */\n\nexport const NotificationCard = forwardRef<HTMLDivElement, NotificationCardProps>(\n (\n {\n item,\n variant = 'compact',\n size = 'sm',\n onActivate,\n onDismiss,\n ctaLabel,\n dismissLabel,\n leaving,\n className,\n ...rest\n },\n ref,\n ) => {\n const { t, i18n } = useTranslation();\n // Screen-reader time context — absolute & unambiguous rather than the\n // visible relative phrase, which drifts and reads less clearly aloud.\n const accessibleTime = useMemo(() => {\n const date = new Date(item.createdAt);\n if (Number.isNaN(date.getTime())) return '';\n return new Intl.DateTimeFormat(i18n.language, {\n dateStyle: 'medium',\n timeStyle: 'short',\n }).format(date);\n }, [item.createdAt, i18n.language]);\n\n /* Exit animation.\n * - When `leaving` is undefined (uncontrolled): the card owns the\n * fade-out — dismiss click flips `isLeaving`, waits for\n * --animation-duration, then fires onDismiss.\n * - When `leaving` is boolean (controlled, e.g. NotificationTray): the\n * parent owns the lifecycle — dismiss click fires onDismiss\n * immediately and the parent schedules unmount after the animation. */\n const isControlledLeaving = leaving !== undefined;\n const [isLeaving, setIsLeaving] = useState(false);\n const dismissTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const effectiveLeaving = isControlledLeaving ? leaving : isLeaving;\n\n const prefersReducedMotion =\n typeof window !== 'undefined' &&\n typeof window.matchMedia === 'function' &&\n window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n\n const handleDismiss = useCallback(() => {\n if (!onDismiss) return;\n if (isControlledLeaving || prefersReducedMotion) {\n onDismiss(item);\n return;\n }\n setIsLeaving(true);\n if (dismissTimerRef.current) clearTimeout(dismissTimerRef.current);\n const raw =\n (typeof window !== 'undefined' &&\n window\n .getComputedStyle(document.documentElement)\n .getPropertyValue('--animation-duration')) ||\n '200ms';\n const ms = raw.trim().endsWith('ms')\n ? parseFloat(raw)\n : parseFloat(raw) * 1000;\n dismissTimerRef.current = setTimeout(\n () => onDismiss(item),\n Number.isFinite(ms) ? ms : 200,\n );\n }, [onDismiss, item, isControlledLeaving, prefersReducedMotion]);\n\n const state = item.read ? 'read' : 'unread';\n\n const unreadSuffix = item.read\n ? ''\n : t('ui.notificationCard.unreadSuffix', ', unread');\n const ariaLabel = t('ui.notificationCard.itemLabel', {\n title: item.title,\n time: accessibleTime,\n unreadSuffix,\n defaultValue: '{{title}}, {{time}}{{unreadSuffix}}',\n });\n\n const hasSafeUrl = !!item.url && isSafeNotificationUrl(item.url);\n\n /* ------- Title rendering (stretched link in compact mode) ------- */\n\n const titleText = (\n <span\n className={[\n 'ds:flex-1 ds:min-w-0 ds:truncate',\n item.read ? 'ds:font-normal' : 'ds:font-semibold',\n ].join(' ')}\n >\n {item.title}\n </span>\n );\n\n let titleNode: ReactNode;\n if (variant === 'compact' && hasSafeUrl && onActivate) {\n titleNode = (\n <a\n href={item.url}\n aria-label={ariaLabel}\n className={stretchedLinkClass + ' ds:contents'}\n onClick={(event) => {\n if (\n event.defaultPrevented ||\n event.metaKey ||\n event.ctrlKey ||\n event.shiftKey\n )\n return;\n onActivate(item);\n }}\n >\n {titleText}\n </a>\n );\n } else if (variant === 'compact' && onActivate) {\n titleNode = (\n <button\n type=\"button\"\n aria-label={ariaLabel}\n className={stretchedLinkClass + ' ds:contents ds:bg-transparent ds:border-0 ds:p-0'}\n onClick={() => onActivate(item)}\n >\n {titleText}\n </button>\n );\n } else if (variant === 'dashboard' && hasSafeUrl && onActivate) {\n titleNode = (\n <a\n href={item.url}\n className=\"ds:text-[color:var(--foreground)] ds:no-underline ds:hover:underline ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]\"\n onClick={(event) => {\n if (\n event.defaultPrevented ||\n event.metaKey ||\n event.ctrlKey ||\n event.shiftKey\n )\n return;\n onActivate(item);\n }}\n >\n {titleText}\n </a>\n );\n } else {\n titleNode = titleText;\n }\n\n return (\n <div\n ref={ref}\n role=\"listitem\"\n data-component=\"notification-card\"\n data-read={item.read ? 'true' : 'false'}\n data-leaving={effectiveLeaving ? 'true' : undefined}\n aria-hidden={effectiveLeaving || undefined}\n className={cardVariants({ variant, size, state, className })}\n {...rest}\n >\n {item.icon ? (\n <span\n aria-hidden=\"true\"\n className=\"ds:inline-flex ds:shrink-0 ds:items-center ds:justify-center ds:size-8 ds:rounded-[var(--radius-full)] ds:bg-[color:var(--accent)]/10 ds:text-[color:var(--accent)] ds:[&>svg]:size-4\"\n >\n {item.icon}\n </span>\n ) : null}\n\n <div className=\"ds:flex-1 ds:min-w-0 ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]\">\n <div className=\"ds:flex ds:items-center ds:gap-[var(--spacing-xs)]\">\n {!item.read ? (\n <span\n aria-hidden=\"true\"\n className=\"ds:inline-block ds:size-1.5 ds:shrink-0 ds:rounded-[var(--radius-full)] ds:bg-[color:var(--primary)] ds:forced-colors:bg-[Highlight]\"\n />\n ) : null}\n {variant === 'dashboard' ? (\n // `h3` keeps the dashboard heading ladder continuous:\n // h1 (page) → h2 (WarningStack + NotificationsPanel) → h3 (notification title).\n <h3 className=\"ds:m-0 ds:flex-1 ds:min-w-0 type-title-item\">\n {titleNode}\n </h3>\n ) : (\n <span className=\"ds:flex-1 ds:min-w-0 type-title-item ds:text-[color:var(--foreground)]\">\n {titleNode}\n </span>\n )}\n </div>\n\n {item.description ? (\n <p className=\"ds:m-0 type-body-sm ds:text-[color:var(--muted-foreground)] ds:[overflow:hidden] ds:[display:-webkit-box] ds:[-webkit-box-orient:vertical] ds:[-webkit-line-clamp:2] ds:break-words\">\n {item.description}\n </p>\n ) : null}\n\n <Timestamp\n value={item.createdAt}\n shape=\"chip\"\n size=\"sm\"\n relativeWindow={12 * 60 * 60 * 1000}\n />\n\n {variant === 'dashboard' && (ctaLabel || dismissLabel) ? (\n <div className=\"ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-sm)]\">\n {ctaLabel && hasSafeUrl ? (\n <Button\n intent=\"outline\"\n size=\"sm\"\n asChild\n className=\"ds:relative ds:z-[1]\"\n >\n <a\n href={item.url}\n onClick={(event) => {\n if (\n event.defaultPrevented ||\n event.metaKey ||\n event.ctrlKey ||\n event.shiftKey\n )\n return;\n onActivate?.(item);\n }}\n >\n {ctaLabel}\n </a>\n </Button>\n ) : null}\n {dismissLabel && onDismiss ? (\n <Button\n intent=\"link\"\n size=\"sm\"\n onClick={handleDismiss}\n className=\"ds:relative ds:z-[1]\"\n >\n {dismissLabel}\n </Button>\n ) : null}\n </div>\n ) : null}\n </div>\n\n {variant === 'compact' && onDismiss ? (\n <span className=\"ds:relative ds:z-[1] ds:opacity-0 ds:group-hover:opacity-100 ds:group-focus-within:opacity-100 ds:transition-opacity ds:motion-reduce:transition-none\">\n <IconButton\n icon={<X />}\n intent=\"ghost\"\n size=\"sm\"\n aria-label={t(\n 'ui.notificationCard.dismiss',\n 'Dismiss notification',\n )}\n onClick={handleDismiss}\n />\n </span>\n ) : null}\n </div>\n );\n },\n);\n\nNotificationCard.displayName = 'NotificationCard';\n"],"names":["cardVariants","cva","stretchedLinkClass","isSafeNotificationUrl","url","NotificationCard","forwardRef","item","variant","size","onActivate","onDismiss","ctaLabel","dismissLabel","leaving","className","rest","ref","t","i18n","useTranslation","accessibleTime","useMemo","date","isControlledLeaving","isLeaving","setIsLeaving","useState","dismissTimerRef","useRef","effectiveLeaving","prefersReducedMotion","handleDismiss","useCallback","raw","ms","state","unreadSuffix","ariaLabel","hasSafeUrl","titleText","jsx","titleNode","event","jsxs","Timestamp","Button","IconButton"],"mappings":"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"}

package/dist/_chunks/{notification-tray-CKUgl2jc.js → notification-tray-Bq-08ReD.js} RENAMED Viewed

@@ -3,11 +3,11 @@ import { forwardRef as te, useState as I, useCallback as V, useLayoutEffect as a
 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-CNjWCD1X.js";
-import { B as L } from "./button-7dTew-IV.js";
+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-DAdPFx9d.js";
-import { N as ie } from "./notification-card-DgW-vVg-.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
@@ -322,4 +322,4 @@ fe.displayName = "NotificationTray";
 export {
   fe as N
 };
-//# sourceMappingURL=notification-tray-CKUgl2jc.js.map
+//# sourceMappingURL=notification-tray-Bq-08ReD.js.map

package/dist/_chunks/{notification-tray-CKUgl2jc.js.map → notification-tray-Bq-08ReD.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"notification-tray-CKUgl2jc.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 'ds:border ds:border-[color:var(--border)]',\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-2var(--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]}
1	+ {"version":3,"file":"notification-tray-Bq-08ReD.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 'ds:border ds:border-[color:var(--border)]',\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-2var(--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]}

package/dist/_chunks/{number-input-BPPhekLu.js → number-input-DjpT_RXJ.js} RENAMED Viewed

@@ -5,29 +5,29 @@ import { useTranslation as ve } from "react-i18next";
 import { u as ge } from "./form-field-context-94LwgYTQ.js";
 import { C as Ne } from "./chevron-down-BX_NP2Yh.js";
 import { C as he } from "./chevron-up-zOEDrmBB.js";
-function we(s) {
+function we(i) {
   let r = "";
-  for (const a of s) {
+  for (const a of i) {
     const t = a.codePointAt(0);
     t !== void 0 && (t >= 1632 && t <= 1641 ? r += String.fromCodePoint(48 + (t - 1632)) : t >= 1776 && t <= 1785 ? r += String.fromCodePoint(48 + (t - 1776)) : r += a);
   }
   return r;
 }
-function ye(s, r, a) {
+function ye(i, r, a) {
   return ce(() => {
     var S, C;
-    const t = new Intl.NumberFormat(s).formatToParts(1234.5), u = ((S = t.find((d) => d.type === "decimal")) == null ? void 0 : S.value) ?? ".", F = ((C = t.find((d) => d.type === "group")) == null ? void 0 : C.value) ?? ",", c = r === "currency" ? new Intl.NumberFormat(s, {
+    const t = new Intl.NumberFormat(i).formatToParts(1234.5), d = ((S = t.find((u) => u.type === "decimal")) == null ? void 0 : S.value) ?? ".", F = ((C = t.find((u) => u.type === "group")) == null ? void 0 : C.value) ?? ",", c = r === "currency" ? new Intl.NumberFormat(i, {
       style: "currency",
       currency: a ?? "USD"
-    }) : r === "percentage" ? new Intl.NumberFormat(s, {
+    }) : r === "percentage" ? new Intl.NumberFormat(i, {
       style: "percent",
       maximumFractionDigits: 4
-    }) : r === "integer" ? new Intl.NumberFormat(s, { maximumFractionDigits: 0 }) : new Intl.NumberFormat(s, { maximumFractionDigits: 10 }), T = (d) => Number.isFinite(d) ? c.format(d) : "", P = (d) => {
-      if (!d) return NaN;
-      const M = we(d), v = M.trim(), w = v.startsWith("-") || v.startsWith("−");
+    }) : r === "integer" ? new Intl.NumberFormat(i, { maximumFractionDigits: 0 }) : new Intl.NumberFormat(i, { maximumFractionDigits: 10 }), T = (u) => Number.isFinite(u) ? c.format(u) : "", P = (u) => {
+      if (!u) return NaN;
+      const M = we(u), v = M.trim(), w = v.startsWith("-") || v.startsWith("−");
       let l = "";
       for (const g of M)
-        g >= "0" && g <= "9" ? l += g : g === u && (l += ".");
+        g >= "0" && g <= "9" ? l += g : g === d && (l += ".");
       if (!l || l === ".") return NaN;
       let f = Number(l);
       return Number.isFinite(f) ? (w && (f = -f), r === "percentage" && (f = f / 100), f) : NaN;
@@ -37,22 +37,22 @@ function ye(s, r, a) {
       b = "numeric";
     else if (r === "currency")
       try {
-        const { maximumFractionDigits: d } = new Intl.NumberFormat(s, {
+        const { maximumFractionDigits: u } = new Intl.NumberFormat(i, {
           style: "currency",
           currency: a ?? "USD"
         }).resolvedOptions();
-        b = d === 0 ? "numeric" : "decimal";
+        b = u === 0 ? "numeric" : "decimal";
       } catch {
         b = "decimal";
       }
     return {
       format: T,
       parse: P,
-      decimalSeparator: u,
+      decimalSeparator: d,
       groupingSeparator: F,
       inputMode: b
     };
-  }, [s, r, a]);
+  }, [i, r, a]);
 }
 const De = be(
   [
@@ -78,29 +78,29 @@ const De = be(
     defaultVariants: { size: "md", tone: "default" }
   }
 ), H = [
-  "inline-flex items-center justify-center",
-  "h-full shrink-0",
-  "text-muted-foreground hover:text-foreground",
-  "transition-colors duration-[var(--animation-duration)] motion-reduce:transition-none",
-  "disabled:cursor-not-allowed disabled:opacity-50"
+  "ds:inline-flex ds:items-center ds:justify-center",
+  "ds:h-full ds:shrink-0",
+  "ds:text-muted-foreground ds:hover:text-foreground",
+  "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+  "ds:disabled:cursor-not-allowed ds:disabled:opacity-50"
 ].join(" "), xe = () => typeof navigator < "u" && navigator.language ? navigator.language : "en-US";
-function Ie(s) {
-  if (!Number.isFinite(s)) return 0;
-  const r = String(s), a = r.indexOf(".");
+function Ie(i) {
+  if (!Number.isFinite(i)) return 0;
+  const r = String(i), a = r.indexOf(".");
   return a === -1 ? 0 : r.length - a - 1;
 }
-function Fe(s, r) {
-  if (r <= 0 || !Number.isFinite(r)) return s;
+function Fe(i, r) {
+  if (r <= 0 || !Number.isFinite(r)) return i;
   const t = 10 ** Ie(r);
-  return Math.round(s * t) / t;
+  return Math.round(i * t) / t;
 }
 const Se = fe(
   ({
-    value: s,
+    value: i,
     defaultValue: r,
     onChange: a,
     min: t,
-    max: u,
+    max: d,
     step: F = 1,
     mode: c = "integer",
     currency: T,
@@ -108,16 +108,16 @@ const Se = fe(
     size: b = "md",
     tone: S,
     className: C,
-    id: d,
+    id: u,
     disabled: M,
     onFocus: v,
     onBlur: w,
     onKeyDown: l,
     ...f
   }, g) => {
-    const { t: A } = ve(), y = ge(), G = d ?? y.id, z = !!(y.disabled || M), J = P ?? xe(), j = ye(J, c, T), { decimalSeparator: E, format: k, parse: L } = j, R = s !== void 0, [Q, X] = B(
+    const { t: A } = ve(), y = ge(), G = u ?? y.id, z = !!(y.disabled || M), J = P ?? xe(), j = ye(J, c, T), { decimalSeparator: E, format: k, parse: L } = j, R = i !== void 0, [Q, X] = B(
       r ?? null
-    ), i = R ? s ?? null : Q, U = $(
+    ), s = R ? i ?? null : Q, U = $(
       (e) => {
         const n = c === "percentage" ? e * 100 : e;
         return (Number.isInteger(n) ? String(n) : n.toString()).replace(".", E);
@@ -127,16 +127,16 @@ const Se = fe(
       (e) => e == null || Number.isNaN(e) ? "" : k(e),
       [k]
     ), [V, m] = B(
-      () => p(i)
+      () => p(s)
     ), D = me(!1), [Y, x] = B(!1);
     pe(() => {
-      D.current || m(p(i));
-    }, [i, p]);
-    const Z = Y || i !== null && (t !== void 0 && i < t || u !== void 0 && i > u), q = y.invalid || Z, _ = q ? "error" : S ?? "default", N = (e) => {
+      D.current || m(p(s));
+    }, [s, p]);
+    const Z = Y || s !== null && (t !== void 0 && s < t || d !== void 0 && s > d), q = y.invalid || Z, _ = q ? "error" : S ?? "default", N = (e) => {
       R || X(e), a == null || a(e);
     }, h = (e) => {
-      let o = (i ?? 0) + F * e;
-      t !== void 0 && (o = Math.max(t, o)), u !== void 0 && (o = Math.min(u, o)), o = Fe(o, F), N(o), x(!1), m(
+      let o = (s ?? 0) + F * e;
+      t !== void 0 && (o = Math.max(t, o)), d !== void 0 && (o = Math.min(d, o)), o = Fe(o, F), N(o), x(!1), m(
         D.current ? U(o) : p(o)
       );
     }, O = (e) => {
@@ -146,7 +146,7 @@ const Se = fe(
     }, K = (e) => {
       if (l == null || l(e), e.defaultPrevented || z) return;
       const { key: n, shiftKey: o } = e;
-      n === "ArrowUp" ? (e.preventDefault(), h(o ? 10 : 1)) : n === "ArrowDown" ? (e.preventDefault(), h(o ? -10 : -1)) : n === "PageUp" ? (e.preventDefault(), h(100)) : n === "PageDown" ? (e.preventDefault(), h(-100)) : n === "Home" && t !== void 0 ? (e.preventDefault(), O(t)) : n === "End" && u !== void 0 && (e.preventDefault(), O(u));
+      n === "ArrowUp" ? (e.preventDefault(), h(o ? 10 : 1)) : n === "ArrowDown" ? (e.preventDefault(), h(o ? -10 : -1)) : n === "PageUp" ? (e.preventDefault(), h(100)) : n === "PageDown" ? (e.preventDefault(), h(-100)) : n === "Home" && t !== void 0 ? (e.preventDefault(), O(t)) : n === "End" && d !== void 0 && (e.preventDefault(), O(d));
     }, ee = (e) => {
       const n = e.target.value;
       if (m(n), n.trim() === "") {
@@ -156,7 +156,7 @@ const Se = fe(
       const o = L(n);
       Number.isNaN(o) || N(o);
     }, te = (e) => {
-      v == null || v(e), D.current = !0, i != null && m(U(i));
+      v == null || v(e), D.current = !0, s != null && m(U(s));
     }, re = (e) => {
       if (w == null || w(e), D.current = !1, V.trim() === "") {
         N(null), x(!1), m("");
@@ -164,14 +164,14 @@ const Se = fe(
       }
       const n = L(V);
       if (Number.isNaN(n)) {
-        m(p(i));
+        m(p(s));
         return;
       }
-      const o = t !== void 0 && n < t || u !== void 0 && n > u;
+      const o = t !== void 0 && n < t || d !== void 0 && n > d;
       x(o), N(n), m(p(n));
     }, W = (e) => {
       e.preventDefault();
-    }, ne = () => h(1), ie = () => h(-1), se = z || t !== void 0 && i !== null && i <= t, oe = z || u !== void 0 && i !== null && i >= u, ae = i ?? void 0, ue = (c === "currency" || c === "percentage") && i !== null && i !== null ? k(i) : void 0, de = j.inputMode === "numeric" ? "[0-9]*" : void 0;
+    }, ne = () => h(1), se = () => h(-1), ie = z || t !== void 0 && s !== null && s <= t, oe = z || d !== void 0 && s !== null && s >= d, ae = s ?? void 0, de = (c === "currency" || c === "percentage") && s !== null && s !== null ? k(s) : void 0, ue = j.inputMode === "numeric" ? "[0-9]*" : void 0;
     return /* @__PURE__ */ le(
       "div",
       {
@@ -189,9 +189,9 @@ const Se = fe(
               type: "button",
               tabIndex: -1,
               "aria-label": A("ui.inputs.number.decrement", "Decrement"),
-              onClick: ie,
+              onClick: se,
               onMouseDown: W,
-              disabled: se,
+              disabled: ie,
               className: `${H} ds:ps-2 ds:pe-1`,
               children: /* @__PURE__ */ I(Ne, { "aria-hidden": "true", className: "ds:size-4" })
             }
@@ -204,14 +204,14 @@ const Se = fe(
               type: "text",
               role: "spinbutton",
               inputMode: j.inputMode,
-              pattern: de,
+              pattern: ue,
               autoComplete: "off",
               value: V,
               disabled: z,
               "aria-valuemin": t,
-              "aria-valuemax": u,
+              "aria-valuemax": d,
               "aria-valuenow": ae,
-              "aria-valuetext": ue,
+              "aria-valuetext": de,
               "aria-invalid": q || void 0,
               "aria-required": y.required || void 0,
               "aria-describedby": y.describedBy || void 0,
@@ -246,4 +246,4 @@ export {
   Se as N,
   ye as u
 };
-//# sourceMappingURL=number-input-BPPhekLu.js.map
+//# sourceMappingURL=number-input-DjpT_RXJ.js.map

package/dist/_chunks/number-input-DjpT_RXJ.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"number-input-DjpT_RXJ.js","sources":["../../src/components/number-input/use-locale-number.ts","../../src/components/number-input/number-input.tsx"],"sourcesContent":["import { useMemo } from 'react';\n\nexport type NumberInputMode = 'integer' | 'decimal' | 'currency' | 'percentage';\n\nexport interface LocaleNumber {\n /** Format a JS number for display (e.g. `1234.5` → `1.234,5` in de-DE). */\n format: (value: number) => string;\n /** Parse a locale-formatted string back to a JS number. Returns `NaN` for invalid input. */\n parse: (text: string) => number;\n /** The decimal separator for this locale (e.g. `.` or `,`). */\n decimalSeparator: string;\n /** The grouping separator for this locale (e.g. `,` or `.` or ` `). */\n groupingSeparator: string;\n /** The correct `inputMode` for the virtual keyboard. */\n inputMode: 'numeric' | 'decimal';\n}\n\nfunction normalizeDigits(text: string): string {\n let result = '';\n for (const ch of text) {\n const code = ch.codePointAt(0);\n if (code === undefined) continue;\n if (code >= 0x0660 && code <= 0x0669) {\n result += String.fromCodePoint(0x30 + (code - 0x0660));\n } else if (code >= 0x06f0 && code <= 0x06f9) {\n result += String.fromCodePoint(0x30 + (code - 0x06f0));\n } else {\n result += ch;\n }\n }\n return result;\n}\n\nexport function useLocaleNumber(\n locale: string,\n mode: NumberInputMode,\n currency?: string,\n): LocaleNumber {\n return useMemo(() => {\n const parts = new Intl.NumberFormat(locale).formatToParts(1234.5);\n const decimalSeparator =\n parts.find((p) => p.type === 'decimal')?.value ?? '.';\n const groupingSeparator =\n parts.find((p) => p.type === 'group')?.value ?? ',';\n\n const displayFormatter: Intl.NumberFormat = (() => {\n if (mode === 'currency') {\n return new Intl.NumberFormat(locale, {\n style: 'currency',\n currency: currency ?? 'USD',\n });\n }\n if (mode === 'percentage') {\n return new Intl.NumberFormat(locale, {\n style: 'percent',\n maximumFractionDigits: 4,\n });\n }\n if (mode === 'integer') {\n return new Intl.NumberFormat(locale, { maximumFractionDigits: 0 });\n }\n return new Intl.NumberFormat(locale, { maximumFractionDigits: 10 });\n })();\n\n const format = (value: number): string => {\n if (!Number.isFinite(value)) return '';\n return displayFormatter.format(value);\n };\n\n const parse = (text: string): number => {\n if (!text) return NaN;\n const normalized = normalizeDigits(text);\n const trimmed = normalized.trim();\n const hasMinus =\n trimmed.startsWith('-') || trimmed.startsWith('\\u2212');\n\n let cleaned = '';\n for (const ch of normalized) {\n if (ch >= '0' && ch <= '9') {\n cleaned += ch;\n } else if (ch === decimalSeparator) {\n cleaned += '.';\n }\n }\n if (!cleaned || cleaned === '.') return NaN;\n\n let n = Number(cleaned);\n if (!Number.isFinite(n)) return NaN;\n if (hasMinus) n = -n;\n if (mode === 'percentage') n = n / 100;\n return n;\n };\n\n let inputMode: 'numeric' | 'decimal' = 'decimal';\n if (mode === 'integer') {\n inputMode = 'numeric';\n } else if (mode === 'currency') {\n try {\n const { maximumFractionDigits } = new Intl.NumberFormat(locale, {\n style: 'currency',\n currency: currency ?? 'USD',\n }).resolvedOptions();\n inputMode = maximumFractionDigits === 0 ? 'numeric' : 'decimal';\n } catch {\n inputMode = 'decimal';\n }\n }\n\n return {\n format,\n parse,\n decimalSeparator,\n groupingSeparator,\n inputMode,\n };\n }, [locale, mode, currency]);\n}\n","import {\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n type ChangeEvent,\n type FocusEvent,\n type InputHTMLAttributes,\n type KeyboardEvent,\n type MouseEvent,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { ChevronDown, ChevronUp } from 'lucide-react';\nimport { useFormField } from '../form-field/form-field-context';\nimport {\n useLocaleNumber,\n type NumberInputMode,\n} from './use-locale-number';\n\nconst numberInputVariants = cva(\n [\n 'ds:flex ds:items-center ds:w-full ds:rounded-[var(--radius-sm)]',\n 'ds:border ds:bg-background ds:text-foreground',\n 'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n 'ds:focus-within:outline-[length:var(--focus-ring-width)] ds:focus-within:outline-solid',\n 'ds:focus-within:outline-ring ds:focus-within:outline-offset-[length:var(--focus-ring-offset)]',\n 'ds:has-[:disabled]:cursor-not-allowed ds:has-[:disabled]:opacity-50',\n ].join(' '),\n {\n variants: {\n size: {\n sm: 'ds:h-8 ds:text-[length:var(--font-size-sm)]',\n md: 'ds:h-[var(--min-target-size)] ds:text-[length:var(--font-size-base)]',\n lg: 'ds:h-12 ds:text-[length:var(--font-size-lg)]',\n },\n tone: {\n default: 'ds:border-border',\n error: 'ds:border-destructive ds:focus-within:outline-destructive',\n },\n },\n defaultVariants: { size: 'md', tone: 'default' },\n },\n);\n\nconst spinnerButton = [\n 'ds:inline-flex ds:items-center ds:justify-center',\n 'ds:h-full ds:shrink-0',\n 'ds:text-muted-foreground ds:hover:text-foreground',\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].join(' ');\n\nexport type { NumberInputMode };\n\nexport interface NumberInputProps\n extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n 'type' | 'onChange' | 'value' | 'defaultValue' | 'size'\n >,\n VariantProps<typeof numberInputVariants> {\n /** Current numeric value (controlled). */\n value?: number | null;\n /** Initial value (uncontrolled). */\n defaultValue?: number;\n /** Fires with the parsed number (not a string). `null` when the field is empty. */\n onChange?: (value: number | null) => void;\n /** Minimum allowed value. Maps to `aria-valuemin`. */\n min?: number;\n /** Maximum allowed value. Maps to `aria-valuemax`. */\n max?: number;\n /** Increment step. Defaults to `1`. */\n step?: number;\n /** Display/parse mode. Defaults to `'integer'`. */\n mode?: NumberInputMode;\n /** ISO 4217 currency code, required when `mode='currency'`. */\n currency?: string;\n /** BCP 47 locale. Defaults to `navigator.language` or `'en-US'`. */\n locale?: string;\n /** Size variant. */\n size?: 'sm' | 'md' | 'lg';\n /** Additional class names on the wrapper. */\n className?: string;\n}\n\nconst resolveDefaultLocale = (): string => {\n if (typeof navigator !== 'undefined' && navigator.language) {\n return navigator.language;\n }\n return 'en-US';\n};\n\nfunction decimalPlaces(n: number): number {\n if (!Number.isFinite(n)) return 0;\n const s = String(n);\n const dot = s.indexOf('.');\n if (dot === -1) return 0;\n return s.length - dot - 1;\n}\n\nfunction roundToStep(value: number, step: number): number {\n if (step <= 0 || !Number.isFinite(step)) return value;\n const precision = decimalPlaces(step);\n const factor = 10 ** precision;\n return Math.round(value * factor) / factor;\n}\n\nexport const NumberInput = forwardRef<HTMLInputElement, NumberInputProps>(\n (\n {\n value,\n defaultValue,\n onChange,\n min,\n max,\n step = 1,\n mode = 'integer',\n currency,\n locale,\n size = 'md',\n tone,\n className,\n id,\n disabled,\n onFocus,\n onBlur,\n onKeyDown,\n ...rest\n },\n ref,\n ) => {\n const { t } = useTranslation();\n const ctx = useFormField();\n const inputId = id ?? ctx.id;\n const effectiveDisabled = Boolean(ctx.disabled || disabled);\n\n const resolvedLocale = locale ?? resolveDefaultLocale();\n const localeNumber = useLocaleNumber(resolvedLocale, mode, currency);\n const { decimalSeparator, format: localeFormat, parse: localeParse } =\n localeNumber;\n\n const isControlled = value !== undefined;\n const [internalValue, setInternalValue] = useState<number | null>(\n defaultValue ?? null,\n );\n const currentValue: number | null = isControlled\n ? (value ?? null)\n : internalValue;\n\n const formatForEdit = useCallback(\n (n: number): string => {\n const displayed = mode === 'percentage' ? n * 100 : n;\n const raw = Number.isInteger(displayed)\n ? String(displayed)\n : displayed.toString();\n return raw.replace('.', decimalSeparator);\n },\n [mode, decimalSeparator],\n );\n\n const formatCurrent = useCallback(\n (n: number | null | undefined): string =>\n n === null || n === undefined || Number.isNaN(n) ? '' : localeFormat(n),\n [localeFormat],\n );\n\n const [inputText, setInputText] = useState<string>(() =>\n formatCurrent(currentValue),\n );\n const isFocusedRef = useRef(false);\n const [crossedBounds, setCrossedBounds] = useState(false);\n\n useEffect(() => {\n if (!isFocusedRef.current) {\n setInputText(formatCurrent(currentValue));\n }\n }, [currentValue, formatCurrent]);\n\n const computedInvalid =\n crossedBounds ||\n (currentValue !== null &&\n ((min !== undefined && currentValue < min) ||\n (max !== undefined && currentValue > max)));\n const ariaInvalid = ctx.invalid || computedInvalid;\n const effectiveTone: 'default' | 'error' = ariaInvalid\n ? 'error'\n : tone ?? 'default';\n\n const commitValue = (next: number | null) => {\n if (!isControlled) setInternalValue(next);\n onChange?.(next);\n };\n\n const applyDelta = (multiplier: number) => {\n const base = currentValue ?? 0;\n let next = base + step * multiplier;\n if (min !== undefined) next = Math.max(min, next);\n if (max !== undefined) next = Math.min(max, next);\n next = roundToStep(next, step);\n commitValue(next);\n setCrossedBounds(false);\n setInputText(\n isFocusedRef.current ? formatForEdit(next) : formatCurrent(next),\n );\n };\n\n const jumpTo = (target: number) => {\n commitValue(target);\n setCrossedBounds(false);\n setInputText(\n isFocusedRef.current ? formatForEdit(target) : formatCurrent(target),\n );\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n if (event.defaultPrevented) return;\n if (effectiveDisabled) return;\n\n const { key, shiftKey } = event;\n if (key === 'ArrowUp') {\n event.preventDefault();\n applyDelta(shiftKey ? 10 : 1);\n } else if (key === 'ArrowDown') {\n event.preventDefault();\n applyDelta(shiftKey ? -10 : -1);\n } else if (key === 'PageUp') {\n event.preventDefault();\n applyDelta(100);\n } else if (key === 'PageDown') {\n event.preventDefault();\n applyDelta(-100);\n } else if (key === 'Home' && min !== undefined) {\n event.preventDefault();\n jumpTo(min);\n } else if (key === 'End' && max !== undefined) {\n event.preventDefault();\n jumpTo(max);\n }\n };\n\n const handleInputChange = (event: ChangeEvent<HTMLInputElement>) => {\n const text = event.target.value;\n setInputText(text);\n if (text.trim() === '') {\n commitValue(null);\n setCrossedBounds(false);\n return;\n }\n const parsed = localeParse(text);\n if (!Number.isNaN(parsed)) {\n commitValue(parsed);\n }\n };\n\n const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n onFocus?.(event);\n isFocusedRef.current = true;\n if (currentValue !== null && currentValue !== undefined) {\n setInputText(formatForEdit(currentValue));\n }\n };\n\n const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n onBlur?.(event);\n isFocusedRef.current = false;\n\n if (inputText.trim() === '') {\n commitValue(null);\n setCrossedBounds(false);\n setInputText('');\n return;\n }\n const parsed = localeParse(inputText);\n if (Number.isNaN(parsed)) {\n setInputText(formatCurrent(currentValue));\n return;\n }\n const crossed =\n (min !== undefined && parsed < min) ||\n (max !== undefined && parsed > max);\n setCrossedBounds(crossed);\n commitValue(parsed);\n setInputText(formatCurrent(parsed));\n };\n\n const preventButtonBlur = (event: MouseEvent<HTMLButtonElement>) => {\n event.preventDefault();\n };\n\n const handleIncrement = () => applyDelta(1);\n const handleDecrement = () => applyDelta(-1);\n\n const decrementDisabled =\n effectiveDisabled ||\n (min !== undefined && currentValue !== null && currentValue <= min);\n const incrementDisabled =\n effectiveDisabled ||\n (max !== undefined && currentValue !== null && currentValue >= max);\n\n const valueNow = currentValue ?? undefined;\n const valueTextNeeded =\n (mode === 'currency' || mode === 'percentage') && currentValue !== null;\n const valueText =\n valueTextNeeded && currentValue !== null\n ? localeFormat(currentValue)\n : undefined;\n\n const patternAttr =\n localeNumber.inputMode === 'numeric' ? '[0-9]*' : undefined;\n\n return (\n <div\n className={numberInputVariants({\n size,\n tone: effectiveTone,\n className,\n })}\n data-component=\"number-input\"\n data-mode={mode}\n >\n <button\n type=\"button\"\n tabIndex={-1}\n aria-label={t('ui.inputs.number.decrement', 'Decrement')}\n onClick={handleDecrement}\n onMouseDown={preventButtonBlur}\n disabled={decrementDisabled}\n className={`${spinnerButton} ds:ps-2 ds:pe-1`}\n >\n <ChevronDown aria-hidden=\"true\" className=\"ds:size-4\" />\n </button>\n <input\n ref={ref}\n id={inputId}\n type=\"text\"\n role=\"spinbutton\"\n inputMode={localeNumber.inputMode}\n pattern={patternAttr}\n autoComplete=\"off\"\n value={inputText}\n disabled={effectiveDisabled}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={valueNow}\n aria-valuetext={valueText}\n aria-invalid={ariaInvalid || undefined}\n aria-required={ctx.required || undefined}\n aria-describedby={ctx.describedBy || undefined}\n onChange={handleInputChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n className=\"ds:flex-1 ds:w-full ds:min-w-0 ds:bg-transparent ds:outline-none ds:ps-2 ds:pe-2 ds:text-start ds:tabular-nums ds:disabled:cursor-not-allowed\"\n {...rest}\n />\n <button\n type=\"button\"\n tabIndex={-1}\n aria-label={t('ui.inputs.number.increment', 'Increment')}\n onClick={handleIncrement}\n onMouseDown={preventButtonBlur}\n disabled={incrementDisabled}\n className={`${spinnerButton} ds:ps-1 ds:pe-2`}\n >\n <ChevronUp aria-hidden=\"true\" className=\"ds:size-4\" />\n </button>\n </div>\n );\n },\n);\n\nNumberInput.displayName = 'NumberInput';\n"],"names":["normalizeDigits","text","result","ch","code","useLocaleNumber","locale","mode","currency","useMemo","parts","decimalSeparator","_a","p","groupingSeparator","_b","displayFormatter","format","value","parse","normalized","trimmed","hasMinus","cleaned","n","inputMode","maximumFractionDigits","numberInputVariants","cva","spinnerButton","resolveDefaultLocale","decimalPlaces","s","dot","roundToStep","step","factor","NumberInput","forwardRef","defaultValue","onChange","min","max","size","tone","className","id","disabled","onFocus","onBlur","onKeyDown","rest","ref","t","useTranslation","ctx","useFormField","inputId","effectiveDisabled","resolvedLocale","localeNumber","localeFormat","localeParse","isControlled","internalValue","setInternalValue","useState","currentValue","formatForEdit","useCallback","displayed","formatCurrent","inputText","setInputText","isFocusedRef","useRef","crossedBounds","setCrossedBounds","useEffect","computedInvalid","ariaInvalid","effectiveTone","commitValue","next","applyDelta","multiplier","jumpTo","target","handleKeyDown","event","key","shiftKey","handleInputChange","parsed","handleFocus","handleBlur","crossed","preventButtonBlur","handleIncrement","handleDecrement","decrementDisabled","incrementDisabled","valueNow","valueText","patternAttr","jsxs","jsx","ChevronDown","ChevronUp"],"mappings":"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"}