{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "email",
  "title": "EmailField",
  "description": "Email input field for BuzzForm v2.",
  "registryDependencies": [
    "@buzzform/init",
    "input",
    "field",
    "@buzzform/copy"
  ],
  "files": [
    {
      "path": "registry/shadcn/fields/email.tsx",
      "content": "\"use client\";\n\nimport type { EmailField as EmailFieldDef } from \"@buildnbuzz/form-react\";\nimport { useDataField } from \"@buildnbuzz/form-react\";\nimport { Input } from \"@/components/ui/input\";\nimport { CopyButton } from \"../components/copy-button\";\nimport {\n  Field,\n  FieldContent,\n  FieldDescription,\n  FieldError,\n  FieldGroup,\n  FieldLabel,\n} from \"@/components/ui/field\";\nimport { cn } from \"@/lib/utils\";\n\ninterface EmailUi {\n  copyable?: boolean;\n  autoFocus?: boolean;\n  className?: string;\n  width?: string | number;\n  asterisk?: boolean;\n}\n\nexport function EmailField() {\n  const {\n    fieldApi,\n    field,\n    isDisabled,\n    isReadOnly,\n    isRequired,\n    label,\n    placeholder,\n    description,\n    errors,\n    isInvalid,\n    descriptionId,\n    errorId,\n    ariaDescribedBy,\n    handleChange,\n    handleBlur,\n  } = useDataField<EmailFieldDef>();\n\n  const value = (fieldApi.state.value as string) ?? \"\";\n  const ui = field.ui as EmailUi | undefined;\n\n  const width = ui?.width;\n  const widthStyle = width\n    ? {\n      width: typeof width === \"number\" ? `${width}px` : width,\n      flex: \"0 1 auto\",\n    }\n    : undefined;\n\n  return (\n    <FieldGroup\n      data-field={fieldApi.name}\n      className={ui?.className}\n      style={widthStyle}\n    >\n      <Field data-invalid={isInvalid} data-disabled={isDisabled}>\n        {label && (\n          <FieldLabel htmlFor={fieldApi.name} className=\"gap-1 items-baseline\">\n            {label}\n            {isRequired && ui?.asterisk !== false ? (\n              <span className=\"text-destructive\">*</span>\n            ) : null}\n          </FieldLabel>\n        )}\n\n        <FieldContent>\n          <div className={cn(\"relative\", ui?.copyable && \"flex items-center\")}>\n            <Input\n              id={fieldApi.name}\n              name={fieldApi.name}\n              type=\"email\"\n              inputMode=\"email\"\n              autoComplete={field.autoComplete ?? \"email\"}\n              autoFocus={ui?.autoFocus}\n              value={value}\n              onChange={(e) => handleChange(e.target.value)}\n              onBlur={handleBlur}\n              placeholder={placeholder}\n              disabled={isDisabled}\n              readOnly={isReadOnly}\n              aria-invalid={isInvalid}\n              aria-describedby={ariaDescribedBy}\n              minLength={field.minLength}\n              maxLength={field.maxLength}\n              required={isRequired}\n              className={cn(ui?.copyable && \"pr-9\")}\n            />\n            {ui?.copyable && (\n              <CopyButton\n                value={value}\n                disabled={isDisabled}\n                className=\"absolute right-0 top-0 h-full px-2.5 text-muted-foreground hover:text-foreground\"\n              />\n            )}\n          </div>\n        </FieldContent>\n\n        {description && !isInvalid && (\n          <FieldDescription id={descriptionId}>{description}</FieldDescription>\n        )}\n\n        {isInvalid && <FieldError id={errorId} errors={errors} />}\n      </Field>\n    </FieldGroup>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/buzzform/fields/email.tsx"
    }
  ],
  "type": "registry:ui"
}