@alfadocs/ui-kit-debug 0.70.0 → 0.71.0

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

@@ -0,0 +1 @@
+{"version":3,"file":"notification-tray-BmUlCx3g.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', 'navigate'],\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      idempotent: true,\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      idempotent: true,\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      argsSchema: {\n        type: 'object',\n        properties: { id: { type: 'string' } },\n        required: ['id'],\n      },\n      idempotent: true,\n      errors: ['No notification matches the given id.'],\n      examples: [{ args: { id: 'notif-1' } }],\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      argsSchema: {\n        type: 'object',\n        properties: { id: { type: 'string' } },\n        required: ['id'],\n      },\n      idempotent: true,\n      errors: ['No notification matches the given id.'],\n      examples: [{ args: { id: 'notif-1' } }],\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      argsSchema: {\n        type: 'object',\n        properties: { id: { type: 'string' } },\n        required: ['id'],\n      },\n      idempotent: true,\n      errors: ['No notification matches the given id.'],\n      examples: [{ args: { id: 'notif-1' } }],\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    mark_all_read: {\n      safety: 'write',\n      idempotent: true,\n      descriptionKey: 'ui.agent.notificationTray.actions.markAllRead',\n      description: 'Request the host to mark every notification as read.',\n      invoke: (handle) => {\n        handle.markAllRead();\n      },\n    },\n    view_all: {\n      safety: 'read',\n      idempotent: true,\n      descriptionKey: 'ui.agent.notificationTray.actions.viewAll',\n      description: 'Navigate to the full notification list.',\n      invoke: (handle) => {\n        handle.viewAll();\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  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 { useIsomorphicLayoutEffect } from '../../hooks/use-isomorphic-layout-effect';\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 { Counter } from '../counter/counter';\nimport { ScrollArea } from '../scroll-area/scroll-area';\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  /** Request the host to mark every notification as read (mirrors onMarkAllRead). */\n  markAllRead: () => void;\n  /** Navigate to the full notification list (mirrors onViewAll). */\n  viewAll: () => 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\n// The unread overlay is the kit `Counter` (variant `notification`, size\n// `md`) — a single source of truth for the red count badge. This tray only\n// owns the *placement*: anchored to the trigger's top-end corner, nudged\n// outward so the bell icon isn't covered.\nconst badgeOverlay =\n  'ds:absolute ds:-top-[var(--spacing-xs)] ds:-end-[var(--spacing-xs)] ds:pointer-events-none';\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    useIsomorphicLayoutEffect(() => {\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        markAllRead: () => onMarkAllRead?.(),\n        viewAll: () => onViewAll?.(),\n      }),\n      [\n        handleOpenChange,\n        onItemClick,\n        onMarkRead,\n        onDismiss,\n        onMarkAllRead,\n        onViewAll,\n      ],\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            <Counter\n              variant=\"notification\"\n              size=\"md\"\n              aria-hidden=\"true\"\n              data-testid=\"notification-tray-badge\"\n              className={badgeOverlay}\n            >\n              {badgeLabel}\n            </Counter>\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              {/* Below `sm` the panel is a near-full-screen sheet (see\n                  `panelVariants`) and the list expands to fill the remaining\n                  space with `flex-1`. Above `sm` the list caps at the\n                  `--notification-tray-max-block-size` custom property so the\n                  popover stays compact. ScrollArea owns the overflow + the\n                  token-styled 8px overlay scrollbar. */}\n              <ScrollArea\n                orientation=\"vertical\"\n                className=\"ds:flex-1 ds:sm:flex-none ds:sm:[max-block-size:var(--notification-tray-max-block-size,24rem)]\"\n              >\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                  className=\"ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:pt-[var(--spacing-xs)]\"\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              </ScrollArea>\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","badgeOverlay","formatBadgeCount","count","overflowLabel","SkeletonRow","jsxs","jsx","Skeleton","EmptyPanel","useTranslation","NotificationTray","forwardRef","id","items","unseenCount","open","onOpenChange","onItemClick","onDismiss","onMarkRead","onMarkAllRead","loading","maxVisible","viewAllLabel","onViewAll","align","side","size","className","rest","ref","t","isOpenRaw","handleOpenChange","useControllableState","isOpen","displayed","setDisplayed","useState","item","animationDurationMs","useCallback","raw","trimmed","n","useIsomorphicLayoutEffect","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","Counter","Button","Separator","ScrollArea","Fragment","leaving","NotificationCard"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/_chunks/{operator-hero-CR0Rqh4-.js → operator-hero-BO8TqzX2.js}

@@ -8,7 +8,7 @@ import { C as T } from "./card-DPmk26CL.js";
 import { R as B } from "./rating-BRD7O74e.js";
 import { u as F } from "./use-isomorphic-layout-effect-BGfaCOP1.js";
 import { u as K } from "./registry-DvAUVLHh.js";
-import { c as S } from "./entity-card-9_62gY7l.js";
+import { b as S } from "./entity-card-DmrgYSEX.js";
 const V = {
   id: "operator-hero",
   // Purely observable hero region — no interactive affordances and no
@@ -199,4 +199,4 @@ export {
   M as O,
   V as o
 };
-//# sourceMappingURL=operator-hero-CR0Rqh4-.js.map
+//# sourceMappingURL=operator-hero-BO8TqzX2.js.map

package/dist/_chunks/{operator-hero-CR0Rqh4-.js.map → operator-hero-BO8TqzX2.js.map}

@@ -1 +1 @@
-{"version":3,"file":"operator-hero-CR0Rqh4-.js","sources":["../../src/components/operator-hero/operator-hero.agent.ts","../../src/components/operator-hero/operator-hero.tsx"],"sourcesContent":["import type { AgentAdapter } from '../../agent/types';\nimport type { OperatorHeroHandle } from './operator-hero';\n\nexport const operatorHeroAgent: AgentAdapter<OperatorHeroHandle> = {\n  id: 'operator-hero',\n  // Purely observable hero region — no interactive affordances and no\n  // imperative actions on the handle (getName / getHasColor are read-only\n  // projections). The previous `view_change` capability had no backing\n  // action and is removed.\n  capabilities: [],\n  state: {\n    name: {\n      type: 'string',\n      descriptionKey: 'ui.agent.operatorHero.state.name',\n      description: 'Operator display name currently rendered.',\n      read: (handle) => handle.getName(),\n    },\n    hasColor: {\n      type: 'boolean',\n      descriptionKey: 'ui.agent.operatorHero.state.hasColor',\n      description:\n        'Whether a calendar-colour identity dot is rendered. Structural flag only — never the colour id or any PHI.',\n      read: (handle) => handle.getHasColor(),\n    },\n  },\n  actions: {},\n  domHooks: {\n    root: {\n      attr: 'data-component',\n      value: 'operator-hero',\n      description: 'Marks the OperatorHero root region.',\n    },\n    instanceId: {\n      attr: 'data-component-id',\n      sourceProp: 'id',\n      description: 'Sourced from the id prop.',\n    },\n  },\n};\n","import {\n  forwardRef,\n  useId,\n  useRef,\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { Avatar } from '../avatar/avatar';\nimport { Badge } from '../badge/badge';\nimport { Card } from '../card/card';\nimport { Rating } from '../rating/rating';\nimport { colorIdToToken } from '../_shared/entity-card';\nimport { useIsomorphicLayoutEffect } from '../../hooks/use-isomorphic-layout-effect';\nimport { useAgentRegistration } from '../../agent/registry';\nimport { operatorHeroAgent } from './operator-hero.agent';\n\n/* -------------------------------------------------------------------- */\n/* OperatorHero                                                           */\n/*                                                                        */\n/* The operator-page counterpart to the consumer-side `<PracticeHero>`   */\n/* / `<PracticeProfileHero>` pattern. Differences from the practice      */\n/* hero (per the spec):                                                  */\n/*                                                                        */\n/*   - Avatar instead of a full hero image background                   */\n/*   - Ratings + reviews summary rendered inline                        */\n/*   - Slightly shorter vertically — no cover strip, denser padding     */\n/*                                                                        */\n/* Use case: individual operator profile page (`/dentista/<slug>/        */\n/* operatori/<name>`), pair with `<ContactProfileCard>` below to fill   */\n/* in the operator's contact + profession info.                          */\n/* -------------------------------------------------------------------- */\n\n/* -------------------------------------------------------------------- */\n/* CVA                                                                    */\n/* -------------------------------------------------------------------- */\n\nconst rootVariants = cva('ds:w-full ds:text-[color:var(--foreground)]', {\n  variants: {\n    // Density toggle. Default `comfortable` matches the practice hero's\n    // visual weight minus the cover strip. `compact` is for embedded\n    // surfaces (booking aside, ROI Dashboard practice panel) where the\n    // hero needs to fit in <12rem vertical.\n    density: {\n      comfortable: '',\n      compact: '',\n    },\n    // Matches the kit's other `surface` props (Booking, ReviewsPanel,\n    // ContactProfileCard). `'elevated'` wraps in `<Card>`.\n    surface: {\n      flat: '',\n      elevated: '',\n    },\n  },\n  defaultVariants: {\n    density: 'comfortable',\n    surface: 'elevated',\n  },\n});\n\n/* -------------------------------------------------------------------- */\n/* Public types                                                           */\n/* -------------------------------------------------------------------- */\n\nexport interface OperatorHeroBadge {\n  /** Display key — i18n is up to the consumer. */\n  key: string;\n  /** Display label. */\n  label: string;\n  /** Badge variant — falls back to `neutral`. */\n  variant?: 'neutral' | 'info' | 'success' | 'warning' | 'error';\n}\n\nexport interface OperatorHeroRating {\n  /** Mean rating, 0–5. */\n  value: number;\n  /** Total number of reviews. */\n  count: number;\n}\n\nexport interface OperatorHeroHandle {\n  getName: () => string;\n  /** Structural flag — whether a calendar-colour dot is rendered. No PHI. */\n  getHasColor: () => boolean;\n}\n\nexport interface OperatorHeroProps extends Omit<\n  ComponentPropsWithoutRef<'div'>,\n  'aria-label' | 'children'\n> {\n  /** Operator's display name. Rendered as the H1 heading. */\n  name: string;\n  /**\n   * Optional calendar-colour identity for the operator. AlfaDocs assigns each\n   * operator a numeric colour id; when present, a small colour dot is rendered\n   * next to the name, tinted via `colorIdToToken(colorId)` (a `var(--…)` palette\n   * token — never a literal). The id itself is a structural identifier, not PHI.\n   */\n  colorId?: string;\n  /** Specialty / tagline subtitle (e.g. \"Dermatologa · 12 anni di esperienza\"). */\n  tagline?: string;\n  /**\n   * Optional photo / avatar URL. The kit always renders an `<Avatar>` —\n   * when `imageUrl` is missing the avatar falls back to initials.\n   */\n  imageUrl?: string;\n  /** Rating summary — when present, renders a Rating + numeric breakdown line. */\n  rating?: OperatorHeroRating;\n  /**\n   * Optional badge row beneath the rating. Use sparingly — 1–3 chips\n   * suit the hero's density; longer lists belong in `<ContactProfileCard>`.\n   */\n  badges?: OperatorHeroBadge[];\n\n  /* ----- Slots ----- */\n\n  /**\n   * Rendered at the inline-end of the heading row (right side on LTR).\n   * Use for a \"Book with this operator\" `<Button>` or a \"Back to\n   * practice\" link.\n   */\n  actionSlot?: ReactNode;\n\n  /* ----- Styling ----- */\n\n  /**\n   * `comfortable` (default) — matches the practice hero's visual\n   * weight minus the cover strip. `compact` halves the vertical\n   * padding for embedded surfaces.\n   */\n  density?: 'comfortable' | 'compact';\n  /**\n   * `elevated` (default) wraps in `<Card variant=\"elevated\">`. `flat`\n   * drops the Card — use inside another card / sheet.\n   */\n  surface?: 'flat' | 'elevated';\n\n  /* ----- a11y ----- */\n\n  'aria-label'?: string;\n  id?: string;\n}\n\n/* -------------------------------------------------------------------- */\n/* Component                                                              */\n/* -------------------------------------------------------------------- */\n\nexport const OperatorHero = forwardRef<HTMLDivElement, OperatorHeroProps>(\n  (\n    {\n      name,\n      colorId,\n      tagline,\n      imageUrl,\n      rating,\n      badges,\n      actionSlot,\n      density = 'comfortable',\n      surface = 'elevated',\n      'aria-label': ariaLabel,\n      id,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { t } = useTranslation();\n    const headingId = useId();\n    const resolvedAriaLabel = ariaLabel ?? t('operatorHero.regionLabel');\n\n    // Calendar-colour dot. Tint via a component-scoped CSS custom property set\n    // imperatively on a ref — mirrors the Avatar `--avatar-color-override`\n    // idiom so no `style={{…}}` attribute lands on the JSX (constraint §4).\n    const hasColor = colorId !== undefined && colorId !== null;\n    const dotRef = useRef<HTMLSpanElement>(null);\n\n    useAgentRegistration(\n      operatorHeroAgent,\n      { getName: () => name, getHasColor: () => hasColor },\n      id,\n    );\n    useIsomorphicLayoutEffect(() => {\n      const el = dotRef.current;\n      if (!el) return;\n      if (hasColor) {\n        el.style.setProperty('--operator-hero-color', colorIdToToken(colorId));\n      } else {\n        el.style.removeProperty('--operator-hero-color');\n      }\n    }, [hasColor, colorId]);\n\n    const ratingLabel = rating\n      ? t('operatorHero.ratingLabel', {\n          value: rating.value.toFixed(1),\n          count: rating.count,\n        })\n      : undefined;\n\n    // Padding scales with density. Comfortable matches the practice\n    // hero's `pt-xl pb-md` minus the cover strip; compact halves it.\n    const bodyPaddingClass =\n      density === 'comfortable'\n        ? 'ds:pt-[var(--spacing-md)] ds:pb-[var(--spacing-md)]'\n        : 'ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-sm)]';\n\n    // Avatar size keys off density. Comfortable = 2xl (~72px) to read\n    // as the page hero. Compact = xl (~56px) for embedded use.\n    const avatarSize = density === 'comfortable' ? '2xl' : 'xl';\n\n    // Heading scale tracks density too. Comfortable uses the kit's\n    // page-title token; compact drops to title-card so the operator\n    // name doesn't dominate an embedded surface.\n    const headingClass =\n      density === 'comfortable' ? 'type-title-page' : 'type-title-card';\n\n    const inner = (\n      <div\n        className={[\n          'ds:flex ds:items-start ds:gap-[var(--spacing-lg)]',\n          bodyPaddingClass,\n          'ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]',\n        ].join(' ')}\n      >\n        <Avatar\n          size={avatarSize}\n          name={name}\n          src={imageUrl}\n          className=\"ds:shrink-0\"\n        />\n        <div className=\"ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:gap-[var(--spacing-xs)]\">\n          <div className=\"ds:flex ds:items-start ds:gap-[var(--spacing-md)] ds:flex-wrap\">\n            <h1\n              id={headingId}\n              className={`${headingClass} ds:m-0 ds:flex ds:items-center ds:gap-[var(--spacing-xs)] ds:text-[color:var(--foreground)]`}\n            >\n              {hasColor ? (\n                <span\n                  ref={dotRef}\n                  role=\"img\"\n                  aria-label={t('operatorHero.colorLabel', 'Calendar colour')}\n                  className=\"ds:inline-block ds:size-[var(--spacing-sm)] ds:shrink-0 ds:rounded-[var(--radius-full)] ds:bg-[var(--operator-hero-color)]\"\n                />\n              ) : null}\n              {name}\n            </h1>\n            {actionSlot ? (\n              <div className=\"ds:ms-auto ds:flex ds:shrink-0 ds:items-center ds:gap-[var(--spacing-xs)]\">\n                {actionSlot}\n              </div>\n            ) : null}\n          </div>\n          {tagline ? (\n            <p className=\"type-body ds:m-0 ds:text-[color:var(--foreground)]\">\n              {tagline}\n            </p>\n          ) : null}\n          {rating ? (\n            <div\n              className=\"ds:flex ds:items-center ds:gap-[var(--spacing-xs)]\"\n              aria-label={ratingLabel}\n            >\n              <Rating\n                value={rating.value}\n                max={5}\n                size={density === 'comfortable' ? 'md' : 'sm'}\n              />\n              <span className=\"type-body-sm ds:text-[color:var(--muted-foreground)]\">\n                {rating.value.toFixed(1)} · {rating.count}\n              </span>\n            </div>\n          ) : null}\n          {badges && badges.length > 0 ? (\n            <div\n              role=\"list\"\n              className=\"ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-2xs)] ds:mt-[var(--spacing-2xs)]\"\n            >\n              {badges.map((badge) => (\n                <Badge\n                  key={badge.key}\n                  variant={badge.variant ?? 'neutral'}\n                  role=\"listitem\"\n                >\n                  {badge.label}\n                </Badge>\n              ))}\n            </div>\n          ) : null}\n        </div>\n      </div>\n    );\n\n    return (\n      <div\n        ref={ref}\n        role=\"region\"\n        aria-label={resolvedAriaLabel}\n        aria-labelledby={headingId}\n        data-component=\"operator-hero\"\n        data-component-id={id}\n        data-density={density}\n        id={id}\n        className={rootVariants({ surface, density, className })}\n        {...rest}\n      >\n        {surface === 'elevated' ? (\n          <Card variant=\"elevated\">{inner}</Card>\n        ) : (\n          inner\n        )}\n      </div>\n    );\n  },\n);\n\nOperatorHero.displayName = 'OperatorHero';\n\nexport type OperatorHeroDensity = NonNullable<\n  VariantProps<typeof rootVariants>['density']\n>;\n"],"names":["operatorHeroAgent","handle","rootVariants","cva","OperatorHero","forwardRef","name","colorId","tagline","imageUrl","rating","badges","actionSlot","density","surface","ariaLabel","id","className","rest","ref","t","useTranslation","headingId","useId","resolvedAriaLabel","hasColor","dotRef","useRef","useAgentRegistration","useIsomorphicLayoutEffect","el","colorIdToToken","ratingLabel","bodyPaddingClass","avatarSize","headingClass","inner","jsxs","jsx","Avatar","Rating","badge","Badge","Card"],"mappings":"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"}
+{"version":3,"file":"operator-hero-BO8TqzX2.js","sources":["../../src/components/operator-hero/operator-hero.agent.ts","../../src/components/operator-hero/operator-hero.tsx"],"sourcesContent":["import type { AgentAdapter } from '../../agent/types';\nimport type { OperatorHeroHandle } from './operator-hero';\n\nexport const operatorHeroAgent: AgentAdapter<OperatorHeroHandle> = {\n  id: 'operator-hero',\n  // Purely observable hero region — no interactive affordances and no\n  // imperative actions on the handle (getName / getHasColor are read-only\n  // projections). The previous `view_change` capability had no backing\n  // action and is removed.\n  capabilities: [],\n  state: {\n    name: {\n      type: 'string',\n      descriptionKey: 'ui.agent.operatorHero.state.name',\n      description: 'Operator display name currently rendered.',\n      read: (handle) => handle.getName(),\n    },\n    hasColor: {\n      type: 'boolean',\n      descriptionKey: 'ui.agent.operatorHero.state.hasColor',\n      description:\n        'Whether a calendar-colour identity dot is rendered. Structural flag only — never the colour id or any PHI.',\n      read: (handle) => handle.getHasColor(),\n    },\n  },\n  actions: {},\n  domHooks: {\n    root: {\n      attr: 'data-component',\n      value: 'operator-hero',\n      description: 'Marks the OperatorHero root region.',\n    },\n    instanceId: {\n      attr: 'data-component-id',\n      sourceProp: 'id',\n      description: 'Sourced from the id prop.',\n    },\n  },\n};\n","import {\n  forwardRef,\n  useId,\n  useRef,\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { Avatar } from '../avatar/avatar';\nimport { Badge } from '../badge/badge';\nimport { Card } from '../card/card';\nimport { Rating } from '../rating/rating';\nimport { colorIdToToken } from '../_shared/entity-card';\nimport { useIsomorphicLayoutEffect } from '../../hooks/use-isomorphic-layout-effect';\nimport { useAgentRegistration } from '../../agent/registry';\nimport { operatorHeroAgent } from './operator-hero.agent';\n\n/* -------------------------------------------------------------------- */\n/* OperatorHero                                                           */\n/*                                                                        */\n/* The operator-page counterpart to the consumer-side `<PracticeHero>`   */\n/* / `<PracticeProfileHero>` pattern. Differences from the practice      */\n/* hero (per the spec):                                                  */\n/*                                                                        */\n/*   - Avatar instead of a full hero image background                   */\n/*   - Ratings + reviews summary rendered inline                        */\n/*   - Slightly shorter vertically — no cover strip, denser padding     */\n/*                                                                        */\n/* Use case: individual operator profile page (`/dentista/<slug>/        */\n/* operatori/<name>`), pair with `<ContactProfileCard>` below to fill   */\n/* in the operator's contact + profession info.                          */\n/* -------------------------------------------------------------------- */\n\n/* -------------------------------------------------------------------- */\n/* CVA                                                                    */\n/* -------------------------------------------------------------------- */\n\nconst rootVariants = cva('ds:w-full ds:text-[color:var(--foreground)]', {\n  variants: {\n    // Density toggle. Default `comfortable` matches the practice hero's\n    // visual weight minus the cover strip. `compact` is for embedded\n    // surfaces (booking aside, ROI Dashboard practice panel) where the\n    // hero needs to fit in <12rem vertical.\n    density: {\n      comfortable: '',\n      compact: '',\n    },\n    // Matches the kit's other `surface` props (Booking, ReviewsPanel,\n    // ContactProfileCard). `'elevated'` wraps in `<Card>`.\n    surface: {\n      flat: '',\n      elevated: '',\n    },\n  },\n  defaultVariants: {\n    density: 'comfortable',\n    surface: 'elevated',\n  },\n});\n\n/* -------------------------------------------------------------------- */\n/* Public types                                                           */\n/* -------------------------------------------------------------------- */\n\nexport interface OperatorHeroBadge {\n  /** Display key — i18n is up to the consumer. */\n  key: string;\n  /** Display label. */\n  label: string;\n  /** Badge variant — falls back to `neutral`. */\n  variant?: 'neutral' | 'info' | 'success' | 'warning' | 'error';\n}\n\nexport interface OperatorHeroRating {\n  /** Mean rating, 0–5. */\n  value: number;\n  /** Total number of reviews. */\n  count: number;\n}\n\nexport interface OperatorHeroHandle {\n  getName: () => string;\n  /** Structural flag — whether a calendar-colour dot is rendered. No PHI. */\n  getHasColor: () => boolean;\n}\n\nexport interface OperatorHeroProps extends Omit<\n  ComponentPropsWithoutRef<'div'>,\n  'aria-label' | 'children'\n> {\n  /** Operator's display name. Rendered as the H1 heading. */\n  name: string;\n  /**\n   * Optional calendar-colour identity for the operator. AlfaDocs assigns each\n   * operator a numeric colour id; when present, a small colour dot is rendered\n   * next to the name, tinted via `colorIdToToken(colorId)` (a `var(--…)` palette\n   * token — never a literal). The id itself is a structural identifier, not PHI.\n   */\n  colorId?: string;\n  /** Specialty / tagline subtitle (e.g. \"Dermatologa · 12 anni di esperienza\"). */\n  tagline?: string;\n  /**\n   * Optional photo / avatar URL. The kit always renders an `<Avatar>` —\n   * when `imageUrl` is missing the avatar falls back to initials.\n   */\n  imageUrl?: string;\n  /** Rating summary — when present, renders a Rating + numeric breakdown line. */\n  rating?: OperatorHeroRating;\n  /**\n   * Optional badge row beneath the rating. Use sparingly — 1–3 chips\n   * suit the hero's density; longer lists belong in `<ContactProfileCard>`.\n   */\n  badges?: OperatorHeroBadge[];\n\n  /* ----- Slots ----- */\n\n  /**\n   * Rendered at the inline-end of the heading row (right side on LTR).\n   * Use for a \"Book with this operator\" `<Button>` or a \"Back to\n   * practice\" link.\n   */\n  actionSlot?: ReactNode;\n\n  /* ----- Styling ----- */\n\n  /**\n   * `comfortable` (default) — matches the practice hero's visual\n   * weight minus the cover strip. `compact` halves the vertical\n   * padding for embedded surfaces.\n   */\n  density?: 'comfortable' | 'compact';\n  /**\n   * `elevated` (default) wraps in `<Card variant=\"elevated\">`. `flat`\n   * drops the Card — use inside another card / sheet.\n   */\n  surface?: 'flat' | 'elevated';\n\n  /* ----- a11y ----- */\n\n  'aria-label'?: string;\n  id?: string;\n}\n\n/* -------------------------------------------------------------------- */\n/* Component                                                              */\n/* -------------------------------------------------------------------- */\n\nexport const OperatorHero = forwardRef<HTMLDivElement, OperatorHeroProps>(\n  (\n    {\n      name,\n      colorId,\n      tagline,\n      imageUrl,\n      rating,\n      badges,\n      actionSlot,\n      density = 'comfortable',\n      surface = 'elevated',\n      'aria-label': ariaLabel,\n      id,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { t } = useTranslation();\n    const headingId = useId();\n    const resolvedAriaLabel = ariaLabel ?? t('operatorHero.regionLabel');\n\n    // Calendar-colour dot. Tint via a component-scoped CSS custom property set\n    // imperatively on a ref — mirrors the Avatar `--avatar-color-override`\n    // idiom so no `style={{…}}` attribute lands on the JSX (constraint §4).\n    const hasColor = colorId !== undefined && colorId !== null;\n    const dotRef = useRef<HTMLSpanElement>(null);\n\n    useAgentRegistration(\n      operatorHeroAgent,\n      { getName: () => name, getHasColor: () => hasColor },\n      id,\n    );\n    useIsomorphicLayoutEffect(() => {\n      const el = dotRef.current;\n      if (!el) return;\n      if (hasColor) {\n        el.style.setProperty('--operator-hero-color', colorIdToToken(colorId));\n      } else {\n        el.style.removeProperty('--operator-hero-color');\n      }\n    }, [hasColor, colorId]);\n\n    const ratingLabel = rating\n      ? t('operatorHero.ratingLabel', {\n          value: rating.value.toFixed(1),\n          count: rating.count,\n        })\n      : undefined;\n\n    // Padding scales with density. Comfortable matches the practice\n    // hero's `pt-xl pb-md` minus the cover strip; compact halves it.\n    const bodyPaddingClass =\n      density === 'comfortable'\n        ? 'ds:pt-[var(--spacing-md)] ds:pb-[var(--spacing-md)]'\n        : 'ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-sm)]';\n\n    // Avatar size keys off density. Comfortable = 2xl (~72px) to read\n    // as the page hero. Compact = xl (~56px) for embedded use.\n    const avatarSize = density === 'comfortable' ? '2xl' : 'xl';\n\n    // Heading scale tracks density too. Comfortable uses the kit's\n    // page-title token; compact drops to title-card so the operator\n    // name doesn't dominate an embedded surface.\n    const headingClass =\n      density === 'comfortable' ? 'type-title-page' : 'type-title-card';\n\n    const inner = (\n      <div\n        className={[\n          'ds:flex ds:items-start ds:gap-[var(--spacing-lg)]',\n          bodyPaddingClass,\n          'ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]',\n        ].join(' ')}\n      >\n        <Avatar\n          size={avatarSize}\n          name={name}\n          src={imageUrl}\n          className=\"ds:shrink-0\"\n        />\n        <div className=\"ds:flex ds:min-w-0 ds:flex-1 ds:flex-col ds:gap-[var(--spacing-xs)]\">\n          <div className=\"ds:flex ds:items-start ds:gap-[var(--spacing-md)] ds:flex-wrap\">\n            <h1\n              id={headingId}\n              className={`${headingClass} ds:m-0 ds:flex ds:items-center ds:gap-[var(--spacing-xs)] ds:text-[color:var(--foreground)]`}\n            >\n              {hasColor ? (\n                <span\n                  ref={dotRef}\n                  role=\"img\"\n                  aria-label={t('operatorHero.colorLabel', 'Calendar colour')}\n                  className=\"ds:inline-block ds:size-[var(--spacing-sm)] ds:shrink-0 ds:rounded-[var(--radius-full)] ds:bg-[var(--operator-hero-color)]\"\n                />\n              ) : null}\n              {name}\n            </h1>\n            {actionSlot ? (\n              <div className=\"ds:ms-auto ds:flex ds:shrink-0 ds:items-center ds:gap-[var(--spacing-xs)]\">\n                {actionSlot}\n              </div>\n            ) : null}\n          </div>\n          {tagline ? (\n            <p className=\"type-body ds:m-0 ds:text-[color:var(--foreground)]\">\n              {tagline}\n            </p>\n          ) : null}\n          {rating ? (\n            <div\n              className=\"ds:flex ds:items-center ds:gap-[var(--spacing-xs)]\"\n              aria-label={ratingLabel}\n            >\n              <Rating\n                value={rating.value}\n                max={5}\n                size={density === 'comfortable' ? 'md' : 'sm'}\n              />\n              <span className=\"type-body-sm ds:text-[color:var(--muted-foreground)]\">\n                {rating.value.toFixed(1)} · {rating.count}\n              </span>\n            </div>\n          ) : null}\n          {badges && badges.length > 0 ? (\n            <div\n              role=\"list\"\n              className=\"ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-2xs)] ds:mt-[var(--spacing-2xs)]\"\n            >\n              {badges.map((badge) => (\n                <Badge\n                  key={badge.key}\n                  variant={badge.variant ?? 'neutral'}\n                  role=\"listitem\"\n                >\n                  {badge.label}\n                </Badge>\n              ))}\n            </div>\n          ) : null}\n        </div>\n      </div>\n    );\n\n    return (\n      <div\n        ref={ref}\n        role=\"region\"\n        aria-label={resolvedAriaLabel}\n        aria-labelledby={headingId}\n        data-component=\"operator-hero\"\n        data-component-id={id}\n        data-density={density}\n        id={id}\n        className={rootVariants({ surface, density, className })}\n        {...rest}\n      >\n        {surface === 'elevated' ? (\n          <Card variant=\"elevated\">{inner}</Card>\n        ) : (\n          inner\n        )}\n      </div>\n    );\n  },\n);\n\nOperatorHero.displayName = 'OperatorHero';\n\nexport type OperatorHeroDensity = NonNullable<\n  VariantProps<typeof rootVariants>['density']\n>;\n"],"names":["operatorHeroAgent","handle","rootVariants","cva","OperatorHero","forwardRef","name","colorId","tagline","imageUrl","rating","badges","actionSlot","density","surface","ariaLabel","id","className","rest","ref","t","useTranslation","headingId","useId","resolvedAriaLabel","hasColor","dotRef","useRef","useAgentRegistration","useIsomorphicLayoutEffect","el","colorIdToToken","ratingLabel","bodyPaddingClass","avatarSize","headingClass","inner","jsxs","jsx","Avatar","Rating","badge","Badge","Card"],"mappings":"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"}

package/dist/_chunks/panel-header-D313n_9-.js

@@ -0,0 +1,105 @@
+import { jsxs as s, jsx as r } from "react/jsx-runtime";
+import { forwardRef as b, useContext as P, createContext as k } from "react";
+import { c as i } from "./index-D2ZczOXr.js";
+const l = k(null);
+function C({
+  actions: a,
+  children: e
+}) {
+  return /* @__PURE__ */ r(l.Provider, { value: a, children: e });
+}
+function y() {
+  return P(l);
+}
+const N = i(
+  [
+    "ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]",
+    "ds:px-[var(--spacing-md)] ds:pt-[var(--spacing-md)] ds:pb-[var(--spacing-sm)]"
+  ].join(" "),
+  {
+    variants: {
+      // `sticky` pins the header to the top of the panel's scroll region;
+      // otherwise it stays a fixed-height band that never shrinks.
+      sticky: {
+        true: "ds:sticky ds:top-0 ds:z-[1] ds:bg-[color:var(--background)]",
+        false: "ds:shrink-0"
+      },
+      divider: {
+        true: "ds:border-b ds:border-[color:var(--border)]",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      sticky: !1,
+      divider: !0
+    }
+  }
+), j = i(
+  [
+    "ds:m-0 ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]",
+    "ds:text-[color:var(--foreground)]"
+  ].join(" "),
+  {
+    variants: {
+      titleScale: {
+        card: "type-title-card",
+        section: "type-title-section"
+      }
+    },
+    defaultVariants: {
+      titleScale: "card"
+    }
+  }
+), H = b(
+  ({
+    title: a,
+    icon: e,
+    headingId: c,
+    headingLevel: o = 2,
+    actions: d,
+    filters: n,
+    sticky: p = !1,
+    divider: u = !0,
+    titleScale: m = "card",
+    className: v,
+    ...f
+  }, g) => {
+    const t = y(), x = o === 3 ? "h3" : "h2", h = d != null || t != null;
+    return /* @__PURE__ */ s(
+      "header",
+      {
+        ref: g,
+        "data-component": "panel-header",
+        className: N({ sticky: p, divider: u, className: v }),
+        ...f,
+        children: [
+          /* @__PURE__ */ s("div", { className: "ds:flex ds:items-center ds:justify-between ds:gap-[var(--spacing-sm)]", children: [
+            /* @__PURE__ */ s(x, { id: c, className: j({ titleScale: m }), children: [
+              e ? /* @__PURE__ */ r(
+                "span",
+                {
+                  "aria-hidden": "true",
+                  className: "ds:inline-flex ds:shrink-0 ds:text-[color:var(--accent)] ds:[&_svg]:size-4",
+                  children: e
+                }
+              ) : null,
+              a
+            ] }),
+            h ? /* @__PURE__ */ s("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-xs)] ds:shrink-0", children: [
+              d,
+              t
+            ] }) : null
+          ] }),
+          n != null ? /* @__PURE__ */ r("div", { className: "ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-sm)]", children: n }) : null
+        ]
+      }
+    );
+  }
+);
+H.displayName = "PanelHeader";
+export {
+  H as P,
+  C as a,
+  y as u
+};
+//# sourceMappingURL=panel-header-D313n_9-.js.map

package/dist/_chunks/panel-header-D313n_9-.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel-header-D313n_9-.js","sources":["../../src/components/panel-header/panel-header.tsx"],"sourcesContent":["import {\n  createContext,\n  forwardRef,\n  useContext,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\n/* -------------------------------------------------------------------- */\n/* PanelHeader                                                           */\n/*                                                                       */\n/* The single header pattern every rail panel adopts: a title row        */\n/* (optional leading glyph + heading on the start, an action cluster on   */\n/* the end), an optional sticky second row of filters, an optional        */\n/* bottom divider, and edge handling (shrink-0 vs sticky). It            */\n/* standardises the bespoke <header> markup that AppointmentTimeline,     */\n/* TasksPanel and friends each re-authored.                              */\n/*                                                                       */\n/* The action cluster holds the PANEL-OWNED `actions` first, then any     */\n/* RAIL-INJECTED actions read from context (PanelHeaderActionsProvider).  */\n/* Standalone — with no provider — nothing is injected. The component     */\n/* owns no user-visible strings of its own: `title`, `actions` and        */\n/* `filters` are all caller-supplied nodes already translated upstream.   */\n/* -------------------------------------------------------------------- */\n\n/* -------------------------------------------------------------------- */\n/* Rail-actions context                                                  */\n/* -------------------------------------------------------------------- */\n\nconst PanelHeaderActionsContext = createContext<ReactNode>(null);\n\n/**\n * Provides rail-injected actions that every descendant `PanelHeader`\n * appends to its action cluster, after the panel's own `actions`. The\n * rail (or any host) wraps the panel subtree once; standalone panels\n * render without a provider and inject nothing.\n */\nexport function PanelHeaderActionsProvider({\n  actions,\n  children,\n}: {\n  actions: ReactNode;\n  children: ReactNode;\n}) {\n  return (\n    <PanelHeaderActionsContext.Provider value={actions}>\n      {children}\n    </PanelHeaderActionsContext.Provider>\n  );\n}\n\n/** Reads the rail-injected actions for the current subtree (default `null`). */\nexport function usePanelHeaderActions(): ReactNode {\n  return useContext(PanelHeaderActionsContext);\n}\n\n/* -------------------------------------------------------------------- */\n/* CVA                                                                   */\n/* -------------------------------------------------------------------- */\n\nconst headerVariants = cva(\n  [\n    'ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]',\n    'ds:px-[var(--spacing-md)] ds:pt-[var(--spacing-md)] ds:pb-[var(--spacing-sm)]',\n  ].join(' '),\n  {\n    variants: {\n      // `sticky` pins the header to the top of the panel's scroll region;\n      // otherwise it stays a fixed-height band that never shrinks.\n      sticky: {\n        true: 'ds:sticky ds:top-0 ds:z-[1] ds:bg-[color:var(--background)]',\n        false: 'ds:shrink-0',\n      },\n      divider: {\n        true: 'ds:border-b ds:border-[color:var(--border)]',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      sticky: false,\n      divider: true,\n    },\n  },\n);\n\nconst headingVariants = cva(\n  [\n    'ds:m-0 ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]',\n    'ds:text-[color:var(--foreground)]',\n  ].join(' '),\n  {\n    variants: {\n      titleScale: {\n        card: 'type-title-card',\n        section: 'type-title-section',\n      },\n    },\n    defaultVariants: {\n      titleScale: 'card',\n    },\n  },\n);\n\n/* -------------------------------------------------------------------- */\n/* Public API                                                           */\n/* -------------------------------------------------------------------- */\n\nexport interface PanelHeaderProps\n  extends\n    Omit<HTMLAttributes<HTMLElement>, 'title'>,\n    VariantProps<typeof headerVariants> {\n  /** Heading content. Already translated upstream. */\n  title: ReactNode;\n  /** Optional leading glyph — auto `aria-hidden` and sized to `--spacing` 4. */\n  icon?: ReactNode;\n  /** `id` applied to the heading so panels can wire `aria-labelledby`. */\n  headingId?: string;\n  /** Semantic heading level. Default `2`. */\n  headingLevel?: 2 | 3;\n  /** Panel-owned actions, rendered inline-end of the title row. */\n  actions?: ReactNode;\n  /** Optional second row, typically filter controls. */\n  filters?: ReactNode;\n  /** Pin to the top of the scroll region. Default `false`. */\n  sticky?: boolean;\n  /** Bottom hairline. Default `true`. */\n  divider?: boolean;\n  /** Type scale of the heading. Default `'card'`. */\n  titleScale?: 'card' | 'section';\n}\n\nexport const PanelHeader = forwardRef<HTMLElement, PanelHeaderProps>(\n  (\n    {\n      title,\n      icon,\n      headingId,\n      headingLevel = 2,\n      actions,\n      filters,\n      sticky = false,\n      divider = true,\n      titleScale = 'card',\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const injected = usePanelHeaderActions();\n    const Heading = headingLevel === 3 ? 'h3' : 'h2';\n    const hasActions = actions != null || injected != null;\n\n    return (\n      <header\n        ref={ref}\n        data-component=\"panel-header\"\n        className={headerVariants({ sticky, divider, className })}\n        {...rest}\n      >\n        <div className=\"ds:flex ds:items-center ds:justify-between ds:gap-[var(--spacing-sm)]\">\n          <Heading id={headingId} className={headingVariants({ titleScale })}>\n            {icon ? (\n              <span\n                aria-hidden=\"true\"\n                className=\"ds:inline-flex ds:shrink-0 ds:text-[color:var(--accent)] ds:[&_svg]:size-4\"\n              >\n                {icon}\n              </span>\n            ) : null}\n            {title}\n          </Heading>\n          {hasActions ? (\n            <div className=\"ds:flex ds:items-center ds:gap-[var(--spacing-xs)] ds:shrink-0\">\n              {actions}\n              {injected}\n            </div>\n          ) : null}\n        </div>\n\n        {filters != null ? (\n          <div className=\"ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-sm)]\">\n            {filters}\n          </div>\n        ) : null}\n      </header>\n    );\n  },\n);\n\nPanelHeader.displayName = 'PanelHeader';\n"],"names":["PanelHeaderActionsContext","createContext","PanelHeaderActionsProvider","actions","children","usePanelHeaderActions","useContext","headerVariants","cva","headingVariants","PanelHeader","forwardRef","title","icon","headingId","headingLevel","filters","sticky","divider","titleScale","className","rest","ref","injected","Heading","hasActions","jsxs","jsx"],"mappings":";;;AA8BA,MAAMA,IAA4BC,EAAyB,IAAI;AAQxD,SAASC,EAA2B;AAAA,EACzC,SAAAC;AAAA,EACA,UAAAC;AACF,GAGG;AACD,2BACGJ,EAA0B,UAA1B,EAAmC,OAAOG,GACxC,UAAAC,GACH;AAEJ;AAGO,SAASC,IAAmC;AACjD,SAAOC,EAAWN,CAAyB;AAC7C;AAMA,MAAMO,IAAiBC;AAAA,EACrB;AAAA,IACE;AAAA,IACA;AAAA,EAAA,EACA,KAAK,GAAG;AAAA,EACV;AAAA,IACE,UAAU;AAAA;AAAA;AAAA,MAGR,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,MAET,SAAS;AAAA,QACP,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,IACT;AAAA,IAEF,iBAAiB;AAAA,MACf,QAAQ;AAAA,MACR,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ,GAEMC,IAAkBD;AAAA,EACtB;AAAA,IACE;AAAA,IACA;AAAA,EAAA,EACA,KAAK,GAAG;AAAA,EACV;AAAA,IACE,UAAU;AAAA,MACR,YAAY;AAAA,QACV,MAAM;AAAA,QACN,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,IAEF,iBAAiB;AAAA,MACf,YAAY;AAAA,IAAA;AAAA,EACd;AAEJ,GA8BaE,IAAcC;AAAA,EACzB,CACE;AAAA,IACE,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,WAAAC;AAAA,IACA,cAAAC,IAAe;AAAA,IACf,SAAAZ;AAAA,IACA,SAAAa;AAAA,IACA,QAAAC,IAAS;AAAA,IACT,SAAAC,IAAU;AAAA,IACV,YAAAC,IAAa;AAAA,IACb,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAMC,IAAWlB,EAAA,GACXmB,IAAUT,MAAiB,IAAI,OAAO,MACtCU,IAAatB,KAAW,QAAQoB,KAAY;AAElD,WACE,gBAAAG;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAJ;AAAA,QACA,kBAAe;AAAA,QACf,WAAWf,EAAe,EAAE,QAAAU,GAAQ,SAAAC,GAAS,WAAAE,GAAW;AAAA,QACvD,GAAGC;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAK,EAAC,OAAA,EAAI,WAAU,yEACb,UAAA;AAAA,YAAA,gBAAAA,EAACF,GAAA,EAAQ,IAAIV,GAAW,WAAWL,EAAgB,EAAE,YAAAU,GAAY,GAC9D,UAAA;AAAA,cAAAN,IACC,gBAAAc;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAY;AAAA,kBACZ,WAAU;AAAA,kBAET,UAAAd;AAAA,gBAAA;AAAA,cAAA,IAED;AAAA,cACHD;AAAA,YAAA,GACH;AAAA,YACCa,IACC,gBAAAC,EAAC,OAAA,EAAI,WAAU,kEACZ,UAAA;AAAA,cAAAvB;AAAA,cACAoB;AAAA,YAAA,EAAA,CACH,IACE;AAAA,UAAA,GACN;AAAA,UAECP,KAAW,OACV,gBAAAW,EAAC,SAAI,WAAU,mEACZ,aACH,IACE;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AAEAjB,EAAY,cAAc;"}