{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "p-field-5",
  "description": "Show field validity state",
  "registryDependencies": [
    "@coss/field",
    "@coss/input"
  ],
  "files": [
    {
      "path": "registry/default/particles/p-field-5.tsx",
      "content": "\"use client\";\n\nimport { Field, FieldLabel, FieldValidity } from \"@/registry/default/ui/field\";\nimport { Input } from \"@/registry/default/ui/input\";\n\nexport default function FieldWithValidityDemo() {\n  return (\n    <Field>\n      <FieldLabel>Email</FieldLabel>\n      <Input placeholder=\"Enter your email\" required type=\"email\" />\n      <FieldValidity>\n        {(validity) => (\n          <div className=\"flex w-full flex-col gap-2\">\n            {validity.error && (\n              <p className=\"text-destructive-foreground text-xs\">\n                {validity.error}\n              </p>\n            )}\n            <div className=\"w-full rounded-md bg-muted p-2\">\n              <pre className=\"max-h-60 overflow-y-auto font-mono text-xs [scrollbar-width:none]\">\n                {JSON.stringify(validity, null, 2)}\n              </pre>\n            </div>\n          </div>\n        )}\n      </FieldValidity>\n    </Field>\n  );\n}\n",
      "type": "registry:block"
    }
  ],
  "meta": {
    "className": "**:data-[slot=preview]:w-full **:data-[slot=preview]:max-w-64"
  },
  "categories": [
    "field",
    "input"
  ],
  "type": "registry:block"
}