{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "floating-toolbar",
  "title": "Floating Toolbar",
  "description": "A context toolbar that springs into view with magnetic, morphing action buttons.",
  "dependencies": ["framer-motion"],
  "registryDependencies": ["@godui/godui-theme"],
  "files": [
    {
      "path": "packages/components/src/floating-toolbar/floating-toolbar.tsx",
      "content": "\"use client\";\n\nimport { AnimatePresence, motion, useReducedMotion } from \"framer-motion\";\nimport * as React from \"react\";\n\nexport type ToolbarAction = {\n  icon: React.ReactNode;\n  label: string;\n  onClick?: () => void;\n  active?: boolean;\n  disabled?: boolean;\n};\n\nexport type FloatingToolbarProps = React.HTMLAttributes<HTMLDivElement> & {\n  actions: ToolbarAction[];\n  /** Controls mount/unmount with a spring entrance. */\n  open?: boolean;\n  /** Optional trailing content (e.g. a divider + extra controls). */\n  children?: React.ReactNode;\n};\n\nconst FloatingToolbar = React.forwardRef<HTMLDivElement, FloatingToolbarProps>(\n  ({ actions, open = true, className, children, ...props }, ref) => {\n    const reduceMotion = useReducedMotion();\n    return (\n      <AnimatePresence>\n        {open && (\n          <motion.div\n            ref={ref}\n            layout\n            role=\"toolbar\"\n            aria-label=\"Floating toolbar\"\n            initial={\n              reduceMotion ? { opacity: 0 } : { opacity: 0, y: 12, scale: 0.92 }\n            }\n            animate={{ opacity: 1, y: 0, scale: 1 }}\n            exit={\n              reduceMotion ? { opacity: 0 } : { opacity: 0, y: 8, scale: 0.95 }\n            }\n            transition={{ type: \"spring\", stiffness: 520, damping: 32 }}\n            className={`inline-flex items-center gap-0.5 rounded-xl border border-border bg-popover/90 p-1 text-popover-foreground shadow-lg backdrop-blur-md ${\n              className ?? \"\"\n            }`}\n            {...(props as React.ComponentProps<typeof motion.div>)}\n          >\n            {actions.map((action) => (\n              <motion.button\n                key={action.label}\n                type=\"button\"\n                layout\n                disabled={action.disabled}\n                aria-label={action.label}\n                aria-pressed={action.active}\n                onClick={action.onClick}\n                whileHover={reduceMotion ? undefined : { y: -2, scale: 1.08 }}\n                whileTap={reduceMotion ? undefined : { scale: 0.94 }}\n                transition={{ type: \"spring\", stiffness: 520, damping: 32 }}\n                className={`grid size-9 place-items-center rounded-lg [transition:background-color_150ms_ease,color_150ms_ease] focus:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-40 ${\n                  action.active\n                    ? \"bg-primary text-primary-foreground\"\n                    : \"text-muted-foreground hover:bg-accent hover:text-accent-foreground\"\n                }`}\n              >\n                {action.icon}\n              </motion.button>\n            ))}\n            {children}\n          </motion.div>\n        )}\n      </AnimatePresence>\n    );\n  },\n);\nFloatingToolbar.displayName = \"FloatingToolbar\";\n\nexport { FloatingToolbar };\n",
      "type": "registry:ui",
      "target": "components/godui/floating-toolbar.tsx"
    }
  ],
  "type": "registry:ui"
}