Chooses a component blueprint and prepares a JSON plan for the table, dropdown, or other supported UI.
1. What Does It Do?
json-renderers-build is a headless specification compiler in the KeshavSoft declarative UI ecosystem.
It accepts a component type, data, and columns, then returns a JSON description of the requested UI. It does not create live DOM elements.
2. A Simple House-Building Story
json-renderers-build — The Architect
json-transformer-funcs — The Helper Team
Functions such as fromCollection() turn lists of data into lists of JSON element descriptions
based on templates.
json-to-tag — The Construction Worker
Reads the JSON element descriptions and creates real browser DOM elements.
json-renderers — The Site Manager
Mounts the generated elements in the correct webpage container.
These are story roles to make each repository responsibility easy to remember.
3. How They Work Together
Data + Columns→Build
Specification→Create DOM→Mount on
Page
- The application supplies data and a component type.
json-renderers-builduses blueprints andjson-to-specto return a JSON specification AST.- Reusable helpers from
json-transformer-funcs, such asfromCollection(), can transform data collections into JSON element descriptions in relevant builders. json-to-tagcreates the real DOM;json-renderersmounts it into the webpage.
4. Example: Build a Table Specification
import render from "json-renderers-build";
const records = [
{ name: "Ravi", city: "Kakinada" },
{ name: "Sita", city: "Visakhapatnam" }
];
const spec = render({
type: "table",
data: records,
columns: [{ title: "Name" }, { title: "City" }]
});
console.log(spec);The result is a JSON UI specification, not a rendered HTML table.
5. Supported Component Types
table— describes a table with headers and data cells.select— describes a dropdown with option elements.selectOptionsOnly— describes options for an existing dropdown.
6. The Important Difference
json-renderers-build: prepares the JSON UI specification.
json-transformer-funcs: provides reusable data-to-JSON transformation helpers.
json-to-tag: creates real DOM elements from JSON descriptions.
json-renderers: mounts those elements into the webpage.
7. Official Documentation
json-renderers-build repository