Architecture, Scope & Roadmap

How json-renderers-specs compiles headless specifications and where it is going.

All Components

1. The Core Philosophy

Traditional frontend architectures bind data fetching, state management, HTML creation, and DOM event listeners into monolithic components.

In the KeshavSoft Declarative UI Ecosystem, we enforce a strict separation of concerns: data shaping, specification compilation, and DOM mounting are independent, portable phases.

2. The 3-Tier Pipeline

Tier 1 • Input

Data & Schema

Raw business records (data.json) and column definitions (columns.json). Defined once and shared across all visualizations.

Tier 2 • THIS PACKAGE

json-renderers-specs

100% Headless. Compiles data + columns + blueprint definitions into an abstract JSON-to-DOM specification AST. Zero DOM nodes created.

Tier 3 • Downstream

json-renderers

The browser runtime (using @keshavsoft/json-to-dom) that takes the compiled spec AST and mounts live HTMLElement nodes into the page.

3. Dependency Purpose & Role

Every single dependency in package.json serves a precise, singular responsibility without bloat:

Package Role Exact Responsibility
json-renderers-guard Validation Enforces input contracts, safeguarding that config, data, and columns meet spec requirements.
json-instruction-single 1D Transform Executes 1-pass declarative instructions: reading source paths, applying transforms, and writing to target AST nodes.
json-instruction-double 2D Transform Executes nested matrix instructions (rows × columns) to compile tabular body structures (<tbody> cells).
json-renderers-build-table-options Table Features Injects optional table UI enhancements, including serial numbering (#), action buttons (show), and search containers.
json-transformer-funcs Collection Projection Provides fromCollection to project array records into <option> specs for select dropdowns and datalists.

4. Project Roadmap

Phase 1 • Shipped

Core Component Specifications (v1.3.x)

Headless specification builders for Simple Table, Searchable Table, Declarative Form, Select Dropdown, DataList Autocomplete, and Search Input. Single source of truth for columns.json and data.json.

Phase 2 • In Progress

Containers, Layouts & Dialogs

Adding specifications for Card Grids, Tab Views, Modal Dialogs, and Pagination Specs—allowing full multi-screen dashboard generation from declarative JSON.

Phase 3 • Future Scope

Enterprise Schema Contracts & Validation

Deep integration with schema validation (required, regex, numeric boundaries) embedded in column definitions, multi-step wizard specifications, and column-level sorting/filter operators.