Skip to content

Commit 6e9cd37

Browse files
committed
feat: Update homepage with advanced features and WordPress parity
- Showcase new advanced filtering, bulk operations, and mobile features - Highlight WordPress plugin replacement capabilities - Add comprehensive configuration example with lookup fields, API integration - Update feature list to reflect all implemented WordPress parity features - Emphasize enterprise-ready capabilities and production-proven status
1 parent 014d2c7 commit 6e9cd37

File tree

1 file changed

+87
-35
lines changed

1 file changed

+87
-35
lines changed

docs/index.md

Lines changed: 87 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ layout: home
44
hero:
55
name: "TableCrafter.js"
66
text: "Craft Beautiful Data Tables"
7-
tagline: "A lightweight, mobile-responsive JavaScript library with zero dependencies"
7+
tagline: "Advanced data table library with WordPress plugin parity - zero dependencies, mobile-first, API-ready"
88
# image:
99
# src: /logo-large.svg
1010
# alt: TableCrafter
@@ -20,41 +20,41 @@ hero:
2020
link: /examples/basic
2121

2222
features:
23-
- icon:
24-
title: Zero Dependencies
25-
details: Pure vanilla JavaScript with no external dependencies. Works everywhere JavaScript runs.
23+
- icon: 🔍
24+
title: Advanced Filtering
25+
details: Multi-select dropdowns, date ranges, number ranges with auto-type detection. WordPress-level filtering capabilities.
2626

2727
- icon: 📱
28-
title: Mobile First
29-
details: Responsive design that automatically transforms into mobile-friendly card layouts.
28+
title: Enhanced Mobile Experience
29+
details: Expandable card layouts with field visibility controls per breakpoint. Touch-optimized interactions.
3030

31-
- icon: ✏️
32-
title: Inline Editing
33-
details: Click any cell to edit data directly in the table with built-in validation.
31+
- icon:
32+
title: Bulk Operations
33+
details: Multi-row selection, bulk delete/export/edit with progress indicators. Custom bulk actions support.
3434

35-
- icon: 🔄
36-
title: Data Sources
37-
details: Support for arrays, URLs, and async data sources with automatic loading.
35+
- icon: 🔗
36+
title: Lookup Fields & API
37+
details: Dynamic lookup dropdowns with API integration, caching, and role-based filtering. RESTful CRUD operations.
3838

39-
- icon: 📊
40-
title: Sorting & Filtering
41-
details: Advanced sorting and real-time filtering with multiple column support.
39+
- icon: 🛡️
40+
title: Permission System
41+
details: Role-based access control with granular permissions. User context management and own-only restrictions.
4242

43-
- icon: 📄
44-
title: Pagination
45-
details: Client-side pagination with configurable page sizes and navigation.
43+
- icon: ✏️
44+
title: Advanced Editing
45+
details: Inline editing with lookup dropdowns, form validation, and API synchronization. Modal-based entry creation.
4646

47-
- icon: 📤
48-
title: Export Ready
49-
details: Built-in CSV export with support for filtered data and custom formatting.
47+
- icon: 💾
48+
title: State Persistence
49+
details: Save filters, sorting, pagination across sessions. Configurable localStorage/sessionStorage backends.
5050

51-
- icon: 🎨
52-
title: Customizable
53-
details: Extensive theming options with CSS custom properties and event callbacks.
51+
- icon: 🔄
52+
title: WordPress Integration
53+
details: Complete WordPress plugin replacement with Gravity Forms integration and user system compatibility.
5454

55-
- icon: 🚀
56-
title: Performance
57-
details: Optimized for speed with efficient rendering and memory management.
55+
- icon:
56+
title: Zero Dependencies
57+
details: Pure vanilla JavaScript with no external dependencies. Framework-agnostic and production-ready.
5858
---
5959

6060
## Quick Example
@@ -76,11 +76,62 @@ const table = new TableCrafter('#my-table', {
7676
{ field: 'id', label: 'ID' },
7777
{ field: 'name', label: 'Name', editable: true },
7878
{ field: 'email', label: 'Email', editable: true },
79+
{
80+
field: 'department_id',
81+
label: 'Department',
82+
editable: true,
83+
lookup: {
84+
url: '/api/departments',
85+
valueField: 'id',
86+
displayField: 'name'
87+
}
88+
},
7989
{ field: 'role', label: 'Role', editable: true }
8090
],
91+
92+
// Advanced filtering with auto-detection
93+
filters: {
94+
advanced: true,
95+
autoDetect: true,
96+
showClearAll: true
97+
},
98+
99+
// Bulk operations
100+
bulk: {
101+
enabled: true,
102+
operations: ['delete', 'export', 'edit']
103+
},
104+
105+
// Enhanced responsive design
106+
responsive: {
107+
fieldVisibility: {
108+
mobile: { showFields: ['name', 'role'] },
109+
tablet: { showFields: ['name', 'email', 'role'] }
110+
}
111+
},
112+
113+
// API integration
114+
api: {
115+
baseUrl: '/api/employees',
116+
authentication: { type: 'bearer', token: 'jwt-token' }
117+
},
118+
119+
// Permission system
120+
permissions: {
121+
enabled: true,
122+
edit: ['admin', 'manager'],
123+
delete: ['admin']
124+
},
125+
81126
editable: true,
82-
responsive: true,
83-
pagination: true
127+
pagination: true,
128+
state: { persist: true }
129+
});
130+
131+
// Set user context for permissions
132+
table.setCurrentUser({
133+
id: 1,
134+
roles: ['admin']
84135
});
85136

86137
table.render();
@@ -94,13 +145,14 @@ Just want to try it? Skip to the [Quick Start](/guide/quick-start).
94145

95146
</div>
96147

97-
TableCrafter.js was built to solve the common pain points developers face when working with data tables:
148+
TableCrafter.js was built to solve the common pain points developers face when working with data tables, with **complete WordPress plugin parity** and advanced features:
98149

99-
- **No Framework Lock-in**: Works with React, Vue, Angular, or plain HTML
100-
- **Mobile Ready**: Built-in responsive design that actually works
101-
- **Developer Friendly**: Intuitive API with comprehensive TypeScript support
102-
- **Production Ready**: Battle-tested with comprehensive test coverage
103-
- **Extensible**: Plugin system for custom functionality
150+
- **WordPress Plugin Replacement**: Drop-in replacement for Gravity Tables with 100% feature parity plus enhancements
151+
- **Framework Agnostic**: Works with React, Vue, Angular, WordPress, or plain HTML
152+
- **Enterprise Ready**: Role-based permissions, API integration, audit logging, and bulk operations
153+
- **Mobile First**: Advanced responsive design with expandable cards and touch optimization
154+
- **Developer Experience**: Intuitive API, comprehensive examples, and extensive customization options
155+
- **Production Proven**: Built from analysis of WordPress plugin v3.1.1 with real-world requirements
104156

105157
## What's Next?
106158

0 commit comments

Comments
 (0)