Implement missing field type components per ObjectStack spec with documentation

apps/site/app/components/ObjectUIProvider.tsx

@@ -2,13 +2,15 @@
 
 // Import components to trigger registration
 import { initializeComponents } from '@object-ui/components';
+import { registerFields } from '@object-ui/fields';
 import { ComponentRegistry } from '@object-ui/core';
 import { useEffect } from 'react';
 
 export function ObjectUIProvider({ children }: { children: React.ReactNode }) {
   // Explicitly call init to ensure components are registered
   useEffect(() => {
     initializeComponents();
+    registerFields();
 
     // Wait a bit for plugins to register, then log
     setTimeout(() => {

apps/site/package.json

@@ -13,6 +13,7 @@
     "@monaco-editor/react": "^4.6.0",
     "@object-ui/components": "workspace:*",
     "@object-ui/core": "workspace:*",
+    "@object-ui/fields": "workspace:*",
     "@object-ui/plugin-aggrid": "workspace:*",
     "@object-ui/plugin-calendar": "workspace:*",
     "@object-ui/plugin-charts": "workspace:*",

content/docs/fields/auto-number.mdx

@@ -0,0 +1,174 @@
+---
+title: "AutoNumber Field"
+description: "Read-only auto-generated sequence number"
+---
+
+import { ComponentDemo, DemoGrid } from '@/app/components/ComponentDemo';
+
+The AutoNumber Field component displays auto-generated sequence numbers. This is a read-only field where the value is automatically generated by the backend when records are created.
+
+## Basic Usage
+
+<ComponentDemo
+  schema={{
+    type: 'auto_number',
+    name: 'order_number',
+    label: 'Order Number',
+    readonly: true,
+    value: 'ORD-0001'
+  }}
+  title="Basic AutoNumber"
+/>
+
+## Custom Format
+
+<ComponentDemo
+  schema={{
+    type: 'auto_number',
+    name: 'invoice_id',
+    label: 'Invoice ID',
+    format: 'INV-{0000}',
+    readonly: true,
+    value: 'INV-1234'
+  }}
+  title="Invoice Number Format"
+/>
+
+## Date-Based Format
+
+<ComponentDemo
+  schema={{
+    type: 'auto_number',
+    name: 'ticket_id',
+    label: 'Ticket ID',
+    format: 'TKT-{YYYY}{MM}-{0000}',
+    readonly: true,
+    value: 'TKT-202403-0567'
+  }}
+  title="Date-Based Ticket ID"
+/>
+
+## Field Schema
+
+```typescript
+interface AutoNumberFieldSchema {
+  type: 'auto_number';
+  name: string;                  // Field name/ID
+  label?: string;                // Field label
+  value?: string | number;       // Generated value (read-only)
+  readonly: true;                // Always read-only
+  className?: string;            // Additional CSS classes
+
+  // AutoNumber Configuration
+  format?: string;               // Number format template
+  starting_number?: number;      // Starting sequence number
+}
+```
+
+## Format Templates
+
+Common format patterns:
+
+### Simple Sequential
+
+```typescript
+format: '{0000}'           // 0001, 0002, 0003...
+format: '{00000}'          // 00001, 00002, 00003...
+```
+
+### With Prefix
+
+```typescript
+format: 'ORD-{0000}'       // ORD-0001, ORD-0002...
+format: 'INV-{00000}'      // INV-00001, INV-00002...
+format: 'CUST-{000}'       // CUST-001, CUST-002...
+```
+
+### Date-Based
+
+```typescript
+format: '{YYYY}-{0000}'    // 2024-0001, 2024-0002...
+format: '{YY}{MM}-{000}'   // 2403-001, 2403-002...
+format: 'ORD-{YYYYMMDD}-{00}'  // ORD-20240315-01...
+```
+
+### Mixed Format
+
+```typescript
+format: 'PO-{YYYY}-{MM}-{0000}'  // PO-2024-03-0001
+format: '{YY}Q{Q}-{000}'         // 24Q1-001, 24Q1-002...
+```
+
+## Format Placeholders
+
+- `{0}`, `{00}`, `{000}`, etc. - Sequential number with padding
+- `{YYYY}` - Four-digit year (2024)
+- `{YY}` - Two-digit year (24)
+- `{MM}` - Two-digit month (03)
+- `{DD}` - Two-digit day (15)
+- `{Q}` - Quarter (1-4)
+
+## Backend Implementation
+
+AutoNumber values are generated on record creation:
+
+```typescript
+const generateAutoNumber = (format: string, sequence: number) => {
+  const now = new Date();
+
+  return format
+    .replace('{YYYY}', now.getFullYear().toString())
+    .replace('{YY}', now.getFullYear().toString().slice(-2))
+    .replace('{MM}', (now.getMonth() + 1).toString().padStart(2, '0'))
+    .replace('{DD}', now.getDate().toString().padStart(2, '0'))
+    .replace('{Q}', Math.ceil((now.getMonth() + 1) / 3).toString())
+    .replace(/\{0+\}/, (match) => {
+      const padding = match.length - 2;
+      return sequence.toString().padStart(padding, '0');
+    });
+};
+
+// Example usage
+generateAutoNumber('ORD-{YYYY}-{0000}', 42);
+// Returns: "ORD-2024-0042"
+```
+
+## Sequence Management
+
+The backend maintains sequence counters:
+
+```typescript
+interface SequenceCounter {
+  object: string;           // Object name
+  field: string;            // Field name
+  current_value: number;    // Current sequence number
+  prefix?: string;          // Optional prefix for partitioning
+}
+
+// Increment sequence atomically
+const getNextSequence = async (object: string, field: string) => {
+  return await db.transaction(async (tx) => {
+    const counter = await tx.findOne('sequences', { object, field });
+    const nextValue = (counter?.current_value || 0) + 1;
+    await tx.upsert('sequences', { object, field }, { current_value: nextValue });
+    return nextValue;
+  });
+};
+```
+
+## Use Cases
+
+- **Order Management**: Order numbers, PO numbers
+- **Invoicing**: Invoice IDs, receipt numbers
+- **Ticketing**: Support ticket IDs, case numbers
+- **Customer Management**: Customer IDs, account numbers
+- **Inventory**: SKU numbers, serial numbers
+- **Document Management**: Document IDs, revision numbers
+
+## Best Practices
+
+1. **Choose appropriate padding**: Use enough digits for expected volume
+2. **Include year for long-running systems**: Helps with archival and partitioning
+3. **Use meaningful prefixes**: Makes numbers self-documenting
+4. **Don't expose internal IDs**: Use auto-numbers for user-facing identifiers
+5. **Consider reset policies**: Decide if/when sequences reset (yearly, monthly, etc.)

content/docs/fields/datetime.mdx

@@ -0,0 +1,101 @@
+---
+title: "DateTime Field"
+description: "Date and time input with combined picker"
+---
+
+import { ComponentDemo, DemoGrid } from '@/app/components/ComponentDemo';
+
+The DateTime Field component provides a combined date and time input for collecting both date and time information in a single field.
+
+## Basic Usage
+
+<ComponentDemo
+  schema={{
+    type: 'datetime',
+    name: 'meeting_time',
+    label: 'Meeting Time',
+    placeholder: 'Select date and time...'
+  }}
+  title="Basic DateTime Field"
+/>
+
+## With Default Value
+
+<ComponentDemo
+  schema={{
+    type: 'datetime',
+    name: 'scheduled_at',
+    label: 'Scheduled At',
+    value: '2024-03-15T14:30'
+  }}
+  title="With Default Value"
+/>
+
+## Required Field
+
+<ComponentDemo
+  schema={{
+    type: 'datetime',
+    name: 'appointment',
+    label: 'Appointment',
+    required: true
+  }}
+  title="Required DateTime"
+/>
+
+## Read-Only
+
+<ComponentDemo
+  schema={{
+    type: 'datetime',
+    name: 'created_at',
+    label: 'Created At',
+    value: '2024-03-15T10:30',
+    readonly: true
+  }}
+  title="Read-Only DateTime"
+/>
+
+## Field Schema
+
+```typescript
+interface DateTimeFieldSchema {
+  type: 'datetime';
+  name: string;                  // Field name/ID
+  label?: string;                // Field label
+  placeholder?: string;          // Placeholder text
+  value?: string;                // Default value (ISO 8601 format)
+  required?: boolean;            // Is field required
+  readonly?: boolean;            // Read-only mode
+  disabled?: boolean;            // Disabled state
+  className?: string;            // Additional CSS classes
+
+  // Validation
+  format?: string;               // Display format
+  min_date?: string | Date;      // Minimum date/time
+  max_date?: string | Date;      // Maximum date/time
+}
+```
+
+## Date Format
+
+The datetime field stores values in ISO 8601 format: `YYYY-MM-DDTHH:mm`
+
+Example: `2024-03-15T14:30` represents March 15, 2024 at 2:30 PM
+
+## Cell Renderer
+
+When used in data tables or grids:
+
+```typescript
+import { DateTimeCellRenderer } from '@object-ui/fields';
+
+// Renders: Mar 15, 2024, 02:30 PM
+```
+
+## Use Cases
+
+- **Event Scheduling**: Meeting times, appointments
+- **Timestamps**: Order placed, task deadline
+- **Booking Systems**: Reservation date and time
+- **Notifications**: Scheduled notification time