Update Docs

CONTRIBUTING.md

@@ -8,10 +8,12 @@ Thank you for your interest in contributing to `rnr-registry-template`! We welco
 
 1. Fork the repository to your GitHub account.
 2. Clone the forked repository to your local machine:
+
    ```bash
    git clone https://github.com/your-username/rnr-registry-template.git
    cd rnr-registry-template
    ```
+
 3. Create a new branch:
 
    ```bash
@@ -41,18 +43,18 @@ Please follow the coding style and guidelines used in the project. If there are
 
 ## Issue Tracker
 
-Check the [issue tracker](https://github.com/gabimoncha/rnr-registry-template/issues) for existing issues or open a new issue to discuss and coordinate your contribution with the maintainers.
+Check the [issue tracker](https://github.com/next-dev-team/next-dev/issues) for existing issues or open a new issue to discuss and coordinate your contribution with the maintainers.
 
 ## Code of Conduct
 
-Please review and adhere to our [Code of Conduct](https://github.com/gabimoncha/rnr-registry-template/blob/main/CODE_OF_CONDUCT.md). Be respectful and considerate towards others.
+Please review and adhere to our [Code of Conduct](https://github.com/next-dev-team/next-dev/blob/main/CODE_OF_CONDUCT.md). Be respectful and considerate towards others.
 
 ## License
 
-By contributing to this project, you agree that your contributions will be licensed under the [LICENSE](https://github.com/gabimoncha/rnr-registry-template/blob/main/LICENSE) file of this repository.
+By contributing to this project, you agree that your contributions will be licensed under the [LICENSE](https://github.com/next-dev-team/next-dev/blob/main/LICENSE) file of this repository.
 
 ## Contact
 
-If you have any questions or need further assistance, feel free to contact us at hello@foundedlabs.com.
+If you have any questions or need further assistance, feel free to contact us at <hello@foundedlabs.com>.
 
 **We appreciate your contributions and look forward to working with you!**

apps/docs/app/(home)/layout.tsx

@@ -16,7 +16,7 @@ export default function Layout({ children }: { children: ReactNode }) {
     <>
       <SkipNavigationButton />
       <HomeLayout
-        githubUrl="https://github.com/gabimoncha/rnr-registry-template"
+        githubUrl="https://github.com/next-dev-team/next-dev"
         nav={{
           title: (
             <div className="hover:bg-fd-accent -ml-0.5 flex size-8 items-center justify-center rounded-md transition-colors duration-200">

apps/docs/app/docs/[[...slug]]/page.tsx

@@ -123,7 +123,7 @@ function Footer({ url }: { url: string }) {
           </a>{' '}
           to React Native. Source on{' '}
           <a
-            href="https://github.com/gabimoncha/rnr-registry-template"
+            href="https://github.com/next-dev-team/next-dev"
             target="_blank"
             rel="noreferrer"
             className="underline underline-offset-4">

apps/docs/app/docs/layout.tsx

@@ -18,12 +18,12 @@ export default function Layout({ children }: { children: ReactNode }) {
               <div className="flex items-center justify-center">
                 <RnrIcon />
               </div>
-              <p className="text-base">Registry Template</p>
+              <p className="text-base">Next Dev</p>
             </div>
           ),
         }}
         sidebar={SIDEBAR_PROPS}
-        githubUrl="https://github.com/gabimoncha/rnr-registry-template">
+        githubUrl="https://github.com/next-dev-team/next-dev">
         {children}
       </DocsLayout>
     </>

apps/docs/components/utils.tsx

@@ -442,4 +442,4 @@ export function ObjectUtilityPlayground() {
       )}
     </BaseUtilityPlayground>
   );
-}
+}

apps/docs/content/docs/changelog.mdx

@@ -3,6 +3,6 @@ title: Changelog
 description: Latest updates and announcements.
 ---
 
-## August 2025 - Initial Release
+## Nov 2025 - Initial Release
 
 New React Native Reusables registry template.

apps/docs/content/docs/components/form-advanced.mdx

@@ -0,0 +1,219 @@
+---
+title: Advanced Form Patterns
+description: Advanced form patterns including dynamic fields, custom validation, and field dependencies using rc-field-form.
+---
+
+import {
+  FormFieldTypesPreview,
+  FormCustomValidationPreview,
+  FormDynamicFieldsPreview,
+  FormFieldDependenciesPreview,
+  FormAsyncValidationPreview
+} from '@docs/components/examples';
+
+<ExternalLinks
+  links={[
+    { title: 'rc-field-form Docs', url: 'https://github.com/react-component/field-form' },
+  ]}
+/>
+
+<div className="h-5" />
+
+## Field Types Example
+
+Demonstrates various input field types including text, email, phone, password, and textarea fields.
+
+<Tabs defaultValue="preview">
+  <TabsList>
+    <TabsTrigger value="preview">Preview</TabsTrigger>
+    <TabsTrigger value="code">Code</TabsTrigger>
+  </TabsList>
+  <TabsContent value="preview">
+    <PreviewCard preview={<FormFieldTypesPreview />} />
+  </TabsContent>
+  <TabsContent value="code">
+    ```json doc-gen:file
+    {
+      "file": "./node_modules/@rnr/rnr-ui/src/examples/form/form-field-types.tsx",
+      "codeblock": {
+        "lang": "tsx"
+      }
+    }
+    ```
+  </TabsContent>
+</Tabs>
+
+## Custom Validation Example
+
+Shows how to implement custom validation rules with complex business logic and field dependencies.
+
+<Tabs defaultValue="preview">
+  <TabsList>
+    <TabsTrigger value="preview">Preview</TabsTrigger>
+    <TabsTrigger value="code">Code</TabsTrigger>
+  </TabsList>
+  <TabsContent value="preview">
+    <PreviewCard preview={<FormCustomValidationPreview />} />
+  </TabsContent>
+  <TabsContent value="code">
+    ```json doc-gen:file
+    {
+      "file": "./node_modules/@rnr/rnr-ui/src/examples/form/form-custom-validation.tsx",
+      "codeblock": {
+        "lang": "tsx"
+      }
+    }
+    ```
+  </TabsContent>
+</Tabs>
+
+## Dynamic Fields Example
+
+Demonstrates how to create forms with dynamically added and removed fields.
+
+<Tabs defaultValue="preview">
+  <TabsList>
+    <TabsTrigger value="preview">Preview</TabsTrigger>
+    <TabsTrigger value="code">Code</TabsTrigger>
+  </TabsList>
+  <TabsContent value="preview">
+    <PreviewCard preview={<FormDynamicFieldsPreview />} />
+  </TabsContent>
+  <TabsContent value="code">
+    ```json doc-gen:file
+    {
+      "file": "./node_modules/@rnr/rnr-ui/src/examples/form/form-dynamic-fields.tsx",
+      "codeblock": {
+        "lang": "tsx"
+      }
+    }
+    ```
+  </TabsContent>
+</Tabs>
+
+## Field Dependencies Example
+
+Shows how to create conditional fields and validation based on other field values.
+
+<Tabs defaultValue="preview">
+  <TabsList>
+    <TabsTrigger value="preview">Preview</TabsTrigger>
+    <TabsTrigger value="code">Code</TabsTrigger>
+  </TabsList>
+  <TabsContent value="preview">
+    <PreviewCard preview={<FormFieldDependenciesPreview />} />
+  </TabsContent>
+  <TabsContent value="code">
+    ```json doc-gen:file
+    {
+      "file": "./node_modules/@rnr/rnr-ui/src/examples/form/form-field-dependencies.tsx",
+      "codeblock": {
+        "lang": "tsx"
+      }
+    }
+    ```
+  </TabsContent>
+</Tabs>
+
+## Async Validation Example
+
+Demonstrates asynchronous validation with simulated API calls for username, email, and phone validation.
+
+<Tabs defaultValue="preview">
+  <TabsList>
+    <TabsTrigger value="preview">Preview</TabsTrigger>
+    <TabsTrigger value="code">Code</TabsTrigger>
+  </TabsList>
+  <TabsContent value="preview">
+    <PreviewCard preview={<FormAsyncValidationPreview />} />
+  </TabsContent>
+  <TabsContent value="code">
+    ```json doc-gen:file
+    {
+      "file": "./node_modules/@rnr/rnr-ui/src/examples/form/form-async-validation.tsx",
+      "codeblock": {
+        "lang": "tsx"
+      }
+    }
+    ```
+  </TabsContent>
+</Tabs>
+
+## Key Concepts
+
+### Custom Validators
+
+Custom validators receive three parameters: `rule`, `value`, and `callback`. They should return a Promise that resolves when validation passes or rejects with an error message when validation fails.
+
+```tsx
+const validateUsername = async (_: any, value: string) => {
+  if (!value) {
+    return Promise.reject(new Error('Username is required'));
+  }
+  // Additional validation logic
+  return Promise.resolve();
+};
+
+<Form.Item
+  name="username"
+  label="Username"
+  rules={[{ validator: validateUsername }]}
+>
+  <TextInput placeholder="Enter username" />
+</Form.Item>
+```
+
+### Field Dependencies
+
+Use `dependencies` to make one field depend on another. The dependent field will re-validate when the dependency changes.
+
+```tsx
+<Form.Item
+  name="confirmPassword"
+  label="Confirm Password"
+  dependencies={['password']}
+  rules={[{ validator: validateConfirmPassword }]}
+>
+  <TextInput placeholder="Confirm password" secureTextEntry />
+</Form.Item>
+```
+
+### Dynamic Fields
+
+Manage arrays of fields using React state and render them dynamically with proper field names.
+
+```tsx
+{emails.map((_, index) => (
+  <Form.Item
+    key={index}
+    name={['emails', index]}
+    rules={[{ required: true, message: 'Email is required' }]}
+  >
+    <TextInput placeholder={`Email ${index + 1}`} />
+  </Form.Item>
+))}
+```
+
+### Async Validation
+
+Async validators can perform API calls or other asynchronous operations. Use `validateTrigger="onBlur"` to validate on field blur instead of every change.
+
+```tsx
+<Form.Item
+  name="username"
+  label="Username"
+  rules={[{ validator: validateUsername }]}
+  validateTrigger="onBlur"
+>
+  <TextInput placeholder="Enter username" />
+</Form.Item>
+```
+
+## Best Practices
+
+1. **Use `validateTrigger="onBlur"`** for async validation to avoid excessive API calls
+2. **Provide clear error messages** that help users understand what they need to fix
+3. **Use field dependencies** to create conditional validation logic
+4. **Handle loading states** during async validation to improve user experience
+5. **Validate on the client first** before making async calls to reduce server load
+6. **Use proper TypeScript types** for better development experience and error catching