@woodylab/payload 0.0.122 → 0.0.123

package/dist/config/react/Card.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+type CardProps = {
+    children?: ReactNode;
+};
+export declare const Card: ({ children }: CardProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/config/react/Card.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const Card = ({ children }) => {
+    return _jsx("div", { children: children ?? 'Card works' });
+};

package/dist/config/react/ComponentRenderer.d.ts

@@ -0,0 +1 @@
+export declare function ComponentRenderer({ type, view, data }: any): import("react/jsx-runtime").JSX.Element | null;

package/dist/config/react/ComponentRenderer.js

@@ -0,0 +1,29 @@
+// components/ComponentRenderer.tsx
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { componentRegistry } from './registry';
+function getValueByPath(obj, path) {
+    return path.split('.').reduce((acc, key) => acc?.[key], obj);
+}
+export function ComponentRenderer({ type, view, data }) {
+    if (type !== 'view')
+        return null;
+    const rows = data[view.dataSet];
+    const Container = componentRegistry[view.component.componentName];
+    const Row = componentRegistry[view.rowComponent.componentName];
+    if (!Container || !Row)
+        return null;
+    const containerClassNames = Array.isArray(view.viewMode)
+        ? view.viewMode.map((mode) => mode?.className || '').join(' ')
+        : '';
+    return (_jsx(Container, { className: containerClassNames, children: rows.map((item, i) => {
+            const props = {};
+            for (const [k, v] of Object.entries(view.rowPropsMapping ?? {})) {
+                props[k] = getValueByPath(item, v);
+            }
+            const rowClassNames = Array.isArray(view.rowViewMode)
+                ? view.rowViewMode.map((mode) => mode?.className || '').join(' ')
+                : '';
+            return _jsx(Row, { ...props, className: rowClassNames }, i);
+        }) }));
+}

package/dist/config/react/PageRenderer.d.ts

@@ -0,0 +1,4 @@
+export declare function PageRenderer({ layout, serverData, }: {
+    layout: any[];
+    serverData: Record<number, any[]>;
+}): Promise<import("react/jsx-runtime").JSX.Element>;

package/dist/config/react/PageRenderer.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+// #TODO Gestire doppio caricamento dati:
+// 1 lato payload usando come già fatto api interne di payload mappando i campi in un blocco di tipo view dedicato
+import { resolveInlineComponent } from '../utils/resolveInlineComponent';
+import { ViewBlock } from './ViewBlock';
+// 2 recupero dati sempre lato server chiamando un EP in maniera asincrona e gestendo il corretto binding
+export async function PageRenderer({ layout, serverData, }) {
+    const resolvedLayout = layout.map((block, index) => {
+        if (block.blockType !== 'view')
+            return block;
+        console.log(block);
+        console.log(serverData);
+        return {
+            blockType: block.blockType,
+            component: block.component,
+            viewMode: block.viewMode,
+            containerProps: block.containerProps,
+            rowComponent: block.rowComponent,
+            rowViewMode: block.rowViewMode,
+            rowPropsMapping: block.rowPropsMapping,
+            rowChildren: block.rowChildren,
+            _resolvedData: serverData[index] ?? [],
+            _resolvedOk: true,
+        };
+    });
+    return (_jsx(_Fragment, { children: resolvedLayout.map((block, i) => {
+            if (block.blockType === 'view') {
+                return _jsx(ViewBlock, { ...block }, i);
+            }
+            const resolved = resolveInlineComponent(block);
+            if (!resolved)
+                return null;
+            const { Component, props } = resolved;
+            return _jsx(Component, { ...props }, i);
+        }) }));
+}

package/dist/config/react/ViewBlock.d.ts

@@ -0,0 +1 @@
+export declare function ViewBlock(block: any): import("react/jsx-runtime").JSX.Element | null;

package/dist/config/react/ViewBlock.js

@@ -0,0 +1,62 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { componentRegistry } from './registry';
+function resolveClassName(viewMode) {
+    if (Array.isArray(viewMode) && viewMode.length > 0) {
+        return viewMode
+            .map((vm) => vm?.css.className)
+            .filter(Boolean)
+            .join(' ');
+    }
+    return viewMode?.css.className ?? '';
+}
+export function ViewBlock(block) {
+    const { component, viewMode, rowComponent, rowViewMode, containerProps = {}, rowPropsMapping = {}, rowChildren = [], _resolvedData = [], _resolvedOk = true, } = block;
+    const Container = componentRegistry[component.componentName];
+    const Row = componentRegistry[rowComponent.componentName];
+    if (!Container || !Row)
+        return null;
+    if (!_resolvedOk) {
+        return (_jsx(Container, { className: resolveClassName(viewMode), children: _jsx("div", { className: "text-red-600", children: "Impossibile caricare i dati" }) }));
+    }
+    //#TODO gestire rendering di molteplici rowChildren al mometno stampa solo il primo elemento dell'array
+    // --- helper per render figli di riga (con sourceProps mapping) ---
+    const renderRowChildren = (children, item) => {
+        return children.map((child, idx) => {
+            const ChildComp = componentRegistry[child.definition?.componentName];
+            if (!ChildComp)
+                return null;
+            const childVM = Array.isArray(child.viewMode) ? child.viewMode[0] : child.viewMode;
+            const hasSourceProps = child.sourceProps &&
+                typeof child.sourceProps === 'object' &&
+                Object.keys(child.sourceProps).length > 0;
+            let finalProps = {};
+            if (hasSourceProps) {
+                for (const [key, path] of Object.entries(child.sourceProps)) {
+                    // @ts-ignore
+                    finalProps[key] = path
+                        .toString()
+                        .split('.')
+                        .reduce((acc, k) => acc?.[k], item);
+                }
+            }
+            else {
+                // fallback ai props statici
+                finalProps = child.staticProps || {};
+            }
+            return _jsx(ChildComp, { ...finalProps, className: resolveClassName(childVM) }, idx);
+        });
+    };
+    return (_jsx(Container, { className: resolveClassName(viewMode), ...containerProps, children: _resolvedData.map((item, i) => {
+            const props = {};
+            // mapping valori verso props della card
+            for (const [key, path] of Object.entries(rowPropsMapping)) {
+                // @ts-ignore
+                props[key] = path
+                    .toString()
+                    .split('.')
+                    .reduce((acc, k) => acc?.[k], item);
+            }
+            return (_jsx(Row, { ...props, className: resolveClassName(rowViewMode), children: rowChildren?.length > 0 ? renderRowChildren(rowChildren, item) : null }, i));
+        }) }));
+}

package/dist/config/react/index.d.ts

@@ -0,0 +1,5 @@
+export { Card } from './Card';
+export { ViewBlock } from './ViewBlock';
+export { ComponentRenderer } from './ComponentRenderer';
+export { PageRenderer } from './PageRenderer';
+export * from './registry';

package/dist/config/react/index.js

@@ -0,0 +1,5 @@
+export { Card } from './Card';
+export { ViewBlock } from './ViewBlock';
+export { ComponentRenderer } from './ComponentRenderer';
+export { PageRenderer } from './PageRenderer';
+export * from './registry';

package/dist/config/react/registry.d.ts

@@ -0,0 +1 @@
+export declare const componentRegistry: Record<string, any>;

package/dist/config/react/registry.js

@@ -0,0 +1,5 @@
+// components/registry.ts
+import { Card } from './Card';
+export const componentRegistry = {
+    Card,
+};

package/dist/config/utils/resolveInlineComponent.d.ts

@@ -0,0 +1,4 @@
+export declare function resolveInlineComponent(block: any): {
+    Component: any;
+    props: any;
+} | null;

package/dist/config/utils/resolveInlineComponent.js

@@ -0,0 +1,35 @@
+// uims/resolveInlineComponent.ts
+import { componentRegistry } from '../react';
+export function resolveInlineComponent(block) {
+    const { definition, viewMode } = block;
+    if (!definition)
+        return null;
+    const Component = componentRegistry[definition.componentName];
+    if (!Component)
+        return null;
+    /* Caso CTA (inline typed) */
+    if (block.blockType === 'cta-block') {
+        return {
+            Component,
+            props: {
+                title: block.title,
+                description: block.description,
+                action: block.actionLabel
+                    ? {
+                        label: block.actionLabel,
+                        href: block.actionHref,
+                    }
+                    : undefined,
+                className: viewMode?.css.className ?? definition.defaultStyle,
+            },
+        };
+    }
+    /* Caso component-instance generico */
+    return {
+        Component,
+        props: {
+            ...(block.props ?? {}),
+            className: viewMode?.css.className ?? definition.defaultStyle,
+        },
+    };
+}

package/dist/config/utils/resolveViewRow.d.ts

@@ -0,0 +1,4 @@
+export declare function resolveViewRow({ item, rowComponent, rowViewMode, rowPropsMapping }: any): {
+    Row: any;
+    props: Record<string, any>;
+} | null;

package/dist/config/utils/resolveViewRow.js

@@ -0,0 +1,15 @@
+// uims/resolveViewRow.ts
+import { componentRegistry } from '../react';
+export function resolveViewRow({ item, rowComponent, rowViewMode, rowPropsMapping }) {
+    const Row = componentRegistry[rowComponent.componentName];
+    console.log(rowComponent);
+    if (!Row)
+        return null;
+    const props = {};
+    for (const prop in rowPropsMapping) {
+        const path = rowPropsMapping[prop];
+        props[prop] = path.split('.').reduce((acc, key) => acc?.[key], item);
+    }
+    props.className = rowViewMode?.css.className ?? rowComponent.defaultStyle;
+    return { Row, props };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@woodylab/payload",
-  "version": "0.0.122",
+  "version": "0.0.123",
   "type": "module",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.esm.js",