{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tooltip",
  "title": "Tooltip",
  "description": "Pops out of its button, and switches instantly as you move to the next one.",
  "dependencies": [
    "@ui-sdk/core@0.1.0-beta.2",
    "@ui-sdk/react@0.1.0-beta.2"
  ],
  "registryDependencies": [
    "@keyframery/motion"
  ],
  "files": [
    {
      "path": "registry/components/keyframery/primitives/tooltip.tsx",
      "content": "\"use client\"\n\n/* Animated drop-in for `@ui-sdk/react/tooltip`: same parts, same props. Swap the import and keep\n   your code. This file adds motion only. Colours, radii, shadows and spacing stay yours. */\n\nimport {\n  TooltipContent as TooltipContentPart,\n  TooltipTrigger as TooltipTriggerPart,\n} from \"@ui-sdk/react/tooltip\"\nimport * as React from \"react\"\n\nimport { cn } from \"@/lib/utils\"\n\nexport * from \"@ui-sdk/react/tooltip\"\n\n/* Press: a trigger gives under the finger and springs back on release. */\nfunction TooltipTrigger({ className, ...props }: React.ComponentProps<typeof TooltipTriggerPart>) {\n  return (\n    <TooltipTriggerPart\n      className={cn(\n        \"transition-[scale] duration-[calc(200ms*var(--kf-speed,1))] ease-pop not-data-disabled:active:scale-[0.96] motion-reduce:transition-none!\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\n/* Unfold, small: the tip pops out of its trigger from 0.7, 8px closer to it, with a little\n   overshoot. When it opens at once because a neighbour was just showing, it simply appears, so\n   moving along a toolbar reads as one tip following the pointer. */\nfunction TooltipContent<Payload = unknown>({\n  className,\n  ...props\n}: React.ComponentProps<typeof TooltipContentPart<Payload>>) {\n  return (\n    <TooltipContentPart<Payload>\n      className={cn(\n        \"origin-(--transform-origin) transition-[opacity,scale,translate,filter] duration-[calc(300ms*var(--kf-speed,1))] ease-pop\",\n        \"data-[side=bottom]:[--kf-from:0_-8px] data-[side=left]:[--kf-from:8px_0] data-[side=right]:[--kf-from:-8px_0] data-[side=top]:[--kf-from:0_8px]\",\n        \"data-starting-style:[translate:var(--kf-from,0_0)] data-starting-style:scale-[0.7] data-starting-style:opacity-0 data-starting-style:blur-[4px]\",\n        \"data-ending-style:scale-[0.9] data-ending-style:opacity-0 data-ending-style:duration-[calc(150ms*var(--kf-speed,1))] data-ending-style:ease-house\",\n        \"data-instant:transition-none\",\n        \"motion-reduce:transition-none!\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { TooltipContent, TooltipTrigger }\n",
      "type": "registry:component",
      "target": "components/keyframery/primitives/tooltip.tsx"
    },
    {
      "path": "registry/components/keyframery/tooltip.tsx",
      "content": "\"use client\"\n\n/* Styled tooltip: the animated primitive plus the Keyframery look. */\n\nimport {\n  Tooltip as TooltipRoot,\n  TooltipArrow as TooltipArrowPart,\n  TooltipContent as TooltipContentPart,\n  TooltipShortcut as TooltipShortcutPart,\n  TooltipTrigger as TooltipTriggerPart,\n} from \"@/components/keyframery/primitives/tooltip\"\nimport * as React from \"react\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction Tooltip(props: React.ComponentProps<typeof TooltipRoot>) {\n  return <TooltipRoot {...props} />\n}\n\n/* No look of its own: the trigger is usually your button, passed with `render`, or plain\n   content. It only adds the focus ring. */\nfunction TooltipTrigger({\n  className,\n  ...props\n}: React.ComponentProps<typeof TooltipTriggerPart>) {\n  return (\n    <TooltipTriggerPart\n      className={cn(\n        \"outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\n/* The one dark sheet. The primitive pops it out of its trigger, and skips that when it opens\n   at once because a neighbour was just showing. */\nfunction TooltipContent<Payload = unknown>({\n  className,\n  sideOffset = 6,\n  ...props\n}: React.ComponentProps<typeof TooltipContentPart<Payload>>) {\n  return (\n    <TooltipContentPart<Payload>\n      sideOffset={sideOffset}\n      className={cn(\n        \"m-0 flex max-w-64 items-center gap-2 border-0 px-2 py-1.5 text-[12px] leading-4 font-medium text-balance outline-none\",\n        \"rounded-[8px] bg-foreground text-background\",\n        \"shadow-[0_1px_2px_rgb(0_0_0/0.12),0_6px_16px_-4px_rgb(0_0_0/0.24)]\",\n        \"dark:shadow-[0_0_0_1px_rgb(0_0_0/0.4),0_6px_16px_-4px_rgb(0_0_0/0.7)]\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\n/* A small point toward the trigger, in the tooltip's own colour. */\nfunction TooltipArrow({\n  className,\n  ...props\n}: React.ComponentProps<typeof TooltipArrowPart>) {\n  return (\n    <TooltipArrowPart\n      className={cn(\n        \"pointer-events-none h-[5px] w-2.5 text-foreground\",\n        \"data-[side=bottom]:bottom-full data-[side=top]:top-full\",\n        \"data-[side=left]:left-full data-[side=left]:h-2.5 data-[side=left]:w-[5px] data-[side=right]:right-full data-[side=right]:h-2.5 data-[side=right]:w-[5px]\",\n        \"[&>svg]:absolute [&>svg]:top-1/2 [&>svg]:left-1/2 [&>svg]:h-[5px] [&>svg]:w-2.5 [&>svg]:-translate-1/2\",\n        \"data-[side=top]:[&>svg]:rotate-180 data-[side=left]:[&>svg]:rotate-90 data-[side=right]:[&>svg]:-rotate-90\",\n        className,\n      )}\n      {...props}\n    >\n      <svg viewBox=\"0 0 10 5\" aria-hidden className=\"overflow-visible\">\n        <path d=\"M0 5.5 L3.9 1 Q5 -0.1 6.1 1 L10 5.5 Z\" fill=\"currentColor\" />\n      </svg>\n    </TooltipArrowPart>\n  )\n}\n\n/* The keys, quieter than the label, in a small inset. */\nfunction TooltipShortcut({\n  className,\n  ...props\n}: React.ComponentProps<typeof TooltipShortcutPart>) {\n  return (\n    <TooltipShortcutPart\n      className={cn(\n        \"-my-0.5 -me-0.5 rounded-[5px] bg-background/15 px-1 py-0.5 text-[11px] leading-[14px] font-medium tracking-[0.04em] text-background/70 tabular-nums\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Tooltip, TooltipArrow, TooltipContent, TooltipShortcut, TooltipTrigger }\n",
      "type": "registry:component",
      "target": "components/keyframery/tooltip.tsx"
    }
  ],
  "type": "registry:component"
}