Stephan
39fe0c81e5
added dummy pages for about and contact. updated tailwind.config.js to include config/*.json to scan for classes. refactored system basics. Removed component-props, using generic LayoutComponentDefinition and LayoutContext. cleanup component-map. Updated renderer to be more failsafe. new abstracted components: vt-mega-menu, vt-sidemenu, vt-banner with 3 variants, vt-header, vt-homebutton, vt-cartbutton, vt-accountbutton, vt-linkbutton,
28 lines
954 B
TypeScript
28 lines
954 B
TypeScript
import React from "react"
|
|
import { ComponentName, LayoutComponentDefinition, LayoutComponentNode, LayoutContext, componentMap } from "./component-map"
|
|
|
|
export interface DynamicLayoutRendererProps {
|
|
nodes: LayoutComponentNode[]
|
|
context: LayoutContext
|
|
}
|
|
|
|
export function DynamicLayoutRenderer({ nodes, context } : DynamicLayoutRendererProps) {
|
|
|
|
const nodeArray = Array.isArray(nodes) ? nodes : [nodes];
|
|
|
|
return nodeArray.map((entry, index) => {
|
|
const [key, value] = Object.entries(entry)[0] as [ComponentName, LayoutComponentDefinition]
|
|
|
|
if (!value) {
|
|
console.warn(`[UI-Builder] Component definition is undefined: ${key}`);
|
|
return null;
|
|
}
|
|
|
|
const component = componentMap[key];
|
|
if (!component) {
|
|
console.warn(`[UI-Builder] Unknown component: ${key}`);
|
|
return null;
|
|
}
|
|
return <React.Fragment key={`${key}-${index}`}>{component.render(value, context)}</React.Fragment>
|
|
})
|
|
} |