{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "terms-and-conditions",
  "type": "registry:ui",
  "title": "Terms and Conditions Dialog",
  "description": "A responsive scrollable dialog with scroll-to-bottom validation before accepting terms - drawer on mobile, modal on desktop.",
  "registryDependencies": [
    "button",
    "https://revola.sameerjs.com/r/revola.json"
  ],
  "files": [
    {
      "path": "registry/revola/examples/origin-ui/scrollables/terms-and-conditions.tsx",
      "content": "\"use client\";\n\nimport { useRef, useState } from \"react\";\n\nimport { Button } from \"@/components/ui/button\";\nimport {\n  ResponsiveDialog,\n  ResponsiveDialogClose,\n  ResponsiveDialogContent,\n  ResponsiveDialogDescription,\n  ResponsiveDialogFooter,\n  ResponsiveDialogHeader,\n  ResponsiveDialogTitle,\n  ResponsiveDialogTrigger,\n} from \"@/components/ui/revola\";\n\nexport default function TermsAndConditionsDialog() {\n  const [hasReadToBottom, setHasReadToBottom] = useState(false);\n  const contentRef = useRef<HTMLDivElement>(null);\n\n  const handleScroll = () => {\n    const content = contentRef.current;\n    if (!content) return;\n\n    const scrollPercentage = content.scrollTop / (content.scrollHeight - content.clientHeight);\n    if (scrollPercentage >= 0.99 && !hasReadToBottom) {\n      setHasReadToBottom(true);\n    }\n  };\n\n  return (\n    <ResponsiveDialog>\n      <ResponsiveDialogTrigger asChild>\n        <Button\n          variant=\"outline\"\n          className=\"h-12 rounded-full px-6 capitalize\"\n          onClick={() => {\n            setHasReadToBottom(false);\n            if (contentRef.current) contentRef.current.scrollTop = 0;\n          }}\n        >\n          Terms & Conditions\n        </Button>\n      </ResponsiveDialogTrigger>\n      <ResponsiveDialogContent className=\"flex max-h-[min(640px,80dvh)] flex-col sm:gap-0\">\n        <ResponsiveDialogHeader className=\"contents space-y-0 text-left\">\n          <ResponsiveDialogTitle className=\"border-b px-6 pb-4 text-base sm:py-4\">\n            Terms & Conditions\n          </ResponsiveDialogTitle>\n\n          <div ref={contentRef} onScroll={handleScroll} className=\"overflow-y-auto\">\n            <ResponsiveDialogDescription asChild>\n              <div className=\"px-6 py-4\">\n                <div className=\"space-y-4 [&_strong]:font-semibold [&_strong]:text-foreground\">\n                  <div className=\"space-y-4\">\n                    <div className=\"space-y-1\">\n                      <p>\n                        <strong>Acceptance of Terms</strong>\n                      </p>\n                      <p>\n                        By accessing and using this website, users agree to comply with and be bound by these Terms of\n                        Service. Users who do not agree with these terms should discontinue use of the website\n                        immediately.\n                      </p>\n                    </div>\n\n                    <div className=\"space-y-1\">\n                      <p>\n                        <strong>User Account Responsibilities</strong>\n                      </p>\n                      <p>\n                        Users are responsible for maintaining the confidentiality of their account credentials. Any\n                        activities occurring under a user&lsquo;s account are the sole responsibility of the account\n                        holder. Users must notify the website administrators immediately of any unauthorized account\n                        access.\n                      </p>\n                    </div>\n\n                    <div className=\"space-y-1\">\n                      <p>\n                        <strong>Content Usage and Restrictions</strong>\n                      </p>\n                      <p>\n                        The website and its original content are protected by intellectual property laws. Users may not\n                        reproduce, distribute, modify, create derivative works, or commercially exploit any content\n                        without explicit written permission from the website owners.\n                      </p>\n                    </div>\n\n                    <div className=\"space-y-1\">\n                      <p>\n                        <strong>Limitation of Liability</strong>\n                      </p>\n                      <p>\n                        The website provides content &ldquo;as is&rdquo; without any warranties. The website owners\n                        shall not be liable for direct, indirect, incidental, consequential, or punitive damages arising\n                        from user interactions with the platform.\n                      </p>\n                    </div>\n\n                    <div className=\"space-y-1\">\n                      <p>\n                        <strong>User Conduct Guidelines</strong>\n                      </p>\n                      <ul className=\"list-disc pl-6\">\n                        <li>Not upload harmful or malicious content</li>\n                        <li>Respect the rights of other users</li>\n                        <li>Avoid activities that could disrupt website functionality</li>\n                        <li>Comply with applicable local and international laws</li>\n                      </ul>\n                    </div>\n\n                    <div className=\"space-y-1\">\n                      <p>\n                        <strong>Modifications to Terms</strong>\n                      </p>\n                      <p>\n                        The website reserves the right to modify these terms at any time. Continued use of the website\n                        after changes constitutes acceptance of the new terms.\n                      </p>\n                    </div>\n\n                    <div className=\"space-y-1\">\n                      <p>\n                        <strong>Termination Clause</strong>\n                      </p>\n                      <p>\n                        The website may terminate or suspend user access without prior notice for violations of these\n                        terms or for any other reason deemed appropriate by the administration.\n                      </p>\n                    </div>\n\n                    <div className=\"space-y-1\">\n                      <p>\n                        <strong>Governing Law</strong>\n                      </p>\n                      <p>\n                        These terms are governed by the laws of the jurisdiction where the website is primarily\n                        operated, without regard to conflict of law principles.\n                      </p>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </ResponsiveDialogDescription>\n          </div>\n        </ResponsiveDialogHeader>\n\n        <ResponsiveDialogFooter className=\"border-t px-6 py-4 sm:items-center\">\n          {!hasReadToBottom && (\n            <span className=\"grow text-xs text-muted-foreground max-sm:text-center\">\n              Read all terms before accepting.\n            </span>\n          )}\n          <div className=\"flex flex-col gap-2 sm:flex-row-reverse sm:gap-4\">\n            <ResponsiveDialogClose asChild>\n              <Button type=\"button\" disabled={!hasReadToBottom}>\n                I agree\n              </Button>\n            </ResponsiveDialogClose>\n            <ResponsiveDialogClose asChild className=\"sm:flex-row-reverse sm:justify-start\">\n              <Button type=\"button\" variant=\"outline\">\n                Cancel\n              </Button>\n            </ResponsiveDialogClose>\n          </div>\n        </ResponsiveDialogFooter>\n      </ResponsiveDialogContent>\n    </ResponsiveDialog>\n  );\n}\n",
      "type": "registry:ui"
    }
  ]
}