{
  "name": "tsf-submit-button",
  "type": "registry:ui",
  "dependencies": [
    "class-variance-authority",
    "lucide-react"
  ],
  "registryDependencies": [
    "button",
    "tsf-form-context"
  ],
  "files": [
    {
      "path": "./items/tanstack-form/submit-button/component.tsx",
      "type": "registry:ui",
      "target": "./components/ui/shuip/tanstack-form/submit-button.tsx",
      "content": "'use client';\n\nimport type { VariantProps } from 'class-variance-authority';\nimport { Loader2Icon } from 'lucide-react';\nimport { Button, type buttonVariants } from '@/components/ui/button';\nimport { useFormContext } from '@/components/ui/shuip/tanstack-form/form-context';\n\ntype ButtonProps = React.ComponentProps<'button'> &\n  VariantProps<typeof buttonVariants> & {\n    asChild?: boolean;\n  };\n\nexport interface SubmitButtonProps {\n  children?: React.ReactNode;\n  props?: ButtonProps;\n}\n\nexport function SubmitButton({ children = 'Submit', props }: SubmitButtonProps) {\n  const form = useFormContext();\n  return (\n    <form.Subscribe selector={(state) => [state.isSubmitting, state.canSubmit]}>\n      {([isSubmitting, canSubmit]) => (\n        <Button type='submit' disabled={isSubmitting || !canSubmit} className='transition-all duration-300' {...props}>\n          {isSubmitting && <Loader2Icon role='status' aria-label='Loading' className='size-4 animate-spin' />}\n          {children}\n        </Button>\n      )}\n    </form.Subscribe>\n  );\n}\n"
    }
  ],
  "$schema": "https://ui.shadcn.com/schema/registry-item.json"
}