{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "base-button",
  "title": "Base Button",
  "description": "An interactive button component built on Base UI with Motion hover/tap scaling and shadcn/ui variants.",
  "dependencies": ["@base-ui/react", "motion", "class-variance-authority"],
  "registryDependencies": ["utils"],
  "files": [
    {
      "path": "registry/ui/base/button/index.tsx",
      "content": "\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cn } from \"@/lib/utils\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { motion, type Transition, useReducedMotion } from \"motion/react\";\nimport type { ComponentProps } from \"react\";\n\nconst buttonVariants = cva(\n  \"group/button inline-flex shrink-0 select-none items-center justify-center whitespace-nowrap rounded-lg border border-transparent bg-clip-padding font-medium text-sm outline-none transition-colors will-change-transform [backface-visibility:hidden] focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/80\",\n        outline:\n          \"border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50\",\n        secondary:\n          \"bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground\",\n        ghost:\n          \"hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50\",\n        destructive:\n          \"bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 dark:hover:bg-destructive/30\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default:\n          \"h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        xs: \"h-6 gap-1 in-data-[slot=button-group]:rounded-lg rounded-[min(var(--radius-md),10px)] px-2 text-xs has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: \"h-7 gap-1 in-data-[slot=button-group]:rounded-lg rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5\",\n        lg: \"h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        icon: \"size-8\",\n        \"icon-xs\":\n          \"size-6 in-data-[slot=button-group]:rounded-lg rounded-[min(var(--radius-md),10px)] [&_svg:not([class*='size-'])]:size-3\",\n        \"icon-sm\":\n          \"size-7 in-data-[slot=button-group]:rounded-lg rounded-[min(var(--radius-md),12px)]\",\n        \"icon-lg\": \"size-9\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n);\n\ninterface ButtonProps\n  extends ComponentProps<typeof ButtonPrimitive>,\n    VariantProps<typeof buttonVariants> {\n  /**\n   * Whether to disable Motion physics scale animation.\n   * @default false\n   */\n  disableAnimation?: boolean;\n  /**\n   * Scale factor applied on pointer hover.\n   * @default 1.05\n   */\n  hoverScale?: number;\n  /**\n   * Scale factor applied on pointer click/tap.\n   * @default 0.95\n   */\n  tapScale?: number;\n  /**\n   * Motion transition configuration for hover and tap scaling.\n   */\n  transition?: Transition;\n}\n\n/**\n * Animated Button component based on Base UI and Motion for React with shadcn/ui variants.\n */\nfunction Button({\n  className,\n  variant,\n  size,\n  hoverScale = 1.05,\n  tapScale = 0.95,\n  disableAnimation = false,\n  transition,\n  render,\n  ...props\n}: ButtonProps) {\n  const prefersReducedMotion = useReducedMotion();\n  const shouldAnimate = !(disableAnimation || prefersReducedMotion);\n\n  return (\n    <ButtonPrimitive\n      className={cn(buttonVariants({ variant, size, className }))}\n      data-slot=\"button\"\n      render={\n        render ?? (\n          <motion.button\n            data-primary-action\n            transition={\n              transition ?? {\n                type: \"spring\",\n                stiffness: 500,\n                damping: 30,\n                mass: 0.5,\n              }\n            }\n            type=\"button\"\n            whileHover={shouldAnimate ? { scale: hoverScale } : undefined}\n            whileTap={shouldAnimate ? { scale: tapScale } : undefined}\n          />\n        )\n      }\n      {...props}\n    />\n  );\n}\n\nexport type { ButtonProps };\nexport { Button, Button as BaseButton, Button as default, buttonVariants };\n",
      "type": "registry:ui",
      "target": "components/sora-ui/base/button.tsx"
    }
  ],
  "meta": {
    "agentMetadata": {
      "intent": "Trigger an immediate user action with clear visual and motion feedback.",
      "role": "action",
      "a11yConstraints": [
        "Preserve native button keyboard activation and disabled semantics."
      ],
      "motionEngine": "Motion spring scale on hover and tap with reduced-motion bypass.",
      "compositionRules": [
        "Use as a trigger for dialogs, menus, and form submission."
      ],
      "compositionRecipes": ["Compose with base/dialog for modal actions."]
    },
    "demoProps": {
      "Button": {
        "children": {
          "value": "Button"
        },
        "variant": {
          "value": "default",
          "options": {
            "Default": "default",
            "Secondary": "secondary",
            "Destructive": "destructive",
            "Outline": "outline",
            "Ghost": "ghost",
            "Link": "link"
          }
        },
        "size": {
          "value": "default",
          "options": {
            "Extra Small": "xs",
            "Small": "sm",
            "Default": "default",
            "Large": "lg"
          }
        },
        "hoverScale": {
          "value": 1.05,
          "min": 1,
          "max": 1.3,
          "step": 0.01
        },
        "tapScale": {
          "value": 0.95,
          "min": 0.7,
          "max": 1,
          "step": 0.01
        },
        "disableAnimation": {
          "value": false
        }
      }
    }
  },
  "type": "registry:ui"
}