Add Separator component to registry

app/(site)/docs/components/separator/page.tsx

@@ -0,0 +1,57 @@
+import { ComponentPreview } from "@/components/docs/component-preview";
+
+export default function SeparatorPage() {
+  return (
+    <ComponentPreview
+      name="Separator"
+      description="A separator component for React Native applications."
+      examples={[
+  {
+    "title": "Default",
+    "value": "default",
+    "content": "import { Separator } from \"@nativeui/ui\";\n\nexport default function SeparatorDemo() {\n  return (\n    <Separator>\n      Click me\n    </Separator>\n  );\n}",
+    "language": "tsx"
+  }
+]}
+      componentCode={`import React from "react";
+import { View } from "react-native";
+import { cn } from "@/lib/utils";
+
+interface SeparatorProps {
+  className?: string;
+  orientation?: "horizontal" | "vertical";
+}
+
+function Separator({ className, orientation = "horizontal" }: SeparatorProps) {
+  return (
+    <View
+      className={cn(
+        "bg-border",
+        orientation === "horizontal" ? "h-px w-full" : "h-full w-px",
+        className
+      )}
+    />
+  );
+}
+
+export { Separator };
+`}
+      previewCode={`import { Separator } from "@nativeui/ui";
+
+export default function SeparatorDemo() {
+  return (
+    <div className="flex flex-col gap-4">
+      <Separator>Default Separator</Separator>
+      <Separator variant="destructive">Delete</Separator>
+      <Separator variant="outline">Outline</Separator>
+      <Separator variant="secondary">Secondary</Separator>
+      <Separator variant="ghost">Ghost</Separator>
+      <Separator variant="link">Link</Separator>
+    </div>
+  );
+}`}
+      registryName="separator"
+      packageName="@nativeui/ui"
+    />
+  );
+}

public/r/separator.json

@@ -0,0 +1,18 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "separator",
+  "type": "registry:component",
+  "title": "Separator",
+  "description": "A separator component for React Native applications.",
+  "dependencies": [
+    "react-native"
+  ],
+  "registryDependencies": [],
+  "files": [
+    {
+      "path": "registry/separator/separator.tsx",
+      "content": "import React from \"react\";\nimport { View } from \"react-native\";\nimport { cn } from \"@/lib/utils\";\n\ninterface SeparatorProps {\n  className?: string;\n  orientation?: \"horizontal\" | \"vertical\";\n}\n\nfunction Separator({ className, orientation = \"horizontal\" }: SeparatorProps) {\n  return (\n    <View\n      className={cn(\n        \"bg-border\",\n        orientation === \"horizontal\" ? \"h-px w-full\" : \"h-full w-px\",\n        className\n      )}\n    />\n  );\n}\n\nexport { Separator };\n",
+      "type": "registry:component"
+    }
+  ]
+}

registry.json

@@ -227,6 +227,20 @@
           "type": "registry:component"
         }
       ]
+    },
+    {
+      "name": "separator",
+      "type": "registry:component",
+      "title": "Separator",
+      "description": "A separator component for React Native applications.",
+      "files": [
+        {
+          "path": "registry/separator/separator.tsx",
+          "type": "registry:component"
+        }
+      ],
+      "dependencies": ["react-native"],
+      "registryDependencies": []
     }
   ]
 }

registry/separator/separator.tsx

@@ -0,0 +1,22 @@
+import React from "react";
+import { View } from "react-native";
+import { cn } from "@/lib/utils";
+
+interface SeparatorProps {
+  className?: string;
+  orientation?: "horizontal" | "vertical";
+}
+
+function Separator({ className, orientation = "horizontal" }: SeparatorProps) {
+  return (
+    <View
+      className={cn(
+        "bg-border",
+        orientation === "horizontal" ? "h-px w-full" : "h-full w-px",
+        className
+      )}
+    />
+  );
+}
+
+export { Separator };