{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tooltip",
  "title": "Tooltip",
  "description": "The shadcn Tooltip on Base UI, not Radix. The popup is the ink/paper inversion (bg-foreground on text-background) rather than shadcn's bg-primary, because the brand forbids orange as a surface behind text; the enter is the Popover's scale/opacity move, honouring motion-reduce. Carries an aside, never the only place something is said.",
  "dependencies": [
    "@base-ui/react@1.9.0"
  ],
  "registryDependencies": [
    "@waimakers/utils",
    "@waimakers/theme"
  ],
  "files": [
    {
      "path": "src/components/ui/tooltip.tsx",
      "content": "import { Tooltip as TooltipPrimitive } from \"@base-ui/react/tooltip\";\nimport type * as React from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst Tooltip = TooltipPrimitive.Root;\nconst TooltipTrigger = TooltipPrimitive.Trigger;\nconst TooltipProvider = TooltipPrimitive.Provider;\n\nfunction TooltipContent({\n  className,\n  sideOffset = 6,\n  align = \"center\",\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Popup> & {\n  sideOffset?: number;\n  align?: \"start\" | \"center\" | \"end\";\n}) {\n  return (\n    <TooltipPrimitive.Portal>\n      <TooltipPrimitive.Positioner\n        className=\"z-(--z-modal,50) outline-none\"\n        sideOffset={sideOffset}\n        align={align}\n      >\n        <TooltipPrimitive.Popup\n          data-slot=\"tooltip-content\"\n          className={cn(\n            \"w-fit max-w-[min(20rem,var(--available-width))] origin-[var(--transform-origin)] text-balance rounded-md bg-foreground px-3 py-1.5 text-xs text-background shadow-brand-overlay outline-none\",\n            \"transition-[transform,opacity] duration-(--dur-fast,120ms) ease-brand motion-reduce:transition-none\",\n            \"data-starting-style:scale-95 data-starting-style:opacity-0 data-ending-style:scale-95 data-ending-style:opacity-0\",\n            className,\n          )}\n          {...props}\n        />\n      </TooltipPrimitive.Positioner>\n    </TooltipPrimitive.Portal>\n  );\n}\n\nexport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };\n",
      "type": "registry:ui",
      "target": "components/ui/tooltip.tsx"
    },
    {
      "path": "src/components/ui/timestamp-tooltip-group.tsx",
      "content": "import {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"./tooltip\";\n\ntype TimestampTooltips = {\n  open: boolean;\n  descriptions: Readonly<Record<string, { local: string | null; utc: string }>>;\n  register: (id: string, local: string | null, utc: string) => () => void;\n};\n\nconst TimestampTooltipContext = createContext<TimestampTooltips | null>(null);\n\nexport function TimestampTooltipGroup({\n  active,\n  children,\n}: {\n  active: boolean;\n  children: ReactNode;\n}) {\n  const [open, setOpen] = useState(false);\n  const [descriptions, setDescriptions] = useState<\n    Record<string, { local: string | null; utc: string }>\n  >({});\n  const register = useCallback((id: string, local: string | null, utc: string) => {\n    setDescriptions((current) =>\n      current[id]?.local === local && current[id]?.utc === utc\n        ? current\n        : { ...current, [id]: { local, utc } },\n    );\n    return () => {\n      setDescriptions((current) => {\n        const next = { ...current };\n        delete next[id];\n        return next;\n      });\n    };\n  }, []);\n  const value = useMemo(() => ({ open, descriptions, register }), [open, descriptions, register]);\n  if (!active) {\n    return (\n      <TimestampTooltipContext.Provider value={null}>{children}</TimestampTooltipContext.Provider>\n    );\n  }\n  return (\n    <TimestampTooltipContext.Provider value={value}>\n      <Tooltip\n        open={open}\n        disabled={Object.keys(descriptions).length === 0}\n        onOpenChange={(open, details) => {\n          if (open && details.reason === \"trigger-hover\") {\n            details.cancel();\n            return;\n          }\n          setOpen(open);\n        }}\n      >\n        {children}\n        <TimestampTooltipContents descriptions={descriptions} />\n      </Tooltip>\n    </TimestampTooltipContext.Provider>\n  );\n}\n\nexport function TimestampTooltipTarget({\n  children,\n}: {\n  children: ReactElement<{ children?: ReactNode; \"aria-describedby\"?: string }>;\n}) {\n  const context = useContext(TimestampTooltipContext);\n  if (!context) {\n    return children;\n  }\n  const describedBy = [children.props[\"aria-describedby\"], ...Object.keys(context.descriptions)]\n    .filter(Boolean)\n    .join(\" \");\n  return (\n    <TooltipTrigger render={children} aria-describedby={describedBy || undefined}>\n      {children.props.children}\n    </TooltipTrigger>\n  );\n}\n\nfunction TimestampTooltipContents({ descriptions }: Pick<TimestampTooltips, \"descriptions\">) {\n  return (\n    <TooltipContent role=\"tooltip\">\n      {Object.entries(descriptions).map(([id, exact]) => (\n        <TimestampTooltipLines key={id} {...exact} />\n      ))}\n    </TooltipContent>\n  );\n}\n\nexport function TimestampTooltipTime({ children }: { children: ReactElement }) {\n  const context = useContext(TimestampTooltipContext);\n  return context ? (\n    <Tooltip disabled={context.open}>\n      <TooltipTrigger render={children} tabIndex={-1} />\n      <TimestampTooltipContents descriptions={context.descriptions} />\n    </Tooltip>\n  ) : (\n    children\n  );\n}\n\nexport function TimestampTooltipLines({ local, utc }: { local: string | null; utc: string }) {\n  return (\n    <>\n      {local && <span className=\"block whitespace-nowrap\">{local}</span>}\n      <span className=\"block whitespace-nowrap\">{utc}</span>\n    </>\n  );\n}\n\nexport function useTimestampTooltipGroup(id: string, local: string | null, utc: string | null) {\n  const register = useContext(TimestampTooltipContext)?.register;\n  useEffect(() => {\n    if (register && utc !== null) {\n      return register(id, local, utc);\n    }\n  }, [id, local, register, utc]);\n  return register !== undefined;\n}\n",
      "type": "registry:ui",
      "target": "components/ui/timestamp-tooltip-group.tsx"
    }
  ],
  "type": "registry:ui"
}