@woodylab/payload 0.0.13 → 0.0.14

package/dist/{fieldRoles-bNqKk0DO.js → fieldRoles-BbW92YWL.js}

@@ -35,6 +35,35 @@ const fieldCheckbox = (override) => ({
     ...override,
 });
 
+const fieldNumber = (override) => ({
+    name: 'number',
+    label: 'Number',
+    type: 'number',
+    required: false,
+    ...override,
+});
+
+const fieldRelationship = (relationTo, override) => ({
+    name: 'relationship',
+    label: 'Relationship',
+    type: 'relationship',
+    relationTo,
+    required: false,
+    ...override,
+});
+
+const fieldRichText = (override) => ({
+    name: 'richText',
+    label: 'Rich Text',
+    type: 'richText',
+    required: false,
+    admin: {
+        placeholder: 'Insert text here',
+        rows: 5,
+    },
+    ...override,
+});
+
 const fieldSelect = (override) => ({
     name: 'select',
     label: 'select',
@@ -44,6 +73,134 @@ const fieldSelect = (override) => ({
     ...override
 });
 
+const fieldContainerProps = (customFields = []) => {
+    return {
+        name: 'ctrP',
+        label: 'Proprietà container',
+        type: 'group',
+        fields: [
+            ...customFields,
+            fieldRichText({ name: 'body', label: 'Contenuto', required: false }),
+            fieldContainerWidths(),
+            {
+                type: 'tabs',
+                tabs: [
+                    {
+                        label: 'Stile',
+                        fields: [
+                            fieldUpload('media', { name: 'bgi', label: 'Immagine di sfondo' }),
+                            //WFieldColor({name:'bgc', label:'Colore di sfondo', required:false}),
+                            {
+                                name: 'borderRadius',
+                                type: 'select',
+                                label: 'Angoli arrotondati',
+                                defaultValue: 'rounded-none',
+                                options: [
+                                    { label: 'Nessuno', value: 'rounded-none' },
+                                    { label: 'Piccolo', value: 'rounded-sm' },
+                                    { label: 'Medio', value: 'rounded-md' },
+                                    { label: 'Grande', value: 'rounded-lg' },
+                                    { label: 'Extra Grande', value: 'rounded-xl' },
+                                    { label: 'Massimo', value: 'rounded-full' },
+                                ],
+                                admin: {
+                                    width: '50%',
+                                    description: 'Imposta lo stile degli angoli arrotondati del contenitore.',
+                                },
+                            },
+                            {
+                                name: 'boxShadow',
+                                type: 'select',
+                                label: 'Ombra contenitore',
+                                defaultValue: 'shadow-none', // Default: nessuna ombra
+                                options: [
+                                    { label: 'Nessuna', value: 'shadow-none' },
+                                    { label: 'Piccola', value: 'shadow-sm' },
+                                    { label: 'Normale', value: 'shadow' },
+                                    { label: 'Media', value: 'shadow-md' },
+                                    { label: 'Grande', value: 'shadow-lg' },
+                                    { label: 'Extra Grande', value: 'shadow-xl' },
+                                    { label: 'Massima', value: 'shadow-2xl' },
+                                ],
+                                admin: {
+                                    width: '50%',
+                                    description: 'Imposta lo stile dell\'ombra per il contenitore.',
+                                },
+                            }
+                        ]
+                    },
+                    {
+                        label: 'Dimensioni',
+                        fields: [
+                            fieldHeights(),
+                            {
+                                type: 'tabs',
+                                tabs: [
+                                    {
+                                        label: 'Margini',
+                                        fields: [
+                                            fieldMargins()
+                                        ]
+                                    },
+                                    {
+                                        label: 'Paddings',
+                                        fields: [
+                                            fieldPaddings()
+                                        ]
+                                    }
+                                ]
+                            }
+                        ]
+                    }
+                ]
+            },
+        ]
+    };
+};
+
+const fieldThemeColor = (override) => ({
+    name: override?.name || 'color',
+    label: override?.label || 'Colore',
+    type: 'select',
+    required: override?.required ?? false,
+    options: [
+        { label: 'Default', value: '' },
+        { label: 'Foreground', value: 'foreground' },
+        { label: 'Primary', value: 'primary' },
+        { label: 'Secondary', value: 'secondary' },
+        { label: 'Accent', value: 'accent' },
+        { label: 'Dark', value: 'dark' },
+        { label: 'Light', value: 'light' },
+        { label: 'White', value: 'white' },
+        { label: 'Black', value: 'black' },
+    ],
+    admin: {
+        ...override?.admin,
+    },
+});
+
+const fieldConfigProps = (customFields = []) => {
+    return {
+        name: 'config',
+        label: 'Configurazione',
+        type: 'group',
+        fields: [
+            ...customFields,
+        ],
+    };
+};
+
+const fieldContentProps = (customFields = []) => {
+    return {
+        name: 'cntP',
+        label: 'Contenuto',
+        type: 'group',
+        fields: [
+            ...customFields,
+        ],
+    };
+};
+
 /**
  * Costante che definisce le varianti di larghezza del container come classi Tailwind
  */
@@ -687,6 +844,409 @@ var index = /*#__PURE__*/Object.freeze({
     TailwindWidths: TailwindWidths
 });
 
+/**
+ * Genera un campo per la selezione delle altezze
+ * @returns Field - Campo di tipo `select` per PayloadCMS
+ */
+const fieldViewportHeights = () => {
+    return fieldSelect({
+        name: 'h',
+        label: 'Altezza',
+        type: 'select',
+        options: [{ value: '', label: '(Nessuno)' }, ...TailwindViewportHeights.map(h => ({ value: `h-${h}`, label: h }))],
+        admin: {
+            description: 'Definisce l’altezza dell’elemento.',
+            width: '50%'
+        },
+    });
+};
+
+const fieldSectionProps = (customFields = []) => {
+    return {
+        name: 'sctP',
+        label: 'Proprietà sezione',
+        type: 'group',
+        fields: [
+            ...customFields,
+            fieldRichText({ name: 'body', label: 'Contenuto', required: false }),
+            {
+                type: 'tabs',
+                tabs: [
+                    {
+                        label: 'Stile',
+                        fields: [
+                            fieldUpload('media', { name: 'bgi', label: 'Immagine di sfondo' }),
+                            fieldThemeColor({ name: 'bgc', label: 'Colore di sfondo', required: false }),
+                        ]
+                    }
+                ]
+            },
+            {
+                type: 'tabs',
+                tabs: [
+                    {
+                        label: 'Dimensioni',
+                        fields: [
+                            fieldViewportHeights(),
+                            {
+                                type: 'tabs',
+                                tabs: [{
+                                        label: 'Margini',
+                                        fields: [
+                                            fieldMargins()
+                                        ]
+                                    },
+                                    {
+                                        label: 'Paddings',
+                                        fields: [
+                                            fieldPaddings()
+                                        ]
+                                    }
+                                ]
+                            }
+                        ]
+                    }
+                ]
+            },
+        ],
+    };
+};
+
+const fieldSectionTabs = (options = {}) => {
+    const { config = true, section = true, container = true, content = true, configFields = [], sectionFields = [], containerFields = [], contentFields = [] } = options;
+    const tabs = [];
+    if (config) {
+        tabs.push({
+            label: 'Configurazione',
+            fields: [
+                fieldConfigProps(configFields)
+            ],
+        });
+    }
+    // Tab per la sezione
+    if (section) {
+        tabs.push({
+            label: 'Sezione',
+            fields: [
+                fieldSectionProps(sectionFields)
+            ],
+        });
+    }
+    // Tab per il container
+    if (container) {
+        tabs.push({
+            label: 'Container',
+            fields: [
+                fieldContainerProps(containerFields)
+            ],
+        });
+    }
+    // Tab per il contenuto
+    if (content) {
+        tabs.push({
+            label: 'Contenuto',
+            fields: [
+                fieldContentProps(contentFields)
+            ],
+        });
+    }
+    return {
+        type: 'tabs',
+        tabs: tabs,
+    };
+};
+
+/**
+ * Genera un campo per la selezione delle larghezze del container
+ * @returns Field - Campo di tipo `select` per PayloadCMS
+ */
+const fieldContainerWidths = () => {
+    return fieldSelect({
+        name: 'container',
+        label: 'Larghezza del container',
+        options: [{ value: '', label: '(Nessuno)' }, ...TailwindContainerWidths],
+        admin: {
+            description: 'Seleziona una larghezza massima per il container. Usa "None" per una larghezza a schermo intero.',
+        },
+    });
+};
+
+/**
+ * Genera un campo per la selezione delle altezze
+ * @returns Field - Campo di tipo `select` per PayloadCMS
+ */
+const fieldHeights = () => {
+    return fieldSelect({
+        name: 'h',
+        label: 'Altezza',
+        type: 'select',
+        defaultValue: 'h-full',
+        options: [{ value: '', label: '(Nessuno)' }, ...TailwindHeights.map(h => ({ value: `h-${h}`, label: h }))],
+        admin: {
+            description: 'Definisce l’altezza dell’elemento.',
+        },
+    });
+};
+
+const concatMarginFields = (args) => {
+    const { value, siblingData, operation, } = args;
+    if (operation === 'create' || operation === 'update') {
+        const margins = siblingData || {};
+        const { all, x, y, t, r, b, l } = margins;
+        const classes = [];
+        if (all)
+            classes.push(`m-${all}`);
+        if (x)
+            classes.push(`mx-${x}`);
+        if (y)
+            classes.push(`my-${y}`);
+        if (t)
+            classes.push(`mt-${t}`);
+        if (r)
+            classes.push(`mr-${r}`);
+        if (b)
+            classes.push(`mb-${b}`);
+        if (l)
+            classes.push(`ml-${l}`);
+        return classes.join(' ');
+    }
+    return value;
+};
+/**
+ * Genera un campo per la selezione dinamica dei margini
+ * @returns Field - Campo di tipo `group` per PayloadCMS
+ */
+const fieldMargins = () => {
+    return {
+        name: 'm',
+        label: 'Margini',
+        type: 'group',
+        fields: [
+            {
+                name: 'className',
+                label: 'Classi CSS Margini',
+                type: 'text',
+                hooks: {
+                    beforeChange: [concatMarginFields],
+                },
+                admin: {
+                    readOnly: true,
+                    description: 'Questa stringa verrà generata automaticamente in base ai campi sottostanti.',
+                },
+            },
+            {
+                type: 'row',
+                fields: [
+                    fieldNumber({
+                        name: 'all',
+                        label: 'Tutti i lati',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '33%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 'x',
+                        label: 'Orizzontale',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '33%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 'y',
+                        label: 'Verticale',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '33%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 't',
+                        label: 'Top',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '25%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 'r',
+                        label: 'Right',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '25%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 'b',
+                        label: 'Bottom',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '25%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 'l',
+                        label: 'Left',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '25%'
+                        }
+                    }),
+                ]
+            }
+        ],
+        admin: {
+            description: 'Definisce lo spazio esterno generale, orizzontale, verticale o per ciascun lato.',
+        },
+    };
+};
+
+/**
+ * Hook per concatenare le classi CSS di padding
+ */
+const concatPaddingFields = (args) => {
+    const { value, siblingData, operation, } = args;
+    if (operation === 'create' || operation === 'update') {
+        const paddings = siblingData || {};
+        const { all, x, y, t, r, b, l } = paddings;
+        const classes = [];
+        if (all)
+            classes.push(`p-${all}`);
+        if (x)
+            classes.push(`px-${x}`);
+        if (y)
+            classes.push(`py-${y}`);
+        if (t)
+            classes.push(`pt-${t}`);
+        if (r)
+            classes.push(`pr-${r}`);
+        if (b)
+            classes.push(`pb-${b}`);
+        if (l)
+            classes.push(`pl-${l}`);
+        return classes.join(' ');
+    }
+    return value;
+};
+/**
+ * Genera un campo per la selezione dinamica dei padding
+ * @returns Field - Campo di tipo `group` per PayloadCMS
+ */
+const fieldPaddings = () => {
+    return {
+        name: 'p',
+        label: 'Padding',
+        type: 'group',
+        fields: [
+            {
+                name: 'className',
+                label: 'Classi CSS Padding',
+                type: 'text',
+                hooks: {
+                    beforeChange: [concatPaddingFields],
+                },
+                admin: {
+                    readOnly: true,
+                    description: 'Questa stringa verrà generata automaticamente in base ai campi sottostanti.',
+                },
+            },
+            {
+                type: 'row',
+                fields: [
+                    fieldNumber({
+                        name: 'all',
+                        label: 'Tutti i lati',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '33%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 'x',
+                        label: 'Orizzontale',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '33%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 'y',
+                        label: 'Verticale',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '33%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 't',
+                        label: 'Top',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '25%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 'r',
+                        label: 'Right',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '25%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 'b',
+                        label: 'Bottom',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '25%'
+                        }
+                    }),
+                    fieldNumber({
+                        name: 'l',
+                        label: 'Left',
+                        type: 'number',
+                        min: 0,
+                        max: 96,
+                        admin: {
+                            width: '25%'
+                        }
+                    }),
+                ]
+            }
+        ],
+        admin: {
+            description: 'Definisce lo spazio interno generale, orizzontale, verticale o per ciascun lato.',
+        },
+    };
+};
+
 var UserRole;
 (function (UserRole) {
     UserRole["ADMIN"] = "admin";
@@ -719,5 +1279,5 @@ const fieldRoles = (override) => ({
     },
 });
 
-export { TailwindViewportHeights as T, fieldText as a, fieldArray as b, fieldUpload as c, fieldSelect as d, TailwindContainerWidths as e, fieldCheckbox as f, TailwindTextSizes as g, TailwindHeights as h, index as i, fieldRoles as j };
-//# sourceMappingURL=fieldRoles-bNqKk0DO.js.map
+export { TailwindTextSizes as T, fieldText as a, fieldArray as b, fieldUpload as c, fieldSelect as d, fieldThemeColor as e, fieldCheckbox as f, fieldRelationship as g, fieldSectionTabs as h, index as i, fieldConfigProps as j, fieldContainerProps as k, fieldContainerWidths as l, fieldContentProps as m, fieldHeights as n, fieldMargins as o, fieldNumber as p, fieldPaddings as q, fieldRichText as r, fieldRoles as s, fieldSectionProps as t, fieldViewportHeights as u };
+//# sourceMappingURL=fieldRoles-BbW92YWL.js.map