@alfadocs/ui-kit-debug 0.30.2 → 0.30.3
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.
- package/dist/_chunks/{agenda-card-CznB7K8e.js → agenda-card-DO9_yogb.js} +2 -2
- package/dist/_chunks/{agenda-card-CznB7K8e.js.map → agenda-card-DO9_yogb.js.map} +1 -1
- package/dist/_chunks/{agenda-tray-C_bha7oK.js → agenda-tray-WLbfMip6.js} +3 -3
- package/dist/_chunks/{agenda-tray-C_bha7oK.js.map → agenda-tray-WLbfMip6.js.map} +1 -1
- package/dist/_chunks/{ai-prompt-input-Bka3jX3i.js → ai-prompt-input-BXlwNnWe.js} +2 -2
- package/dist/_chunks/{ai-prompt-input-Bka3jX3i.js.map → ai-prompt-input-BXlwNnWe.js.map} +1 -1
- package/dist/_chunks/{alia-sidebar-CnvXq95r.js → alia-sidebar-C-232sD7.js} +4 -4
- package/dist/_chunks/{alia-sidebar-CnvXq95r.js.map → alia-sidebar-C-232sD7.js.map} +1 -1
- package/dist/_chunks/{audio-recorder-OB6IV9B1.js → audio-recorder-DL800PE_.js} +2 -2
- package/dist/_chunks/{audio-recorder-OB6IV9B1.js.map → audio-recorder-DL800PE_.js.map} +1 -1
- package/dist/_chunks/{badge-cLYVGlMh.js → badge-CIjQ1Us1.js} +2 -2
- package/dist/_chunks/{badge-cLYVGlMh.js.map → badge-CIjQ1Us1.js.map} +1 -1
- package/dist/_chunks/{benefit-card-CjYM8vNr.js → benefit-card-CLPNpiQE.js} +14 -3
- package/dist/_chunks/{benefit-card-CjYM8vNr.js.map → benefit-card-CLPNpiQE.js.map} +1 -1
- package/dist/_chunks/{booking-CBaSujVP.js → booking-DiyuLsQV.js} +4 -4
- package/dist/_chunks/{booking-CBaSujVP.js.map → booking-DiyuLsQV.js.map} +1 -1
- package/dist/_chunks/{carousel.agent-C9swH-Uf.js → carousel.agent-C2Icc9_T.js} +2 -2
- package/dist/_chunks/{carousel.agent-C9swH-Uf.js.map → carousel.agent-C2Icc9_T.js.map} +1 -1
- package/dist/_chunks/{chat-input-BfDcz1Yi.js → chat-input-cyl_y9bh.js} +2 -2
- package/dist/_chunks/{chat-input-BfDcz1Yi.js.map → chat-input-cyl_y9bh.js.map} +1 -1
- package/dist/_chunks/{checkbox-mwbrPZDY.js → checkbox-Dgp_cfUr.js} +2 -2
- package/dist/_chunks/{checkbox-mwbrPZDY.js.map → checkbox-Dgp_cfUr.js.map} +1 -1
- package/dist/_chunks/{checkbox-group-Bwmt1ovQ.js → checkbox-group-eVowqKcT.js} +2 -2
- package/dist/_chunks/{checkbox-group-Bwmt1ovQ.js.map → checkbox-group-eVowqKcT.js.map} +1 -1
- package/dist/_chunks/{description-list-yl3y3QKg.js → description-list-CWjnaDGn.js} +2 -2
- package/dist/_chunks/{description-list-yl3y3QKg.js.map → description-list-CWjnaDGn.js.map} +1 -1
- package/dist/_chunks/{dialog-BBXqpZIt.js → dialog-C-lTGVkB.js} +2 -2
- package/dist/_chunks/{dialog-BBXqpZIt.js.map → dialog-C-lTGVkB.js.map} +1 -1
- package/dist/_chunks/{editable-currency-cell-renderer-DSReCae7.js → editable-currency-cell-renderer-CztRy_21.js} +8 -8
- package/dist/_chunks/{editable-currency-cell-renderer-DSReCae7.js.map → editable-currency-cell-renderer-CztRy_21.js.map} +1 -1
- package/dist/_chunks/{header-CkMb1TZS.js → header-DDj7uGD-.js} +2 -2
- package/dist/_chunks/{header-CkMb1TZS.js.map → header-DDj7uGD-.js.map} +1 -1
- package/dist/_chunks/{icon-button-BRHSSFmZ.js → icon-button-DPEqBKBQ.js} +2 -2
- package/dist/_chunks/{icon-button-BRHSSFmZ.js.map → icon-button-DPEqBKBQ.js.map} +1 -1
- package/dist/_chunks/{key-value-pair-CqeKiP__.js → key-value-pair-BvDY3zuc.js} +2 -2
- package/dist/_chunks/{key-value-pair-CqeKiP__.js.map → key-value-pair-BvDY3zuc.js.map} +1 -1
- package/dist/_chunks/{locale-picker-BHxbTNmR.js → locale-picker-CY89MChR.js} +3 -3
- package/dist/_chunks/{locale-picker-BHxbTNmR.js.map → locale-picker-CY89MChR.js.map} +1 -1
- package/dist/_chunks/{message-card-DjRtA8GG.js → message-card-D6iyPacd.js} +2 -2
- package/dist/_chunks/{message-card-DjRtA8GG.js.map → message-card-D6iyPacd.js.map} +1 -1
- package/dist/_chunks/{message-tray-DfsAMncP.js → message-tray-Bh-0ra-Y.js} +3 -3
- package/dist/_chunks/{message-tray-DfsAMncP.js.map → message-tray-Bh-0ra-Y.js.map} +1 -1
- package/dist/_chunks/{multi-select-CyspR5ZF.js → multi-select-dSe6Xtc4.js} +2 -2
- package/dist/_chunks/{multi-select-CyspR5ZF.js.map → multi-select-dSe6Xtc4.js.map} +1 -1
- package/dist/_chunks/{notification-card-B_847w5g.js → notification-card-vaMaA7Wa.js} +2 -2
- package/dist/_chunks/{notification-card-B_847w5g.js.map → notification-card-vaMaA7Wa.js.map} +1 -1
- package/dist/_chunks/{notification-tray-6f7smmT1.js → notification-tray-Cnum6LwM.js} +3 -3
- package/dist/_chunks/{notification-tray-6f7smmT1.js.map → notification-tray-Cnum6LwM.js.map} +1 -1
- package/dist/_chunks/{patient-shell-CAXYzbRw.js → patient-shell-CYaNkbA1.js} +4 -4
- package/dist/_chunks/{patient-shell-CAXYzbRw.js.map → patient-shell-CYaNkbA1.js.map} +1 -1
- package/dist/_chunks/{popover-D0slaBB9.js → popover-BfHSBEKq.js} +2 -2
- package/dist/_chunks/{popover-D0slaBB9.js.map → popover-BfHSBEKq.js.map} +1 -1
- package/dist/_chunks/{privacy-lock-BI4vi9Ud.js → privacy-lock-C6Ra5m3p.js} +2 -2
- package/dist/_chunks/{privacy-lock-BI4vi9Ud.js.map → privacy-lock-C6Ra5m3p.js.map} +1 -1
- package/dist/_chunks/{public-header.agent-5U3S9QiC.js → public-header.agent-B-B0WDAi.js} +3 -3
- package/dist/_chunks/{public-header.agent-5U3S9QiC.js.map → public-header.agent-B-B0WDAi.js.map} +1 -1
- package/dist/_chunks/{radio-group-BHZOxrIK.js → radio-group-CTlGc36r.js} +2 -2
- package/dist/_chunks/{radio-group-BHZOxrIK.js.map → radio-group-CTlGc36r.js.map} +1 -1
- package/dist/_chunks/{radio-DvF59ThA.js → radio-i4ogu3cq.js} +2 -2
- package/dist/_chunks/{radio-DvF59ThA.js.map → radio-i4ogu3cq.js.map} +1 -1
- package/dist/_chunks/{reviews-panel-D-zjPKFL.js → reviews-panel-bKEUKSic.js} +2 -2
- package/dist/_chunks/{reviews-panel-D-zjPKFL.js.map → reviews-panel-bKEUKSic.js.map} +1 -1
- package/dist/_chunks/{sheet-D8M8hf8B.js → sheet-D8Yl0nKR.js} +2 -2
- package/dist/_chunks/{sheet-D8M8hf8B.js.map → sheet-D8Yl0nKR.js.map} +1 -1
- package/dist/_chunks/{slot-grid-B2zprPcv.js → slot-grid-Q94gVmhn.js} +2 -2
- package/dist/_chunks/{slot-grid-B2zprPcv.js.map → slot-grid-Q94gVmhn.js.map} +1 -1
- package/dist/_chunks/{tag-CQmHRM4Y.js → tag-bBPAvXyh.js} +2 -2
- package/dist/_chunks/{tag-CQmHRM4Y.js.map → tag-bBPAvXyh.js.map} +1 -1
- package/dist/_chunks/{task-tray-Bcmrrs8m.js → task-tray-6NlryfMJ.js} +2 -2
- package/dist/_chunks/{task-tray-Bcmrrs8m.js.map → task-tray-6NlryfMJ.js.map} +1 -1
- package/dist/_chunks/{theme-toggle-nPzb378f.js → theme-toggle-JoeMs_ws.js} +2 -2
- package/dist/_chunks/{theme-toggle-nPzb378f.js.map → theme-toggle-JoeMs_ws.js.map} +1 -1
- package/dist/_chunks/{toast.agent-CTF6nIj5.js → toast.agent-DVpKt38p.js} +2 -2
- package/dist/_chunks/{toast.agent-CTF6nIj5.js.map → toast.agent-DVpKt38p.js.map} +1 -1
- package/dist/_chunks/{tooltip-DHik5yRI.js → tooltip-ClJd0ciy.js} +31 -19
- package/dist/_chunks/tooltip-ClJd0ciy.js.map +1 -0
- package/dist/_chunks/{workflow-map-BKsKdYvZ.js → workflow-map-DlWBJJBt.js} +4 -4
- package/dist/_chunks/{workflow-map-BKsKdYvZ.js.map → workflow-map-DlWBJJBt.js.map} +1 -1
- package/dist/agent-catalog.json +1 -1
- package/dist/components/agenda-card/index.js +1 -1
- package/dist/components/agenda-tray/index.js +1 -1
- package/dist/components/ai-prompt-input/index.js +1 -1
- package/dist/components/audio-recorder/index.js +1 -1
- package/dist/components/badge/index.js +1 -1
- package/dist/components/benefit-card/benefit-card.d.ts.map +1 -1
- package/dist/components/benefit-card/index.js +1 -1
- package/dist/components/booking/index.js +1 -1
- package/dist/components/button/index.js +1 -1
- package/dist/components/carousel/index.js +1 -1
- package/dist/components/chat-input/index.js +1 -1
- package/dist/components/checkbox/index.js +1 -1
- package/dist/components/checkbox-group/index.js +1 -1
- package/dist/components/data-table/index.js +1 -1
- package/dist/components/description-list/index.js +1 -1
- package/dist/components/dialog/index.js +1 -1
- package/dist/components/header/index.js +1 -1
- package/dist/components/header-settings/index.js +2 -2
- package/dist/components/icon-button/index.js +1 -1
- package/dist/components/key-value-pair/index.js +1 -1
- package/dist/components/locale-picker/index.js +1 -1
- package/dist/components/message-card/index.js +1 -1
- package/dist/components/message-tray/index.js +1 -1
- package/dist/components/multi-select/index.js +1 -1
- package/dist/components/notification-card/index.js +1 -1
- package/dist/components/notification-tray/index.js +1 -1
- package/dist/components/popover/index.js +1 -1
- package/dist/components/privacy-lock/index.js +1 -1
- package/dist/components/public-header/index.js +1 -1
- package/dist/components/radio/index.js +1 -1
- package/dist/components/radio-group/index.js +2 -2
- package/dist/components/reviews-panel/index.js +1 -1
- package/dist/components/sheet/index.js +1 -1
- package/dist/components/slot-grid/index.js +1 -1
- package/dist/components/tag/index.js +1 -1
- package/dist/components/task-tray/index.js +1 -1
- package/dist/components/theme-toggle/index.js +1 -1
- package/dist/components/toast/index.js +1 -1
- package/dist/components/tooltip/index.js +1 -1
- package/dist/components/tooltip/tooltip.d.ts.map +1 -1
- package/dist/components/workflow/index.js +1 -1
- package/dist/index.js +38 -38
- package/dist/patterns/alia-assistant/index.js +1 -1
- package/dist/patterns/patient-shell/index.js +1 -1
- package/dist/tokens.css +1 -1
- package/package.json +1 -1
- package/dist/_chunks/tooltip-DHik5yRI.js.map +0 -1
package/dist/_chunks/{notification-card-B_847w5g.js.map → notification-card-vaMaA7Wa.js.map}
RENAMED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notification-card-B_847w5g.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\n 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:border ds:border-[color:var(--border)] 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<\n HTMLDivElement,\n NotificationCardProps\n>(\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('notificationCard.unreadSuffix', ', unread');\n const ariaLabel = t('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 event.preventDefault();\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={\n stretchedLinkClass +\n ' ds:contents ds:bg-transparent ds:border-0 ds:p-0'\n }\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 event.preventDefault();\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-component-id={item.id}\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 event.preventDefault();\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('notificationCard.dismiss', 'Dismiss notification')}\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","X"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"notification-card-vaMaA7Wa.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\n 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:border ds:border-[color:var(--border)] 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<\n HTMLDivElement,\n NotificationCardProps\n>(\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('notificationCard.unreadSuffix', ', unread');\n const ariaLabel = t('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 event.preventDefault();\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={\n stretchedLinkClass +\n ' ds:contents ds:bg-transparent ds:border-0 ds:p-0'\n }\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 event.preventDefault();\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-component-id={item.id}\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 event.preventDefault();\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('notificationCard.dismiss', 'Dismiss notification')}\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","X"],"mappings":"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"}
|
|
@@ -4,11 +4,11 @@ import * as y from "@radix-ui/react-popover";
|
|
|
4
4
|
import { c as C } from "./index-D2ZczOXr.js";
|
|
5
5
|
import { useTranslation as F } from "react-i18next";
|
|
6
6
|
import { u as le } from "./use-controllable-state-BiY4xTzM.js";
|
|
7
|
-
import { I as fe } from "./icon-button-
|
|
7
|
+
import { I as fe } from "./icon-button-DPEqBKBQ.js";
|
|
8
8
|
import { B as E } from "./button-DD_0Xdmr.js";
|
|
9
9
|
import { S as q } from "./separator-CYU_bGFn.js";
|
|
10
10
|
import { S as x } from "./skeleton-CZbwyJAA.js";
|
|
11
|
-
import { N as pe } from "./notification-card-
|
|
11
|
+
import { N as pe } from "./notification-card-vaMaA7Wa.js";
|
|
12
12
|
import { u as ue } from "./registry-C9nwlNyL.js";
|
|
13
13
|
import { c as me } from "./createLucideIcon-CrFbzy84.js";
|
|
14
14
|
/**
|
|
@@ -445,4 +445,4 @@ export {
|
|
|
445
445
|
Te as N,
|
|
446
446
|
ve as n
|
|
447
447
|
};
|
|
448
|
-
//# sourceMappingURL=notification-tray-
|
|
448
|
+
//# sourceMappingURL=notification-tray-Cnum6LwM.js.map
|
package/dist/_chunks/{notification-tray-6f7smmT1.js.map → notification-tray-Cnum6LwM.js.map}
RENAMED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notification-tray-6f7smmT1.js","sources":["../../node_modules/lucide-react/dist/esm/icons/bell.js","../../src/components/notification-tray/notification-tray.agent.ts","../../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","/* -------------------------------------------------------------------- */\n/* Agent adapter — NotificationTray. */\n/* */\n/* Tray-level surface: an agent can open / close the panel, read the */\n/* current items (id + read flag only — never PHI), and route per-item */\n/* operations (dismiss, mark_read, select) through the curated handle. */\n/* All actions are routed through the imperative handle; the adapter */\n/* never touches the DOM directly. */\n/* -------------------------------------------------------------------- */\n\nimport type { AgentAdapter } from '../../agent/types';\nimport type { NotificationTrayHandle } from './notification-tray';\n\nexport const notificationTrayAgent: AgentAdapter<NotificationTrayHandle> = {\n id: 'notification-tray',\n capabilities: ['open', 'close', 'select_single', 'dismiss'],\n state: {\n items: {\n type: 'Array<{ id: string; read: boolean }>',\n descriptionKey: 'ui.agent.notificationTray.state.items',\n description:\n 'Currently-displayed notifications. Ids + read flag only — no PHI.',\n read: (handle) => handle.getItems(),\n },\n unreadCount: {\n type: 'number',\n descriptionKey: 'ui.agent.notificationTray.state.unreadCount',\n description: 'Badge unread count surfaced by the host.',\n read: (handle) => handle.getUnreadCount(),\n },\n isOpen: {\n type: 'boolean',\n descriptionKey: 'ui.agent.notificationTray.state.isOpen',\n description: 'Whether the dropdown panel is currently open.',\n read: (handle) => handle.isOpen(),\n },\n },\n actions: {\n open: {\n safety: 'read',\n descriptionKey: 'ui.agent.notificationTray.actions.open',\n description: 'Open the notification panel.',\n invoke: (handle) => {\n handle.open();\n },\n },\n close: {\n safety: 'read',\n descriptionKey: 'ui.agent.notificationTray.actions.close',\n description: 'Close the notification panel.',\n invoke: (handle) => {\n handle.close();\n },\n },\n select_item: {\n safety: 'read',\n argsType: '{ id: string }',\n descriptionKey: 'ui.agent.notificationTray.actions.selectItem',\n description: 'Activate the notification with the given id.',\n invoke: (handle, args: { id: string }) => {\n handle.selectItem(args.id);\n },\n },\n mark_read: {\n safety: 'write',\n argsType: '{ id: string }',\n descriptionKey: 'ui.agent.notificationTray.actions.markRead',\n description: 'Request the host to mark a notification as read.',\n invoke: (handle, args: { id: string }) => {\n handle.markRead(args.id);\n },\n },\n dismiss: {\n safety: 'destructive',\n argsType: '{ id: string }',\n descriptionKey: 'ui.agent.notificationTray.actions.dismiss',\n description:\n 'Request the host to dismiss the notification with the given id.',\n invoke: (handle, args: { id: string }) => {\n handle.dismiss(args.id);\n },\n },\n },\n domHooks: {\n root: {\n attr: 'data-component',\n value: 'notification-tray',\n description: 'Marks the NotificationTray wrapper.',\n },\n instanceId: {\n attr: 'data-component-id',\n sourceProp: 'id',\n description:\n 'Sourced from the id prop. Required to address a specific tray from the agent.',\n },\n item: {\n attr: 'data-notification-id',\n description:\n 'Stable notification id emitted on each rendered NotificationCard inside the tray.',\n },\n },\n};\n","import {\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useLayoutEffect,\n useMemo,\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 { useControllableState } from '../../hooks/use-controllable-state';\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';\nimport { useAgentRegistration } from '../../agent/registry';\nimport { notificationTrayAgent } from './notification-tray.agent';\n\n/* ------------------------------------------------------------------ */\n/* Types */\n/* ------------------------------------------------------------------ */\n\n/**\n * Curated imperative handle for NotificationTray. Exposed as the\n * forwardRef target so a future agent / MCP UI bridge can drive the\n * tray without touching the DOM. See `notification-tray.agent.ts`.\n */\nexport interface NotificationTrayHandle {\n open: () => void;\n close: () => void;\n isOpen: () => boolean;\n getItems: () => Array<{ id: string; read: boolean }>;\n getUnreadCount: () => number;\n selectItem: (id: string) => void;\n markRead: (id: string) => void;\n dismiss: (id: string) => void;\n}\n\nexport interface NotificationTrayProps\n extends\n Omit<\n HTMLAttributes<HTMLDivElement>,\n 'onClick' | 'children' | 'role' | 'id'\n >,\n VariantProps<typeof notificationTrayVariants> {\n /**\n * Stable instance id. Surfaced on the root as `data-component-id` so\n * an agent / MCP UI bridge can address this specific tray.\n */\n id?: string;\n /** Fires when the host should mark a single notification as read (used by agent integration). */\n onMarkRead?: (item: NotificationItem) => void;\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(\n 'ds:relative ds:inline-flex ds:items-center',\n {\n variants: {\n size: {\n sm: '',\n md: '',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n },\n);\n\nconst panelVariants = cva(\n [\n 'ds:flex ds:flex-col',\n 'ds:bg-[var(--popover)] ds:text-[var(--popover-foreground)]',\n // Subtle tokenized border pairs with the drop-shadow so the panel's\n // edge stays legible in dark themes (where the shadow alone reads as a\n // faint halo). `--card-border` is alpha-based (32% in dark, lighter in\n // light) so the edge cue stays soft rather than turning into a heavy\n // outline. The forced-colors override below upgrades the border to\n // `CanvasText` so HCM repaints a fully visible edge.\n 'ds:border ds:border-[color:var(--card-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-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('notificationTray.noNotifications', 'No notifications')}\n </p>\n <p className=\"type-meta ds:text-[color:var(--muted-foreground)]\">\n {t(\n '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<\n HTMLDivElement,\n NotificationTrayProps\n>(\n (\n {\n id,\n items,\n unseenCount,\n open,\n onOpenChange,\n onItemClick,\n onDismiss,\n onMarkRead,\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 [isOpenRaw, handleOpenChange] = useControllableState<boolean>({\n value: open,\n defaultValue: false,\n onChange: onOpenChange,\n });\n const isOpen = isOpenRaw ?? false;\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 '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('notificationTray.triggerLabel', {\n count: displayCount,\n defaultValue: 'Notifications, {{count}} unread',\n })\n : t('notificationTray.triggerLabelNone', 'Notifications, none unread');\n\n const badgeLabel = formatBadgeCount(\n displayCount,\n t('notificationTray.badgeCountOverflow', '99+'),\n );\n\n const panelClass = panelVariants({ size });\n\n /* Curated imperative handle for agent integration. Pure look-ups +\n * delegations into the consumer-supplied callbacks; never touches the\n * DOM. See notification-tray.agent.ts. */\n const itemsRef = useRef<NotificationItem[]>(items);\n itemsRef.current = items;\n const unseenRef = useRef<number | undefined>(unseenCount);\n unseenRef.current = unseenCount;\n const isOpenRef = useRef<boolean>(isOpen);\n isOpenRef.current = isOpen;\n\n const handle = useMemo<NotificationTrayHandle>(\n () => ({\n open: () => handleOpenChange(true),\n close: () => handleOpenChange(false),\n isOpen: () => isOpenRef.current,\n getItems: () =>\n itemsRef.current.map((i) => ({ id: i.id, read: !!i.read })),\n getUnreadCount: () =>\n unseenRef.current ?? itemsRef.current.filter((i) => !i.read).length,\n selectItem: (targetId: string) => {\n const found = itemsRef.current.find((i) => i.id === targetId);\n if (found) onItemClick?.(found);\n },\n markRead: (targetId: string) => {\n const found = itemsRef.current.find((i) => i.id === targetId);\n if (found) onMarkRead?.(found);\n },\n dismiss: (targetId: string) => {\n const found = itemsRef.current.find((i) => i.id === targetId);\n if (found) onDismiss?.(found);\n },\n }),\n [handleOpenChange, onItemClick, onMarkRead, onDismiss],\n );\n\n const rootRef = useRef<HTMLDivElement>(null);\n useImperativeHandle(ref, () => rootRef.current as HTMLDivElement, []);\n useAgentRegistration(notificationTrayAgent, handle, id);\n\n return (\n <div\n ref={rootRef}\n data-component=\"notification-tray\"\n data-component-id={id}\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('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('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('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\"` requires `listitem` children — applied only\n // when we render NotificationCards. The empty / loading\n // states render a `role=\"status\"` panel which would violate\n // aria-required-children if the list role were always on.\n role={loading || displayed.length === 0 ? undefined : '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 data-notification-id={item.id}\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","notificationTrayAgent","handle","args","notificationTrayVariants","cva","panelVariants","badgeVariants","formatBadgeCount","count","overflowLabel","SkeletonRow","jsxs","jsx","Skeleton","EmptyPanel","t","useTranslation","NotificationTray","forwardRef","id","items","unseenCount","open","onOpenChange","onItemClick","onDismiss","onMarkRead","onMarkAllRead","loading","maxVisible","viewAllLabel","onViewAll","align","side","size","className","rest","ref","isOpenRaw","handleOpenChange","useControllableState","isOpen","displayed","setDisplayed","useState","item","animationDurationMs","useCallback","raw","trimmed","n","useLayoutEffect","prev","nextIds","i","prevIds","d","merged","fresh","useEffect","ms","timer","liveRegionRef","useRef","lastTopIdRef","_a","topId","newest","displayCount","triggerAriaLabel","badgeLabel","panelClass","itemsRef","unseenRef","isOpenRef","useMemo","targetId","found","rootRef","useImperativeHandle","useAgentRegistration","RadixPopover","IconButton","Button","Separator","Fragment","leaving","NotificationCard"],"mappings":"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","x_google_ignoreList":[0]}
|
|
1
|
+
{"version":3,"file":"notification-tray-Cnum6LwM.js","sources":["../../node_modules/lucide-react/dist/esm/icons/bell.js","../../src/components/notification-tray/notification-tray.agent.ts","../../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","/* -------------------------------------------------------------------- */\n/* Agent adapter — NotificationTray. */\n/* */\n/* Tray-level surface: an agent can open / close the panel, read the */\n/* current items (id + read flag only — never PHI), and route per-item */\n/* operations (dismiss, mark_read, select) through the curated handle. */\n/* All actions are routed through the imperative handle; the adapter */\n/* never touches the DOM directly. */\n/* -------------------------------------------------------------------- */\n\nimport type { AgentAdapter } from '../../agent/types';\nimport type { NotificationTrayHandle } from './notification-tray';\n\nexport const notificationTrayAgent: AgentAdapter<NotificationTrayHandle> = {\n id: 'notification-tray',\n capabilities: ['open', 'close', 'select_single', 'dismiss'],\n state: {\n items: {\n type: 'Array<{ id: string; read: boolean }>',\n descriptionKey: 'ui.agent.notificationTray.state.items',\n description:\n 'Currently-displayed notifications. Ids + read flag only — no PHI.',\n read: (handle) => handle.getItems(),\n },\n unreadCount: {\n type: 'number',\n descriptionKey: 'ui.agent.notificationTray.state.unreadCount',\n description: 'Badge unread count surfaced by the host.',\n read: (handle) => handle.getUnreadCount(),\n },\n isOpen: {\n type: 'boolean',\n descriptionKey: 'ui.agent.notificationTray.state.isOpen',\n description: 'Whether the dropdown panel is currently open.',\n read: (handle) => handle.isOpen(),\n },\n },\n actions: {\n open: {\n safety: 'read',\n descriptionKey: 'ui.agent.notificationTray.actions.open',\n description: 'Open the notification panel.',\n invoke: (handle) => {\n handle.open();\n },\n },\n close: {\n safety: 'read',\n descriptionKey: 'ui.agent.notificationTray.actions.close',\n description: 'Close the notification panel.',\n invoke: (handle) => {\n handle.close();\n },\n },\n select_item: {\n safety: 'read',\n argsType: '{ id: string }',\n descriptionKey: 'ui.agent.notificationTray.actions.selectItem',\n description: 'Activate the notification with the given id.',\n invoke: (handle, args: { id: string }) => {\n handle.selectItem(args.id);\n },\n },\n mark_read: {\n safety: 'write',\n argsType: '{ id: string }',\n descriptionKey: 'ui.agent.notificationTray.actions.markRead',\n description: 'Request the host to mark a notification as read.',\n invoke: (handle, args: { id: string }) => {\n handle.markRead(args.id);\n },\n },\n dismiss: {\n safety: 'destructive',\n argsType: '{ id: string }',\n descriptionKey: 'ui.agent.notificationTray.actions.dismiss',\n description:\n 'Request the host to dismiss the notification with the given id.',\n invoke: (handle, args: { id: string }) => {\n handle.dismiss(args.id);\n },\n },\n },\n domHooks: {\n root: {\n attr: 'data-component',\n value: 'notification-tray',\n description: 'Marks the NotificationTray wrapper.',\n },\n instanceId: {\n attr: 'data-component-id',\n sourceProp: 'id',\n description:\n 'Sourced from the id prop. Required to address a specific tray from the agent.',\n },\n item: {\n attr: 'data-notification-id',\n description:\n 'Stable notification id emitted on each rendered NotificationCard inside the tray.',\n },\n },\n};\n","import {\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useLayoutEffect,\n useMemo,\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 { useControllableState } from '../../hooks/use-controllable-state';\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';\nimport { useAgentRegistration } from '../../agent/registry';\nimport { notificationTrayAgent } from './notification-tray.agent';\n\n/* ------------------------------------------------------------------ */\n/* Types */\n/* ------------------------------------------------------------------ */\n\n/**\n * Curated imperative handle for NotificationTray. Exposed as the\n * forwardRef target so a future agent / MCP UI bridge can drive the\n * tray without touching the DOM. See `notification-tray.agent.ts`.\n */\nexport interface NotificationTrayHandle {\n open: () => void;\n close: () => void;\n isOpen: () => boolean;\n getItems: () => Array<{ id: string; read: boolean }>;\n getUnreadCount: () => number;\n selectItem: (id: string) => void;\n markRead: (id: string) => void;\n dismiss: (id: string) => void;\n}\n\nexport interface NotificationTrayProps\n extends\n Omit<\n HTMLAttributes<HTMLDivElement>,\n 'onClick' | 'children' | 'role' | 'id'\n >,\n VariantProps<typeof notificationTrayVariants> {\n /**\n * Stable instance id. Surfaced on the root as `data-component-id` so\n * an agent / MCP UI bridge can address this specific tray.\n */\n id?: string;\n /** Fires when the host should mark a single notification as read (used by agent integration). */\n onMarkRead?: (item: NotificationItem) => void;\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(\n 'ds:relative ds:inline-flex ds:items-center',\n {\n variants: {\n size: {\n sm: '',\n md: '',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n },\n);\n\nconst panelVariants = cva(\n [\n 'ds:flex ds:flex-col',\n 'ds:bg-[var(--popover)] ds:text-[var(--popover-foreground)]',\n // Subtle tokenized border pairs with the drop-shadow so the panel's\n // edge stays legible in dark themes (where the shadow alone reads as a\n // faint halo). `--card-border` is alpha-based (32% in dark, lighter in\n // light) so the edge cue stays soft rather than turning into a heavy\n // outline. The forced-colors override below upgrades the border to\n // `CanvasText` so HCM repaints a fully visible edge.\n 'ds:border ds:border-[color:var(--card-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-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('notificationTray.noNotifications', 'No notifications')}\n </p>\n <p className=\"type-meta ds:text-[color:var(--muted-foreground)]\">\n {t(\n '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<\n HTMLDivElement,\n NotificationTrayProps\n>(\n (\n {\n id,\n items,\n unseenCount,\n open,\n onOpenChange,\n onItemClick,\n onDismiss,\n onMarkRead,\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 [isOpenRaw, handleOpenChange] = useControllableState<boolean>({\n value: open,\n defaultValue: false,\n onChange: onOpenChange,\n });\n const isOpen = isOpenRaw ?? false;\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 '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('notificationTray.triggerLabel', {\n count: displayCount,\n defaultValue: 'Notifications, {{count}} unread',\n })\n : t('notificationTray.triggerLabelNone', 'Notifications, none unread');\n\n const badgeLabel = formatBadgeCount(\n displayCount,\n t('notificationTray.badgeCountOverflow', '99+'),\n );\n\n const panelClass = panelVariants({ size });\n\n /* Curated imperative handle for agent integration. Pure look-ups +\n * delegations into the consumer-supplied callbacks; never touches the\n * DOM. See notification-tray.agent.ts. */\n const itemsRef = useRef<NotificationItem[]>(items);\n itemsRef.current = items;\n const unseenRef = useRef<number | undefined>(unseenCount);\n unseenRef.current = unseenCount;\n const isOpenRef = useRef<boolean>(isOpen);\n isOpenRef.current = isOpen;\n\n const handle = useMemo<NotificationTrayHandle>(\n () => ({\n open: () => handleOpenChange(true),\n close: () => handleOpenChange(false),\n isOpen: () => isOpenRef.current,\n getItems: () =>\n itemsRef.current.map((i) => ({ id: i.id, read: !!i.read })),\n getUnreadCount: () =>\n unseenRef.current ?? itemsRef.current.filter((i) => !i.read).length,\n selectItem: (targetId: string) => {\n const found = itemsRef.current.find((i) => i.id === targetId);\n if (found) onItemClick?.(found);\n },\n markRead: (targetId: string) => {\n const found = itemsRef.current.find((i) => i.id === targetId);\n if (found) onMarkRead?.(found);\n },\n dismiss: (targetId: string) => {\n const found = itemsRef.current.find((i) => i.id === targetId);\n if (found) onDismiss?.(found);\n },\n }),\n [handleOpenChange, onItemClick, onMarkRead, onDismiss],\n );\n\n const rootRef = useRef<HTMLDivElement>(null);\n useImperativeHandle(ref, () => rootRef.current as HTMLDivElement, []);\n useAgentRegistration(notificationTrayAgent, handle, id);\n\n return (\n <div\n ref={rootRef}\n data-component=\"notification-tray\"\n data-component-id={id}\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('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('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('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\"` requires `listitem` children — applied only\n // when we render NotificationCards. The empty / loading\n // states render a `role=\"status\"` panel which would violate\n // aria-required-children if the list role were always on.\n role={loading || displayed.length === 0 ? undefined : '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 data-notification-id={item.id}\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","notificationTrayAgent","handle","args","notificationTrayVariants","cva","panelVariants","badgeVariants","formatBadgeCount","count","overflowLabel","SkeletonRow","jsxs","jsx","Skeleton","EmptyPanel","t","useTranslation","NotificationTray","forwardRef","id","items","unseenCount","open","onOpenChange","onItemClick","onDismiss","onMarkRead","onMarkAllRead","loading","maxVisible","viewAllLabel","onViewAll","align","side","size","className","rest","ref","isOpenRaw","handleOpenChange","useControllableState","isOpen","displayed","setDisplayed","useState","item","animationDurationMs","useCallback","raw","trimmed","n","useLayoutEffect","prev","nextIds","i","prevIds","d","merged","fresh","useEffect","ms","timer","liveRegionRef","useRef","lastTopIdRef","_a","topId","newest","displayCount","triggerAriaLabel","badgeLabel","panelClass","itemsRef","unseenRef","isOpenRef","useMemo","targetId","found","rootRef","useImperativeHandle","useAgentRegistration","RadixPopover","IconButton","Button","Separator","Fragment","leaving","NotificationCard"],"mappings":"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","x_google_ignoreList":[0]}
|
|
@@ -2,13 +2,13 @@ import { jsx as e, jsxs as n } from "react/jsx-runtime";
|
|
|
2
2
|
import { forwardRef as w, useState as k } from "react";
|
|
3
3
|
import { useTranslation as m } from "react-i18next";
|
|
4
4
|
import { A } from "./app-frame-BYx1gcV7.js";
|
|
5
|
-
import { I as H } from "./icon-button-
|
|
5
|
+
import { I as H } from "./icon-button-DPEqBKBQ.js";
|
|
6
6
|
import { D as i } from "./dropdown-menu-DZxwF23X.js";
|
|
7
|
-
import { H as x, g as C, f as B, e as M, a as N, c as T, d as O } from "./header-
|
|
7
|
+
import { H as x, g as C, f as B, e as M, a as N, c as T, d as O } from "./header-DDj7uGD-.js";
|
|
8
8
|
import { L as P } from "./logo-_Z-jLq80.js";
|
|
9
9
|
import { S as W, a as j, h as R, j as _, k as z, i as D } from "./sidebar-DkyC6GvS.js";
|
|
10
10
|
import { T as E } from "./theme-root-BOO73p5t.js";
|
|
11
|
-
import { a as q } from "./tooltip-
|
|
11
|
+
import { a as q } from "./tooltip-ClJd0ciy.js";
|
|
12
12
|
import { u as F } from "./use-theme-C2dHKUAN.js";
|
|
13
13
|
import { S as U } from "./settings-ca2Yi9R8.js";
|
|
14
14
|
import { c as G } from "./createLucideIcon-CrFbzy84.js";
|
|
@@ -170,4 +170,4 @@ $.displayName = "PatientShell";
|
|
|
170
170
|
export {
|
|
171
171
|
$ as P
|
|
172
172
|
};
|
|
173
|
-
//# sourceMappingURL=patient-shell-
|
|
173
|
+
//# sourceMappingURL=patient-shell-CYaNkbA1.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"patient-shell-CAXYzbRw.js","sources":["../../node_modules/lucide-react/dist/esm/icons/maximize-2.js","../../src/patterns/patient-shell/patient-shell.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: \"M15 3h6v6\", key: \"1q9fwt\" }],\n [\"path\", { d: \"m21 3-7 7\", key: \"1l2asr\" }],\n [\"path\", { d: \"m3 21 7-7\", key: \"tjx5ai\" }],\n [\"path\", { d: \"M9 21H3v-6\", key: \"wtvkvv\" }]\n];\nconst Maximize2 = createLucideIcon(\"maximize-2\", __iconNode);\n\nexport { __iconNode, Maximize2 as default };\n//# sourceMappingURL=maximize-2.js.map\n","/**\n * Patient Shell — the chrome for AlfaDocs's patient-facing users\n * (patients managing their own appointments and records).\n *\n * Deliberately flatter than the clinician `AppFrame` composition: no\n * command palette, no favourites, no practice/chain affordances, no\n * Alia, no privacy lock. Mirrors the legacy `_header.html.twig`\n * `app.user.type == 'patient'` branch and the `knp_menu_render('pcp')`\n * flat nav menu.\n *\n * Unlike most patterns in this folder, PatientShell exports a runtime\n * component because the consuming patient-portal app mounts it in\n * production — the exports are surfaced via `src/patterns/index.ts`\n * and included in the library bundle.\n */\nimport { forwardRef, useState, type ReactNode } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { LogOut, Maximize2, Settings as SettingsIcon } from 'lucide-react';\n\nimport { AppFrame } from '../../components/app-frame';\nimport { IconButton } from '../../components/button';\nimport { DropdownMenu } from '../../components/dropdown-menu';\nimport {\n Header,\n HeaderBrand,\n HeaderCenter,\n HeaderEnd,\n HeaderMenuButton,\n HeaderSkipLink,\n HeaderStart,\n} from '../../components/header';\nimport { Logo } from '../../components/logo';\nimport {\n Sidebar,\n SidebarBody,\n SidebarItem,\n SidebarItemBadge,\n SidebarItemIcon,\n SidebarItemLabel,\n type SidebarMode,\n} from '../../components/sidebar';\nimport { ThemeRoot } from '../../components/theme-root';\nimport { TooltipProvider } from '../../components/tooltip';\nimport { useTheme } from '../../hooks/use-theme';\n\n/* ------------------------------------------------------------------ */\n/* Public API */\n/* ------------------------------------------------------------------ */\n\nexport interface PatientNavItem {\n id: string;\n /** Pre-translated label — patients' nav labels are emitted already\n * translated by the consuming app's backend (legacy `knp_menu`). */\n label: string;\n href: string;\n /** Optional leading icon. Pass a lucide-react or equivalent element. */\n icon?: ReactNode;\n /** Optional unseen-item count rendered as a pill badge. */\n badgeCount?: number;\n /** Mark the item as the current page (`aria-current='page'`). */\n isActive?: boolean;\n}\n\nexport interface PatientShellProps {\n /** Patient's display name. Used as the avatar fallback by consumers\n * that read the name through a slot; not rendered inside this shell\n * today because the legacy patient chrome carries no profile pill. */\n userName: string;\n /** Optional avatar URL. Reserved for future profile-pill surfaces;\n * no visible effect today. */\n userAvatarSrc?: string;\n /** Flat nav items rendered in the sidebar, in order. */\n menuItems: PatientNavItem[];\n /** URL the \"Logout\" action navigates to — typically `/logout`. */\n logoutHref: string;\n /** Fires when the user toggles fullscreen from the settings menu. */\n onToggleFullscreen?: () => void;\n /** Optional brand logo. Defaults to\n * `<Logo variant=\"monochrome\" size=\"md\" decorative />`. */\n brandLogo?: ReactNode;\n /** Link target for the brand — typically the patient dashboard. */\n brandHref?: string;\n /** Override the accessible name of the `<main>` landmark. */\n mainAriaLabel?: string;\n /**\n * Force the sidebar into a specific mode. Consuming apps typically\n * flip to `'overlay'` on narrow viewports and leave this undefined\n * elsewhere (the sidebar then defaults to `'expanded'`).\n */\n sidebarState?: SidebarMode;\n /** Children render inside the main content region. */\n children: ReactNode;\n}\n\n/* ------------------------------------------------------------------ */\n/* Internals */\n/* ------------------------------------------------------------------ */\n\nfunction formatBadgeCount(count: number): string {\n return count > 99 ? '99+' : String(count);\n}\n\n/**\n * Guard against `javascript:` and other non-navigation schemes before\n * handing the URL to `window.location.assign`. A consuming app that lets\n * attacker-controlled input reach `logoutHref` would otherwise execute\n * script. Allow only relative paths, hash fragments, and `http(s)` URLs.\n */\nfunction isSafeLogoutHref(href: string): boolean {\n if (href.startsWith('/') || href.startsWith('#') || href.startsWith('?')) {\n return true;\n }\n try {\n const url = new URL(href, window.location.origin);\n return url.protocol === 'http:' || url.protocol === 'https:';\n } catch {\n return false;\n }\n}\n\nfunction SettingsMenu({\n logoutHref,\n onToggleFullscreen,\n}: {\n logoutHref: string;\n onToggleFullscreen?: () => void;\n}) {\n const { t } = useTranslation();\n return (\n <DropdownMenu.Root>\n <DropdownMenu.Trigger asChild>\n <IconButton\n icon={<SettingsIcon aria-hidden=\"true\" />}\n aria-label={t('patientShell.settings.triggerAria')}\n tooltip={t('patientShell.settings.triggerAria')}\n data-testid=\"patient-shell-settings-trigger\"\n />\n </DropdownMenu.Trigger>\n <DropdownMenu.Content align=\"end\">\n <DropdownMenu.Item\n startIcon={<Maximize2 aria-hidden=\"true\" />}\n onSelect={onToggleFullscreen}\n data-testid=\"patient-shell-fullscreen\"\n >\n {t('patientShell.settings.fullscreen')}\n </DropdownMenu.Item>\n <DropdownMenu.Separator />\n <DropdownMenu.Item\n startIcon={<LogOut aria-hidden=\"true\" />}\n onSelect={() => {\n if (typeof window === 'undefined') return;\n if (!isSafeLogoutHref(logoutHref)) return;\n window.location.assign(logoutHref);\n }}\n data-testid=\"patient-shell-logout\"\n >\n {t('patientShell.settings.logout')}\n </DropdownMenu.Item>\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n );\n}\n\nfunction PatientSidebarNav({ menuItems }: { menuItems: PatientNavItem[] }) {\n return (\n <SidebarBody>\n {menuItems.map((item) => {\n const badge =\n typeof item.badgeCount === 'number' && item.badgeCount > 0\n ? item.badgeCount\n : undefined;\n return (\n <SidebarItem\n key={item.id}\n href={item.href}\n aria-label={item.label}\n isActive={item.isActive}\n >\n {item.icon ? <SidebarItemIcon>{item.icon}</SidebarItemIcon> : null}\n <SidebarItemLabel>{item.label}</SidebarItemLabel>\n {badge !== undefined ? (\n <SidebarItemBadge>{formatBadgeCount(badge)}</SidebarItemBadge>\n ) : null}\n </SidebarItem>\n );\n })}\n </SidebarBody>\n );\n}\n\n/* ------------------------------------------------------------------ */\n/* Root */\n/* ------------------------------------------------------------------ */\n\nexport const PatientShell = forwardRef<HTMLDivElement, PatientShellProps>(\n (\n {\n menuItems,\n logoutHref,\n onToggleFullscreen,\n brandLogo,\n brandHref = '/',\n mainAriaLabel,\n sidebarState,\n children,\n // `userName` and `userAvatarSrc` are declared on the public API\n // for forward-compatibility (future profile-pill work) — they are\n // intentionally unused today because the legacy patient chrome\n // carries no profile pill.\n userName: _userName,\n userAvatarSrc: _userAvatarSrc,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n // Only wrap children in a nested <ThemeRoot> when the user has\n // explicitly chosen a theme via the hook (e.g., through an in-app\n // toggle). Otherwise we let the outer cascade win — wrapping with\n // the hook's default `resolvedTheme = 'light'` would clobber a\n // consuming app's `<html>` theme class (or Storybook's decorator)\n // for every child rendered inside the shell.\n const { theme: themePref, accessibility, resolvedTheme } = useTheme();\n const hasExplicitOverride =\n themePref !== 'system' || accessibility !== 'system';\n const themeBase = resolvedTheme.startsWith('dark') ? 'dark' : 'light';\n const themeAccessible = resolvedTheme.endsWith('-accessible');\n\n // Narrow-viewport overlay: `HeaderMenuButton` only renders below the\n // `md` breakpoint, and toggling opens the Sidebar's overlay Dialog.\n const [sidebarOpen, setSidebarOpen] = useState(false);\n\n const resolvedLogo = brandLogo ?? (\n <Logo variant=\"monochrome\" size=\"md\" decorative />\n );\n\n const shell = (\n <TooltipProvider>\n <AppFrame\n mainAriaLabel={mainAriaLabel}\n header={\n <Header>\n <HeaderStart>\n <HeaderSkipLink href=\"#main-content\" />\n <HeaderMenuButton onMenuOpen={() => setSidebarOpen(true)} />\n <HeaderBrand\n logo={resolvedLogo}\n href={brandHref}\n aria-label={t('patientShell.brand.homeAria')}\n />\n </HeaderStart>\n <HeaderCenter />\n <HeaderEnd>\n <SettingsMenu\n logoutHref={logoutHref}\n onToggleFullscreen={onToggleFullscreen}\n />\n </HeaderEnd>\n </Header>\n }\n sidebar={\n <Sidebar\n {...(sidebarState !== undefined\n ? { state: sidebarState }\n : { defaultState: 'expanded' as const })}\n open={sidebarOpen}\n onOpenChange={setSidebarOpen}\n aria-label={t('patientShell.sidebar.panelLabel')}\n data-testid=\"patient-shell-sidebar\"\n >\n <PatientSidebarNav menuItems={menuItems} />\n </Sidebar>\n }\n >\n {children}\n </AppFrame>\n </TooltipProvider>\n );\n\n if (!hasExplicitOverride) {\n // Pass-through wrapper preserves the ref contract without altering\n // the token cascade.\n return (\n <div ref={ref as never} className=\"ds:contents\">\n {shell}\n </div>\n );\n }\n\n return (\n <ThemeRoot\n ref={ref}\n theme={themeBase}\n accessible={themeAccessible}\n className=\"ds:contents\"\n >\n {shell}\n </ThemeRoot>\n );\n },\n);\n\nPatientShell.displayName = 'PatientShell';\n"],"names":["__iconNode","Maximize2","createLucideIcon","formatBadgeCount","count","isSafeLogoutHref","href","url","SettingsMenu","logoutHref","onToggleFullscreen","t","useTranslation","jsxs","DropdownMenu","jsx","IconButton","SettingsIcon","LogOut","PatientSidebarNav","menuItems","SidebarBody","item","badge","SidebarItem","SidebarItemIcon","SidebarItemLabel","SidebarItemBadge","PatientShell","forwardRef","brandLogo","brandHref","mainAriaLabel","sidebarState","children","_userName","_userAvatarSrc","ref","themePref","accessibility","resolvedTheme","useTheme","hasExplicitOverride","themeBase","themeAccessible","sidebarOpen","setSidebarOpen","useState","shell","TooltipProvider","AppFrame","Header","HeaderStart","HeaderSkipLink","HeaderMenuButton","HeaderBrand","Logo","HeaderCenter","HeaderEnd","Sidebar","ThemeRoot"],"mappings":"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","x_google_ignoreList":[0]}
|
|
1
|
+
{"version":3,"file":"patient-shell-CYaNkbA1.js","sources":["../../node_modules/lucide-react/dist/esm/icons/maximize-2.js","../../src/patterns/patient-shell/patient-shell.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: \"M15 3h6v6\", key: \"1q9fwt\" }],\n [\"path\", { d: \"m21 3-7 7\", key: \"1l2asr\" }],\n [\"path\", { d: \"m3 21 7-7\", key: \"tjx5ai\" }],\n [\"path\", { d: \"M9 21H3v-6\", key: \"wtvkvv\" }]\n];\nconst Maximize2 = createLucideIcon(\"maximize-2\", __iconNode);\n\nexport { __iconNode, Maximize2 as default };\n//# sourceMappingURL=maximize-2.js.map\n","/**\n * Patient Shell — the chrome for AlfaDocs's patient-facing users\n * (patients managing their own appointments and records).\n *\n * Deliberately flatter than the clinician `AppFrame` composition: no\n * command palette, no favourites, no practice/chain affordances, no\n * Alia, no privacy lock. Mirrors the legacy `_header.html.twig`\n * `app.user.type == 'patient'` branch and the `knp_menu_render('pcp')`\n * flat nav menu.\n *\n * Unlike most patterns in this folder, PatientShell exports a runtime\n * component because the consuming patient-portal app mounts it in\n * production — the exports are surfaced via `src/patterns/index.ts`\n * and included in the library bundle.\n */\nimport { forwardRef, useState, type ReactNode } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { LogOut, Maximize2, Settings as SettingsIcon } from 'lucide-react';\n\nimport { AppFrame } from '../../components/app-frame';\nimport { IconButton } from '../../components/button';\nimport { DropdownMenu } from '../../components/dropdown-menu';\nimport {\n Header,\n HeaderBrand,\n HeaderCenter,\n HeaderEnd,\n HeaderMenuButton,\n HeaderSkipLink,\n HeaderStart,\n} from '../../components/header';\nimport { Logo } from '../../components/logo';\nimport {\n Sidebar,\n SidebarBody,\n SidebarItem,\n SidebarItemBadge,\n SidebarItemIcon,\n SidebarItemLabel,\n type SidebarMode,\n} from '../../components/sidebar';\nimport { ThemeRoot } from '../../components/theme-root';\nimport { TooltipProvider } from '../../components/tooltip';\nimport { useTheme } from '../../hooks/use-theme';\n\n/* ------------------------------------------------------------------ */\n/* Public API */\n/* ------------------------------------------------------------------ */\n\nexport interface PatientNavItem {\n id: string;\n /** Pre-translated label — patients' nav labels are emitted already\n * translated by the consuming app's backend (legacy `knp_menu`). */\n label: string;\n href: string;\n /** Optional leading icon. Pass a lucide-react or equivalent element. */\n icon?: ReactNode;\n /** Optional unseen-item count rendered as a pill badge. */\n badgeCount?: number;\n /** Mark the item as the current page (`aria-current='page'`). */\n isActive?: boolean;\n}\n\nexport interface PatientShellProps {\n /** Patient's display name. Used as the avatar fallback by consumers\n * that read the name through a slot; not rendered inside this shell\n * today because the legacy patient chrome carries no profile pill. */\n userName: string;\n /** Optional avatar URL. Reserved for future profile-pill surfaces;\n * no visible effect today. */\n userAvatarSrc?: string;\n /** Flat nav items rendered in the sidebar, in order. */\n menuItems: PatientNavItem[];\n /** URL the \"Logout\" action navigates to — typically `/logout`. */\n logoutHref: string;\n /** Fires when the user toggles fullscreen from the settings menu. */\n onToggleFullscreen?: () => void;\n /** Optional brand logo. Defaults to\n * `<Logo variant=\"monochrome\" size=\"md\" decorative />`. */\n brandLogo?: ReactNode;\n /** Link target for the brand — typically the patient dashboard. */\n brandHref?: string;\n /** Override the accessible name of the `<main>` landmark. */\n mainAriaLabel?: string;\n /**\n * Force the sidebar into a specific mode. Consuming apps typically\n * flip to `'overlay'` on narrow viewports and leave this undefined\n * elsewhere (the sidebar then defaults to `'expanded'`).\n */\n sidebarState?: SidebarMode;\n /** Children render inside the main content region. */\n children: ReactNode;\n}\n\n/* ------------------------------------------------------------------ */\n/* Internals */\n/* ------------------------------------------------------------------ */\n\nfunction formatBadgeCount(count: number): string {\n return count > 99 ? '99+' : String(count);\n}\n\n/**\n * Guard against `javascript:` and other non-navigation schemes before\n * handing the URL to `window.location.assign`. A consuming app that lets\n * attacker-controlled input reach `logoutHref` would otherwise execute\n * script. Allow only relative paths, hash fragments, and `http(s)` URLs.\n */\nfunction isSafeLogoutHref(href: string): boolean {\n if (href.startsWith('/') || href.startsWith('#') || href.startsWith('?')) {\n return true;\n }\n try {\n const url = new URL(href, window.location.origin);\n return url.protocol === 'http:' || url.protocol === 'https:';\n } catch {\n return false;\n }\n}\n\nfunction SettingsMenu({\n logoutHref,\n onToggleFullscreen,\n}: {\n logoutHref: string;\n onToggleFullscreen?: () => void;\n}) {\n const { t } = useTranslation();\n return (\n <DropdownMenu.Root>\n <DropdownMenu.Trigger asChild>\n <IconButton\n icon={<SettingsIcon aria-hidden=\"true\" />}\n aria-label={t('patientShell.settings.triggerAria')}\n tooltip={t('patientShell.settings.triggerAria')}\n data-testid=\"patient-shell-settings-trigger\"\n />\n </DropdownMenu.Trigger>\n <DropdownMenu.Content align=\"end\">\n <DropdownMenu.Item\n startIcon={<Maximize2 aria-hidden=\"true\" />}\n onSelect={onToggleFullscreen}\n data-testid=\"patient-shell-fullscreen\"\n >\n {t('patientShell.settings.fullscreen')}\n </DropdownMenu.Item>\n <DropdownMenu.Separator />\n <DropdownMenu.Item\n startIcon={<LogOut aria-hidden=\"true\" />}\n onSelect={() => {\n if (typeof window === 'undefined') return;\n if (!isSafeLogoutHref(logoutHref)) return;\n window.location.assign(logoutHref);\n }}\n data-testid=\"patient-shell-logout\"\n >\n {t('patientShell.settings.logout')}\n </DropdownMenu.Item>\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n );\n}\n\nfunction PatientSidebarNav({ menuItems }: { menuItems: PatientNavItem[] }) {\n return (\n <SidebarBody>\n {menuItems.map((item) => {\n const badge =\n typeof item.badgeCount === 'number' && item.badgeCount > 0\n ? item.badgeCount\n : undefined;\n return (\n <SidebarItem\n key={item.id}\n href={item.href}\n aria-label={item.label}\n isActive={item.isActive}\n >\n {item.icon ? <SidebarItemIcon>{item.icon}</SidebarItemIcon> : null}\n <SidebarItemLabel>{item.label}</SidebarItemLabel>\n {badge !== undefined ? (\n <SidebarItemBadge>{formatBadgeCount(badge)}</SidebarItemBadge>\n ) : null}\n </SidebarItem>\n );\n })}\n </SidebarBody>\n );\n}\n\n/* ------------------------------------------------------------------ */\n/* Root */\n/* ------------------------------------------------------------------ */\n\nexport const PatientShell = forwardRef<HTMLDivElement, PatientShellProps>(\n (\n {\n menuItems,\n logoutHref,\n onToggleFullscreen,\n brandLogo,\n brandHref = '/',\n mainAriaLabel,\n sidebarState,\n children,\n // `userName` and `userAvatarSrc` are declared on the public API\n // for forward-compatibility (future profile-pill work) — they are\n // intentionally unused today because the legacy patient chrome\n // carries no profile pill.\n userName: _userName,\n userAvatarSrc: _userAvatarSrc,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n // Only wrap children in a nested <ThemeRoot> when the user has\n // explicitly chosen a theme via the hook (e.g., through an in-app\n // toggle). Otherwise we let the outer cascade win — wrapping with\n // the hook's default `resolvedTheme = 'light'` would clobber a\n // consuming app's `<html>` theme class (or Storybook's decorator)\n // for every child rendered inside the shell.\n const { theme: themePref, accessibility, resolvedTheme } = useTheme();\n const hasExplicitOverride =\n themePref !== 'system' || accessibility !== 'system';\n const themeBase = resolvedTheme.startsWith('dark') ? 'dark' : 'light';\n const themeAccessible = resolvedTheme.endsWith('-accessible');\n\n // Narrow-viewport overlay: `HeaderMenuButton` only renders below the\n // `md` breakpoint, and toggling opens the Sidebar's overlay Dialog.\n const [sidebarOpen, setSidebarOpen] = useState(false);\n\n const resolvedLogo = brandLogo ?? (\n <Logo variant=\"monochrome\" size=\"md\" decorative />\n );\n\n const shell = (\n <TooltipProvider>\n <AppFrame\n mainAriaLabel={mainAriaLabel}\n header={\n <Header>\n <HeaderStart>\n <HeaderSkipLink href=\"#main-content\" />\n <HeaderMenuButton onMenuOpen={() => setSidebarOpen(true)} />\n <HeaderBrand\n logo={resolvedLogo}\n href={brandHref}\n aria-label={t('patientShell.brand.homeAria')}\n />\n </HeaderStart>\n <HeaderCenter />\n <HeaderEnd>\n <SettingsMenu\n logoutHref={logoutHref}\n onToggleFullscreen={onToggleFullscreen}\n />\n </HeaderEnd>\n </Header>\n }\n sidebar={\n <Sidebar\n {...(sidebarState !== undefined\n ? { state: sidebarState }\n : { defaultState: 'expanded' as const })}\n open={sidebarOpen}\n onOpenChange={setSidebarOpen}\n aria-label={t('patientShell.sidebar.panelLabel')}\n data-testid=\"patient-shell-sidebar\"\n >\n <PatientSidebarNav menuItems={menuItems} />\n </Sidebar>\n }\n >\n {children}\n </AppFrame>\n </TooltipProvider>\n );\n\n if (!hasExplicitOverride) {\n // Pass-through wrapper preserves the ref contract without altering\n // the token cascade.\n return (\n <div ref={ref as never} className=\"ds:contents\">\n {shell}\n </div>\n );\n }\n\n return (\n <ThemeRoot\n ref={ref}\n theme={themeBase}\n accessible={themeAccessible}\n className=\"ds:contents\"\n >\n {shell}\n </ThemeRoot>\n );\n },\n);\n\nPatientShell.displayName = 'PatientShell';\n"],"names":["__iconNode","Maximize2","createLucideIcon","formatBadgeCount","count","isSafeLogoutHref","href","url","SettingsMenu","logoutHref","onToggleFullscreen","t","useTranslation","jsxs","DropdownMenu","jsx","IconButton","SettingsIcon","LogOut","PatientSidebarNav","menuItems","SidebarBody","item","badge","SidebarItem","SidebarItemIcon","SidebarItemLabel","SidebarItemBadge","PatientShell","forwardRef","brandLogo","brandHref","mainAriaLabel","sidebarState","children","_userName","_userAvatarSrc","ref","themePref","accessibility","resolvedTheme","useTheme","hasExplicitOverride","themeBase","themeAccessible","sidebarOpen","setSidebarOpen","useState","shell","TooltipProvider","AppFrame","Header","HeaderStart","HeaderSkipLink","HeaderMenuButton","HeaderBrand","Logo","HeaderCenter","HeaderEnd","Sidebar","ThemeRoot"],"mappings":"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","x_google_ignoreList":[0]}
|
|
@@ -3,7 +3,7 @@ import { useState as C, useCallback as g, useRef as R, useEffect as h, useMemo a
|
|
|
3
3
|
import * as v from "@radix-ui/react-popover";
|
|
4
4
|
import { c as G } from "./index-D2ZczOXr.js";
|
|
5
5
|
import { useTranslation as J } from "react-i18next";
|
|
6
|
-
import { I as K } from "./icon-button-
|
|
6
|
+
import { I as K } from "./icon-button-DPEqBKBQ.js";
|
|
7
7
|
import { u as Q } from "./registry-C9nwlNyL.js";
|
|
8
8
|
import { X as U } from "./x-CCcI3eJp.js";
|
|
9
9
|
const Y = {
|
|
@@ -294,4 +294,4 @@ export {
|
|
|
294
294
|
ae as P,
|
|
295
295
|
Y as p
|
|
296
296
|
};
|
|
297
|
-
//# sourceMappingURL=popover-
|
|
297
|
+
//# sourceMappingURL=popover-BfHSBEKq.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover-D0slaBB9.js","sources":["../../src/components/popover/popover.agent.ts","../../src/components/popover/popover.tsx"],"sourcesContent":["import type { AgentAdapter } from '../../agent/types';\nimport type { PopoverHandle } from './popover';\n\nexport const popoverAgent: AgentAdapter<PopoverHandle> = {\n id: 'popover',\n capabilities: ['open', 'close'],\n state: {\n isOpen: {\n type: 'boolean',\n description: 'True when the popover is currently open.',\n read: (handle) => handle.getIsOpen(),\n },\n },\n actions: {\n open: {\n safety: 'read',\n description: 'Open the popover.',\n invoke: (handle) => {\n handle.open();\n },\n },\n close: {\n safety: 'read',\n description: 'Close the popover.',\n invoke: (handle) => {\n handle.close();\n },\n },\n },\n domHooks: {\n root: { attr: 'data-component', value: 'popover' },\n instanceId: {\n attr: 'data-component-id',\n sourceProp: 'id',\n description: 'Sourced from the id prop on Popover.Root.',\n },\n },\n};\n","import {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useId,\n useMemo,\n useRef,\n useState,\n type ComponentPropsWithoutRef,\n type HTMLAttributes,\n type ReactNode,\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 { X } from 'lucide-react';\nimport { IconButton } from '../button/icon-button';\nimport { useAgentRegistration } from '../../agent';\nimport { popoverAgent } from './popover.agent';\n\ninterface PopoverA11yContext {\n headingId: string | undefined;\n setHeadingId: (id: string | undefined) => void;\n descriptionId: string | undefined;\n setDescriptionId: (id: string | undefined) => void;\n}\n\nconst A11yContext = createContext<PopoverA11yContext>({\n headingId: undefined,\n setHeadingId: () => {},\n descriptionId: undefined,\n setDescriptionId: () => {},\n});\n\ninterface PopoverHoverContext {\n isHoverMode: boolean;\n clearHoverTimer: () => void;\n closeWithDelay: () => void;\n}\n\nconst HoverContext = createContext<PopoverHoverContext>({\n isHoverMode: false,\n clearHoverTimer: () => {},\n closeWithDelay: () => {},\n});\n\nfunction resolvePhysicalSide(\n logicalSide: 'start' | 'top' | 'end' | 'bottom',\n): 'left' | 'top' | 'right' | 'bottom' {\n if (logicalSide === 'top' || logicalSide === 'bottom') return logicalSide;\n const isRtl =\n typeof document !== 'undefined' && document.documentElement.dir === 'rtl';\n if (logicalSide === 'start') return isRtl ? 'right' : 'left';\n /* logicalSide === 'end' */\n return isRtl ? 'left' : 'right';\n}\n\nconst contentVariants = cva(\n [\n // `--card-border` 32% alpha provides a subtle edge that survives dark\n // without becoming a heavy outline. The previous transparent border\n // relied on the drop-shadow alone, which reads as a faint halo against\n // dark surfaces and lets the popover float as an unbounded blob; the\n // earlier heavy `--border` (grey-800 since WCAG 1.4.11 bump in 67fef8c)\n // overcorrected the other way and made the popover read as a charcoal\n // box. The forced-colors override below upgrades the border to\n // `CanvasText` so HCM still repaints a fully visible edge.\n 'ds:relative ds:bg-[var(--popover)] ds:border ds:border-[color:var(--card-border)] ds:rounded-[var(--radius-md)]',\n 'ds:p-[var(--spacing-md)]',\n 'ds:shadow-[var(--shadow-lg)]',\n 'ds:z-[var(--z-popover)]',\n 'ds:text-[var(--popover-foreground)] ds:text-[length:var(--font-size-sm)]',\n 'ds:break-words',\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:data-[side=bottom]:slide-in-from-top-2 ds:data-[side=left]:slide-in-from-right-2',\n 'ds:data-[side=right]:slide-in-from-left-2 ds:data-[side=top]:slide-in-from-bottom-2',\n 'ds:motion-reduce:transition-none ds:motion-reduce:animate-none',\n 'ds:forced-colors:border-[CanvasText]',\n 'ds:focus-visible:outline-none',\n ].join(' '),\n {\n variants: {\n size: {\n sm: 'ds:max-w-[var(--popover-size-sm)]',\n md: 'ds:max-w-[var(--popover-size-md)]',\n lg: 'ds:max-w-[var(--popover-size-lg)]',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n },\n);\n\n// Curated agent-readiness handle — see popover.agent.ts.\nexport interface PopoverHandle {\n getIsOpen: () => boolean;\n open: () => void;\n close: () => void;\n}\n\nexport interface PopoverRootProps extends ComponentPropsWithoutRef<\n typeof RadixPopover.Root\n> {\n openOn?: 'click' | 'hover' | 'hover-or-click';\n /** Opaque instance id — forwarded to Popover.Content as `data-component-id`. */\n id?: string;\n children: ReactNode;\n}\n\nconst PopoverIdContext = createContext<string | undefined>(undefined);\n\nfunction PopoverRoot({\n openOn = 'click',\n children,\n id,\n open: controlledOpen,\n onOpenChange,\n defaultOpen,\n modal,\n}: PopoverRootProps) {\n const [internalOpen, setInternalOpen] = useState(defaultOpen ?? false);\n const isControlled = controlledOpen !== undefined;\n const isOpen = isControlled ? controlledOpen : internalOpen;\n\n const handleOpenChange = useCallback(\n (nextOpen: boolean) => {\n if (!isControlled) setInternalOpen(nextOpen);\n onOpenChange?.(nextOpen);\n },\n [isControlled, onOpenChange],\n );\n\n const hoverTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const isHoverMode = openOn === 'hover' || openOn === 'hover-or-click';\n\n const clearHoverTimer = useCallback(() => {\n if (hoverTimerRef.current) {\n clearTimeout(hoverTimerRef.current);\n hoverTimerRef.current = null;\n }\n }, []);\n\n const openWithDelay = useCallback(() => {\n clearHoverTimer();\n hoverTimerRef.current = setTimeout(() => {\n handleOpenChange(true);\n }, 300);\n }, [clearHoverTimer, handleOpenChange]);\n\n const closeWithDelay = useCallback(() => {\n clearHoverTimer();\n hoverTimerRef.current = setTimeout(() => {\n handleOpenChange(false);\n }, 300);\n }, [clearHoverTimer, handleOpenChange]);\n\n useEffect(() => {\n return () => clearHoverTimer();\n }, [clearHoverTimer]);\n\n // Agent handle.\n const openRef = useRef(isOpen);\n useEffect(() => {\n openRef.current = isOpen;\n }, [isOpen]);\n\n const agentHandle = useMemo<PopoverHandle>(\n () => ({\n getIsOpen: () => openRef.current,\n open: () => handleOpenChange(true),\n close: () => handleOpenChange(false),\n }),\n [handleOpenChange],\n );\n useAgentRegistration(popoverAgent, agentHandle, id);\n\n /* a11y context state */\n const [headingId, setHeadingId] = useState<string | undefined>(undefined);\n const [descriptionId, setDescriptionId] = useState<string | undefined>(\n undefined,\n );\n\n const hoverHandlers = isHoverMode\n ? {\n onMouseEnter: openWithDelay,\n onMouseLeave: closeWithDelay,\n onFocus: () => {\n clearHoverTimer();\n handleOpenChange(true);\n },\n onBlur: closeWithDelay,\n }\n : {};\n\n return (\n <PopoverIdContext.Provider value={id}>\n <A11yContext.Provider\n value={{ headingId, setHeadingId, descriptionId, setDescriptionId }}\n >\n <HoverContext.Provider\n value={{ isHoverMode, clearHoverTimer, closeWithDelay }}\n >\n <RadixPopover.Root\n open={isOpen}\n onOpenChange={handleOpenChange}\n modal={modal}\n >\n {isHoverMode ? (\n <span className=\"ds:inline-flex\" {...hoverHandlers}>\n {children}\n </span>\n ) : (\n children\n )}\n </RadixPopover.Root>\n </HoverContext.Provider>\n </A11yContext.Provider>\n </PopoverIdContext.Provider>\n );\n}\nPopoverRoot.displayName = 'Popover.Root';\n\nconst PopoverTrigger = forwardRef<\n HTMLButtonElement,\n ComponentPropsWithoutRef<typeof RadixPopover.Trigger>\n>(({ children, ...props }, ref) => (\n <RadixPopover.Trigger ref={ref} {...props}>\n {children}\n </RadixPopover.Trigger>\n));\nPopoverTrigger.displayName = 'Popover.Trigger';\n\nexport interface PopoverContentProps\n extends\n Omit<\n ComponentPropsWithoutRef<typeof RadixPopover.Content>,\n 'side' | 'align'\n >,\n VariantProps<typeof contentVariants> {\n side?: 'start' | 'top' | 'end' | 'bottom';\n align?: 'start' | 'center' | 'end';\n size?: 'sm' | 'md' | 'lg';\n showArrow?: boolean;\n className?: string;\n children: ReactNode;\n}\n\nconst PopoverContent = forwardRef<HTMLDivElement, PopoverContentProps>(\n (\n {\n side = 'bottom',\n align = 'center',\n size = 'md',\n showArrow = true,\n className,\n children,\n ...props\n },\n ref,\n ) => {\n const { headingId, descriptionId } = useContext(A11yContext);\n const instanceId = useContext(PopoverIdContext);\n const {\n isHoverMode: isHover,\n clearHoverTimer: cancelTimer,\n closeWithDelay: delayClose,\n } = useContext(HoverContext);\n const physicalSide = resolvePhysicalSide(side);\n\n const contentHoverHandlers = isHover\n ? {\n onMouseEnter: cancelTimer,\n onMouseLeave: delayClose,\n onFocus: cancelTimer,\n onBlur: delayClose,\n }\n : {};\n\n return (\n <RadixPopover.Portal>\n <RadixPopover.Content\n ref={ref}\n side={physicalSide}\n align={align}\n sideOffset={8}\n collisionPadding={8}\n aria-labelledby={headingId}\n aria-describedby={descriptionId}\n className={contentVariants({ size, className })}\n data-component=\"popover\"\n data-component-id={instanceId}\n {...contentHoverHandlers}\n {...props}\n >\n {children}\n {showArrow && (\n <RadixPopover.Arrow\n width={12}\n height={6}\n className=\"ds:fill-[var(--popover)]\"\n />\n )}\n </RadixPopover.Content>\n </RadixPopover.Portal>\n );\n },\n);\nPopoverContent.displayName = 'Popover.Content';\n\nconst PopoverClose = forwardRef<HTMLButtonElement, { className?: string }>(\n ({ className }, ref) => {\n const { t } = useTranslation();\n\n return (\n <div\n className={[\n 'ds:absolute ds:top-[var(--spacing-sm)] ds:end-[var(--spacing-sm)]',\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n <RadixPopover.Close asChild>\n <IconButton\n ref={ref}\n icon={<X />}\n intent=\"ghost\"\n size=\"sm\"\n aria-label={t('common.close', 'Close')}\n />\n </RadixPopover.Close>\n </div>\n );\n },\n);\nPopoverClose.displayName = 'Popover.Close';\n\ninterface PopoverHeadingProps extends HTMLAttributes<HTMLHeadingElement> {\n as?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n}\n\nconst PopoverHeading = forwardRef<HTMLHeadingElement, PopoverHeadingProps>(\n ({ as: Tag = 'h3', className, ...props }, ref) => {\n const generatedId = useId();\n const { setHeadingId } = useContext(A11yContext);\n\n useEffect(() => {\n setHeadingId(generatedId);\n return () => setHeadingId(undefined);\n }, [generatedId, setHeadingId]);\n\n return (\n <Tag\n ref={ref}\n id={generatedId}\n className={[\n 'type-title-item ds:leading-snug ds:break-words',\n 'ds:pe-[var(--spacing-xl)]',\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n {...props}\n />\n );\n },\n);\nPopoverHeading.displayName = 'Popover.Heading';\n\nconst PopoverDescription = forwardRef<\n HTMLParagraphElement,\n HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n const generatedId = useId();\n const { setDescriptionId } = useContext(A11yContext);\n\n useEffect(() => {\n setDescriptionId(generatedId);\n return () => setDescriptionId(undefined);\n }, [generatedId, setDescriptionId]);\n\n return (\n <p\n ref={ref}\n id={generatedId}\n className={[\n 'ds:text-[var(--muted-foreground)] type-body-sm ds:mt-[var(--spacing-xs)]',\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n {...props}\n />\n );\n});\nPopoverDescription.displayName = 'Popover.Description';\n\nexport const Popover = Object.assign(PopoverRoot, {\n Root: PopoverRoot,\n Trigger: PopoverTrigger,\n Content: PopoverContent,\n Close: PopoverClose,\n Heading: PopoverHeading,\n Description: PopoverDescription,\n});\n\nexport type { PopoverRootProps as PopoverProps, PopoverHeadingProps };\n"],"names":["popoverAgent","handle","A11yContext","createContext","HoverContext","resolvePhysicalSide","logicalSide","isRtl","contentVariants","cva","PopoverIdContext","PopoverRoot","openOn","children","id","controlledOpen","onOpenChange","defaultOpen","modal","internalOpen","setInternalOpen","useState","isControlled","isOpen","handleOpenChange","useCallback","nextOpen","hoverTimerRef","useRef","isHoverMode","clearHoverTimer","openWithDelay","closeWithDelay","useEffect","openRef","agentHandle","useMemo","useAgentRegistration","headingId","setHeadingId","descriptionId","setDescriptionId","hoverHandlers","jsx","RadixPopover","PopoverTrigger","forwardRef","props","ref","PopoverContent","side","align","size","showArrow","className","useContext","instanceId","isHover","cancelTimer","delayClose","physicalSide","contentHoverHandlers","jsxs","PopoverClose","t","useTranslation","IconButton","X","PopoverHeading","Tag","generatedId","useId","PopoverDescription","Popover"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"popover-BfHSBEKq.js","sources":["../../src/components/popover/popover.agent.ts","../../src/components/popover/popover.tsx"],"sourcesContent":["import type { AgentAdapter } from '../../agent/types';\nimport type { PopoverHandle } from './popover';\n\nexport const popoverAgent: AgentAdapter<PopoverHandle> = {\n id: 'popover',\n capabilities: ['open', 'close'],\n state: {\n isOpen: {\n type: 'boolean',\n description: 'True when the popover is currently open.',\n read: (handle) => handle.getIsOpen(),\n },\n },\n actions: {\n open: {\n safety: 'read',\n description: 'Open the popover.',\n invoke: (handle) => {\n handle.open();\n },\n },\n close: {\n safety: 'read',\n description: 'Close the popover.',\n invoke: (handle) => {\n handle.close();\n },\n },\n },\n domHooks: {\n root: { attr: 'data-component', value: 'popover' },\n instanceId: {\n attr: 'data-component-id',\n sourceProp: 'id',\n description: 'Sourced from the id prop on Popover.Root.',\n },\n },\n};\n","import {\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useId,\n useMemo,\n useRef,\n useState,\n type ComponentPropsWithoutRef,\n type HTMLAttributes,\n type ReactNode,\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 { X } from 'lucide-react';\nimport { IconButton } from '../button/icon-button';\nimport { useAgentRegistration } from '../../agent';\nimport { popoverAgent } from './popover.agent';\n\ninterface PopoverA11yContext {\n headingId: string | undefined;\n setHeadingId: (id: string | undefined) => void;\n descriptionId: string | undefined;\n setDescriptionId: (id: string | undefined) => void;\n}\n\nconst A11yContext = createContext<PopoverA11yContext>({\n headingId: undefined,\n setHeadingId: () => {},\n descriptionId: undefined,\n setDescriptionId: () => {},\n});\n\ninterface PopoverHoverContext {\n isHoverMode: boolean;\n clearHoverTimer: () => void;\n closeWithDelay: () => void;\n}\n\nconst HoverContext = createContext<PopoverHoverContext>({\n isHoverMode: false,\n clearHoverTimer: () => {},\n closeWithDelay: () => {},\n});\n\nfunction resolvePhysicalSide(\n logicalSide: 'start' | 'top' | 'end' | 'bottom',\n): 'left' | 'top' | 'right' | 'bottom' {\n if (logicalSide === 'top' || logicalSide === 'bottom') return logicalSide;\n const isRtl =\n typeof document !== 'undefined' && document.documentElement.dir === 'rtl';\n if (logicalSide === 'start') return isRtl ? 'right' : 'left';\n /* logicalSide === 'end' */\n return isRtl ? 'left' : 'right';\n}\n\nconst contentVariants = cva(\n [\n // `--card-border` 32% alpha provides a subtle edge that survives dark\n // without becoming a heavy outline. The previous transparent border\n // relied on the drop-shadow alone, which reads as a faint halo against\n // dark surfaces and lets the popover float as an unbounded blob; the\n // earlier heavy `--border` (grey-800 since WCAG 1.4.11 bump in 67fef8c)\n // overcorrected the other way and made the popover read as a charcoal\n // box. The forced-colors override below upgrades the border to\n // `CanvasText` so HCM still repaints a fully visible edge.\n 'ds:relative ds:bg-[var(--popover)] ds:border ds:border-[color:var(--card-border)] ds:rounded-[var(--radius-md)]',\n 'ds:p-[var(--spacing-md)]',\n 'ds:shadow-[var(--shadow-lg)]',\n 'ds:z-[var(--z-popover)]',\n 'ds:text-[var(--popover-foreground)] ds:text-[length:var(--font-size-sm)]',\n 'ds:break-words',\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:data-[side=bottom]:slide-in-from-top-2 ds:data-[side=left]:slide-in-from-right-2',\n 'ds:data-[side=right]:slide-in-from-left-2 ds:data-[side=top]:slide-in-from-bottom-2',\n 'ds:motion-reduce:transition-none ds:motion-reduce:animate-none',\n 'ds:forced-colors:border-[CanvasText]',\n 'ds:focus-visible:outline-none',\n ].join(' '),\n {\n variants: {\n size: {\n sm: 'ds:max-w-[var(--popover-size-sm)]',\n md: 'ds:max-w-[var(--popover-size-md)]',\n lg: 'ds:max-w-[var(--popover-size-lg)]',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n },\n);\n\n// Curated agent-readiness handle — see popover.agent.ts.\nexport interface PopoverHandle {\n getIsOpen: () => boolean;\n open: () => void;\n close: () => void;\n}\n\nexport interface PopoverRootProps extends ComponentPropsWithoutRef<\n typeof RadixPopover.Root\n> {\n openOn?: 'click' | 'hover' | 'hover-or-click';\n /** Opaque instance id — forwarded to Popover.Content as `data-component-id`. */\n id?: string;\n children: ReactNode;\n}\n\nconst PopoverIdContext = createContext<string | undefined>(undefined);\n\nfunction PopoverRoot({\n openOn = 'click',\n children,\n id,\n open: controlledOpen,\n onOpenChange,\n defaultOpen,\n modal,\n}: PopoverRootProps) {\n const [internalOpen, setInternalOpen] = useState(defaultOpen ?? false);\n const isControlled = controlledOpen !== undefined;\n const isOpen = isControlled ? controlledOpen : internalOpen;\n\n const handleOpenChange = useCallback(\n (nextOpen: boolean) => {\n if (!isControlled) setInternalOpen(nextOpen);\n onOpenChange?.(nextOpen);\n },\n [isControlled, onOpenChange],\n );\n\n const hoverTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const isHoverMode = openOn === 'hover' || openOn === 'hover-or-click';\n\n const clearHoverTimer = useCallback(() => {\n if (hoverTimerRef.current) {\n clearTimeout(hoverTimerRef.current);\n hoverTimerRef.current = null;\n }\n }, []);\n\n const openWithDelay = useCallback(() => {\n clearHoverTimer();\n hoverTimerRef.current = setTimeout(() => {\n handleOpenChange(true);\n }, 300);\n }, [clearHoverTimer, handleOpenChange]);\n\n const closeWithDelay = useCallback(() => {\n clearHoverTimer();\n hoverTimerRef.current = setTimeout(() => {\n handleOpenChange(false);\n }, 300);\n }, [clearHoverTimer, handleOpenChange]);\n\n useEffect(() => {\n return () => clearHoverTimer();\n }, [clearHoverTimer]);\n\n // Agent handle.\n const openRef = useRef(isOpen);\n useEffect(() => {\n openRef.current = isOpen;\n }, [isOpen]);\n\n const agentHandle = useMemo<PopoverHandle>(\n () => ({\n getIsOpen: () => openRef.current,\n open: () => handleOpenChange(true),\n close: () => handleOpenChange(false),\n }),\n [handleOpenChange],\n );\n useAgentRegistration(popoverAgent, agentHandle, id);\n\n /* a11y context state */\n const [headingId, setHeadingId] = useState<string | undefined>(undefined);\n const [descriptionId, setDescriptionId] = useState<string | undefined>(\n undefined,\n );\n\n const hoverHandlers = isHoverMode\n ? {\n onMouseEnter: openWithDelay,\n onMouseLeave: closeWithDelay,\n onFocus: () => {\n clearHoverTimer();\n handleOpenChange(true);\n },\n onBlur: closeWithDelay,\n }\n : {};\n\n return (\n <PopoverIdContext.Provider value={id}>\n <A11yContext.Provider\n value={{ headingId, setHeadingId, descriptionId, setDescriptionId }}\n >\n <HoverContext.Provider\n value={{ isHoverMode, clearHoverTimer, closeWithDelay }}\n >\n <RadixPopover.Root\n open={isOpen}\n onOpenChange={handleOpenChange}\n modal={modal}\n >\n {isHoverMode ? (\n <span className=\"ds:inline-flex\" {...hoverHandlers}>\n {children}\n </span>\n ) : (\n children\n )}\n </RadixPopover.Root>\n </HoverContext.Provider>\n </A11yContext.Provider>\n </PopoverIdContext.Provider>\n );\n}\nPopoverRoot.displayName = 'Popover.Root';\n\nconst PopoverTrigger = forwardRef<\n HTMLButtonElement,\n ComponentPropsWithoutRef<typeof RadixPopover.Trigger>\n>(({ children, ...props }, ref) => (\n <RadixPopover.Trigger ref={ref} {...props}>\n {children}\n </RadixPopover.Trigger>\n));\nPopoverTrigger.displayName = 'Popover.Trigger';\n\nexport interface PopoverContentProps\n extends\n Omit<\n ComponentPropsWithoutRef<typeof RadixPopover.Content>,\n 'side' | 'align'\n >,\n VariantProps<typeof contentVariants> {\n side?: 'start' | 'top' | 'end' | 'bottom';\n align?: 'start' | 'center' | 'end';\n size?: 'sm' | 'md' | 'lg';\n showArrow?: boolean;\n className?: string;\n children: ReactNode;\n}\n\nconst PopoverContent = forwardRef<HTMLDivElement, PopoverContentProps>(\n (\n {\n side = 'bottom',\n align = 'center',\n size = 'md',\n showArrow = true,\n className,\n children,\n ...props\n },\n ref,\n ) => {\n const { headingId, descriptionId } = useContext(A11yContext);\n const instanceId = useContext(PopoverIdContext);\n const {\n isHoverMode: isHover,\n clearHoverTimer: cancelTimer,\n closeWithDelay: delayClose,\n } = useContext(HoverContext);\n const physicalSide = resolvePhysicalSide(side);\n\n const contentHoverHandlers = isHover\n ? {\n onMouseEnter: cancelTimer,\n onMouseLeave: delayClose,\n onFocus: cancelTimer,\n onBlur: delayClose,\n }\n : {};\n\n return (\n <RadixPopover.Portal>\n <RadixPopover.Content\n ref={ref}\n side={physicalSide}\n align={align}\n sideOffset={8}\n collisionPadding={8}\n aria-labelledby={headingId}\n aria-describedby={descriptionId}\n className={contentVariants({ size, className })}\n data-component=\"popover\"\n data-component-id={instanceId}\n {...contentHoverHandlers}\n {...props}\n >\n {children}\n {showArrow && (\n <RadixPopover.Arrow\n width={12}\n height={6}\n className=\"ds:fill-[var(--popover)]\"\n />\n )}\n </RadixPopover.Content>\n </RadixPopover.Portal>\n );\n },\n);\nPopoverContent.displayName = 'Popover.Content';\n\nconst PopoverClose = forwardRef<HTMLButtonElement, { className?: string }>(\n ({ className }, ref) => {\n const { t } = useTranslation();\n\n return (\n <div\n className={[\n 'ds:absolute ds:top-[var(--spacing-sm)] ds:end-[var(--spacing-sm)]',\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n <RadixPopover.Close asChild>\n <IconButton\n ref={ref}\n icon={<X />}\n intent=\"ghost\"\n size=\"sm\"\n aria-label={t('common.close', 'Close')}\n />\n </RadixPopover.Close>\n </div>\n );\n },\n);\nPopoverClose.displayName = 'Popover.Close';\n\ninterface PopoverHeadingProps extends HTMLAttributes<HTMLHeadingElement> {\n as?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n}\n\nconst PopoverHeading = forwardRef<HTMLHeadingElement, PopoverHeadingProps>(\n ({ as: Tag = 'h3', className, ...props }, ref) => {\n const generatedId = useId();\n const { setHeadingId } = useContext(A11yContext);\n\n useEffect(() => {\n setHeadingId(generatedId);\n return () => setHeadingId(undefined);\n }, [generatedId, setHeadingId]);\n\n return (\n <Tag\n ref={ref}\n id={generatedId}\n className={[\n 'type-title-item ds:leading-snug ds:break-words',\n 'ds:pe-[var(--spacing-xl)]',\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n {...props}\n />\n );\n },\n);\nPopoverHeading.displayName = 'Popover.Heading';\n\nconst PopoverDescription = forwardRef<\n HTMLParagraphElement,\n HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n const generatedId = useId();\n const { setDescriptionId } = useContext(A11yContext);\n\n useEffect(() => {\n setDescriptionId(generatedId);\n return () => setDescriptionId(undefined);\n }, [generatedId, setDescriptionId]);\n\n return (\n <p\n ref={ref}\n id={generatedId}\n className={[\n 'ds:text-[var(--muted-foreground)] type-body-sm ds:mt-[var(--spacing-xs)]',\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n {...props}\n />\n );\n});\nPopoverDescription.displayName = 'Popover.Description';\n\nexport const Popover = Object.assign(PopoverRoot, {\n Root: PopoverRoot,\n Trigger: PopoverTrigger,\n Content: PopoverContent,\n Close: PopoverClose,\n Heading: PopoverHeading,\n Description: PopoverDescription,\n});\n\nexport type { PopoverRootProps as PopoverProps, PopoverHeadingProps };\n"],"names":["popoverAgent","handle","A11yContext","createContext","HoverContext","resolvePhysicalSide","logicalSide","isRtl","contentVariants","cva","PopoverIdContext","PopoverRoot","openOn","children","id","controlledOpen","onOpenChange","defaultOpen","modal","internalOpen","setInternalOpen","useState","isControlled","isOpen","handleOpenChange","useCallback","nextOpen","hoverTimerRef","useRef","isHoverMode","clearHoverTimer","openWithDelay","closeWithDelay","useEffect","openRef","agentHandle","useMemo","useAgentRegistration","headingId","setHeadingId","descriptionId","setDescriptionId","hoverHandlers","jsx","RadixPopover","PopoverTrigger","forwardRef","props","ref","PopoverContent","side","align","size","showArrow","className","useContext","instanceId","isHover","cancelTimer","delayClose","physicalSide","contentHoverHandlers","jsxs","PopoverClose","t","useTranslation","IconButton","X","PopoverHeading","Tag","generatedId","useId","PopoverDescription","Popover"],"mappings":"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"}
|
|
@@ -3,7 +3,7 @@ import { forwardRef as q, useState as G, useCallback as g, useRef as L, useImper
|
|
|
3
3
|
import { useTranslation as V } from "react-i18next";
|
|
4
4
|
import * as i from "@radix-ui/react-dialog";
|
|
5
5
|
import { B as u } from "./button-DD_0Xdmr.js";
|
|
6
|
-
import { I as W } from "./icon-button-
|
|
6
|
+
import { I as W } from "./icon-button-DPEqBKBQ.js";
|
|
7
7
|
import { L as X } from "./logo-_Z-jLq80.js";
|
|
8
8
|
import { u as Y } from "./registry-C9nwlNyL.js";
|
|
9
9
|
import { E as h } from "./eye-off-xEXDAh5z.js";
|
|
@@ -190,4 +190,4 @@ export {
|
|
|
190
190
|
ee as P,
|
|
191
191
|
$ as p
|
|
192
192
|
};
|
|
193
|
-
//# sourceMappingURL=privacy-lock-
|
|
193
|
+
//# sourceMappingURL=privacy-lock-C6Ra5m3p.js.map
|