feat: NodePage / PageHeader

.vscode/launch.json

@@ -0,0 +1,20 @@
+{
+  // Use IntelliSense to learn about possible attributes.
+  // Hover to view descriptions of existing attributes.
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "Xdebug",
+      "pathMappings": {
+        "/var/www/html": "${workspaceFolder}/.."
+      },
+      "port": 9003,
+      "request": "launch",
+      "type": "php",
+      "xdebugSettings": {
+        "max_data": 0
+      }
+    }
+  ]
+}

wp-content/themes/headless/.hygen.cjs

@@ -0,0 +1,7 @@
+module.exports = {
+  templates: `../kaliroots/_templates`,
+  helpers: {
+    description: "Headless",
+    textdomain: "headless",
+  },
+};

wp-content/themes/headless/acf-json/group_abstract_builder.json

@@ -0,0 +1,202 @@
+{
+    "key": "group_abstract_builder",
+    "title": "Abstract - Builder",
+    "fields": [
+        {
+            "key": "field_builder_sections",
+            "label": "Section(s)",
+            "name": "sections",
+            "aria-label": "",
+            "type": "flexible_content",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "acfe_flexible_advanced": 1,
+            "acfe_flexible_stylised_button": 0,
+            "acfe_flexible_hide_empty_message": 0,
+            "acfe_flexible_empty_message": "",
+            "acfe_flexible_layouts_templates": 0,
+            "acfe_flexible_layouts_placeholder": 0,
+            "acfe_flexible_layouts_thumbnails": 0,
+            "acfe_flexible_async": [],
+            "acfe_flexible_add_actions": [
+                "copy"
+            ],
+            "acfe_flexible_remove_button": [],
+            "acfe_flexible_remove_top_actions": [],
+            "acfe_flexible_modal_edit": {
+                "acfe_flexible_modal_edit_enabled": "1",
+                "acfe_flexible_modal_edit_size": "large"
+            },
+            "acfe_flexible_modal": {
+                "acfe_flexible_modal_enabled": "0",
+                "acfe_flexible_modal_title": false,
+                "acfe_flexible_modal_size": "xlarge",
+                "acfe_flexible_modal_col": "4",
+                "acfe_flexible_modal_categories": false
+            },
+            "acfe_flexible_modal_settings": {
+                "acfe_flexible_modal_settings_enabled": "1",
+                "acfe_flexible_modal_settings_size": "large",
+                "acfe_flexible_modal_settings_close": "1",
+                "acfe_flexible_modal_settings_close_label": ""
+            },
+            "layouts": {
+                "layout_69c69985e74f4": {
+                    "key": "layout_69c69985e74f4",
+                    "name": "template",
+                    "label": "Modèle",
+                    "display": "block",
+                    "sub_fields": [
+                        {
+                            "key": "field_69c6998ce74f6",
+                            "label": "Modèle",
+                            "name": "template",
+                            "aria-label": "",
+                            "type": "post_object",
+                            "instructions": "",
+                            "required": 1,
+                            "conditional_logic": 0,
+                            "wrapper": {
+                                "width": "",
+                                "class": "",
+                                "id": ""
+                            },
+                            "post_type": [
+                                "template"
+                            ],
+                            "post_status": [
+                                "publish"
+                            ],
+                            "taxonomy": "",
+                            "return_format": "id",
+                            "multiple": 0,
+                            "save_custom": 0,
+                            "save_post_status": "publish",
+                            "acfe_bidirectional": {
+                                "acfe_bidirectional_enabled": "0"
+                            },
+                            "allow_null": 0,
+                            "allow_in_bindings": 0,
+                            "bidirectional": 0,
+                            "show_in_graphql": 1,
+                            "graphql_description": "",
+                            "graphql_field_name": "template",
+                            "graphql_connection_type": "one_to_one",
+                            "ui": 1,
+                            "bidirectional_target": [],
+                            "save_post_type": ""
+                        }
+                    ],
+                    "min": "",
+                    "max": "",
+                    "acfe_flexible_modal_edit_size": "",
+                    "acfe_flexible_settings": [
+                        "group_layout_padding",
+                        "group_layout_container",
+                        "group_layout_color"
+                    ],
+                    "acfe_flexible_settings_size": "",
+                    "acfe_flexible_render_template": false,
+                    "acfe_flexible_render_style": false,
+                    "acfe_flexible_render_script": false,
+                    "acfe_flexible_thumbnail": false,
+                    "acfe_flexible_category": false
+                },
+                "layout_69ca7bceae24b": {
+                    "key": "layout_69ca7bceae24b",
+                    "name": "prose",
+                    "label": "Prose",
+                    "display": "block",
+                    "sub_fields": [
+                        {
+                            "key": "field_69ca7bd9ae253",
+                            "label": "Prose",
+                            "name": "prose",
+                            "aria-label": "",
+                            "type": "clone",
+                            "instructions": "",
+                            "required": 1,
+                            "conditional_logic": 0,
+                            "wrapper": {
+                                "width": "",
+                                "class": "",
+                                "id": ""
+                            },
+                            "graphql_field_name": "prose",
+                            "clone": [
+                                "group_abstract_prose"
+                            ],
+                            "display": "group",
+                            "layout": "block",
+                            "prefix_label": 0,
+                            "prefix_name": 1,
+                            "acfe_seamless_style": 1,
+                            "acfe_clone_modal": 0,
+                            "acfe_clone_modal_close": 0,
+                            "acfe_clone_modal_button": "",
+                            "acfe_clone_modal_size": "large"
+                        }
+                    ],
+                    "min": "",
+                    "max": "",
+                    "acfe_flexible_modal_edit_size": "",
+                    "acfe_flexible_settings": [
+                        "group_layout_padding",
+                        "group_layout_container",
+                        "group_layout_color"
+                    ],
+                    "acfe_flexible_settings_size": "",
+                    "acfe_flexible_render_template": false,
+                    "acfe_flexible_render_style": false,
+                    "acfe_flexible_render_script": false,
+                    "acfe_flexible_thumbnail": false,
+                    "acfe_flexible_category": false
+                }
+            },
+            "min": "",
+            "max": "",
+            "button_label": "Ajouter un élément",
+            "show_in_graphql": 1,
+            "graphql_description": "",
+            "graphql_field_name": "sections",
+            "graphql_non_null": 0,
+            "acfe_flexible_layouts_previews": false,
+            "acfe_flexible_close_button_label": "",
+            "acfe_flexible_layouts_state": false
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "abstract"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "normal",
+    "style": "default",
+    "label_placement": "left",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": true,
+    "description": "",
+    "show_in_rest": 0,
+    "display_title": "",
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfe_form": 0,
+    "show_in_graphql": 1,
+    "graphql_field_name": "GroupAbstractBuilder",
+    "map_graphql_types_from_location_rules": 0,
+    "graphql_types": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1774878313
+}

wp-content/themes/headless/acf-json/group_abstract_media.json

@@ -0,0 +1,123 @@
+{
+    "key": "group_abstract_media",
+    "title": "Abstract - Media",
+    "fields": [
+        {
+            "key": "field_697caec68536d",
+            "label": "Image",
+            "name": "image",
+            "aria-label": "",
+            "type": "image",
+            "instructions": "",
+            "required": 1,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "33",
+                "class": "",
+                "id": ""
+            },
+            "uploader": "",
+            "return_format": "array",
+            "library": "all",
+            "acfe_thumbnail": 0,
+            "min_width": "",
+            "min_height": "",
+            "min_size": "",
+            "max_width": "",
+            "max_height": "",
+            "max_size": "",
+            "mime_types": "",
+            "allow_in_bindings": 0,
+            "preview_size": "medium",
+            "show_in_graphql": 1,
+            "graphql_description": "",
+            "graphql_field_name": "image"
+        },
+        {
+            "key": "field_697caf018536e",
+            "label": "Ratio d'aspect",
+            "name": "aspect_ratio",
+            "aria-label": "",
+            "type": "button_group",
+            "instructions": "",
+            "required": 1,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "33",
+                "class": "",
+                "id": ""
+            },
+            "choices": {
+                "square": "Carré (1:1)",
+                "video": "Vidéo (16:9)",
+                "portrait": "Portrait (2:3)",
+                "auto": "Aspect d'origine"
+            },
+            "default_value": "auto",
+            "return_format": "value",
+            "allow_null": 0,
+            "allow_in_bindings": 0,
+            "layout": "horizontal",
+            "show_in_graphql": 1,
+            "graphql_description": "",
+            "graphql_field_name": "aspectRatio",
+            "graphql_non_null": 1
+        },
+        {
+            "key": "field_697caf378536f",
+            "label": "Ajustement de l'image",
+            "name": "object_fit",
+            "aria-label": "",
+            "type": "button_group",
+            "instructions": "",
+            "required": 1,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "33",
+                "class": "",
+                "id": ""
+            },
+            "choices": {
+                "cover": "Recadrer si nécessaire",
+                "contain": "Contenir sans recadrage"
+            },
+            "default_value": "cover",
+            "return_format": "value",
+            "allow_null": 0,
+            "allow_in_bindings": 0,
+            "layout": "horizontal",
+            "show_in_graphql": 1,
+            "graphql_description": "",
+            "graphql_field_name": "objectFit",
+            "graphql_non_null": 1
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "abstract"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "normal",
+    "style": "seamless",
+    "label_placement": "top",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": true,
+    "description": "",
+    "show_in_rest": 0,
+    "display_title": "",
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfe_form": 0,
+    "show_in_graphql": 1,
+    "graphql_field_name": "GroupAbstractMedia",
+    "map_graphql_types_from_location_rules": 0,
+    "graphql_types": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1774616109
+}

wp-content/themes/headless/acf-json/group_abstract_prose.json

@@ -0,0 +1,59 @@
+{
+    "key": "group_abstract_prose",
+    "title": "Abstract - Prose",
+    "fields": [
+        {
+            "key": "field_69ca7a237541f",
+            "label": "Contenu",
+            "name": "content",
+            "aria-label": "",
+            "type": "wysiwyg",
+            "instructions": "",
+            "required": 1,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "default_value": "",
+            "allow_in_bindings": 0,
+            "tabs": "all",
+            "toolbar": "full",
+            "media_upload": 1,
+            "delay": 0,
+            "show_in_graphql": 1,
+            "graphql_description": "",
+            "graphql_field_name": "content",
+            "graphql_non_null": 1
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "abstract"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "acf_after_title",
+    "style": "seamless",
+    "label_placement": "top",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": true,
+    "description": "",
+    "show_in_rest": 0,
+    "display_title": "",
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfe_form": 0,
+    "show_in_graphql": 1,
+    "graphql_field_name": "GroupAbstractProse",
+    "map_graphql_types_from_location_rules": 0,
+    "graphql_types": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1774877376
+}

wp-content/themes/headless/acf-json/group_layout_color.json

@@ -0,0 +1,62 @@
+{
+  "key": "group_layout_color",
+  "title": "Layout - Color",
+  "fields": [
+    {
+      "key": "field_693c8c945ce51",
+      "label": "Variante de couleur",
+      "name": "color",
+      "aria-label": "",
+      "type": "button_group",
+      "instructions": "",
+      "required": 1,
+      "conditional_logic": 0,
+      "wrapper": {
+        "width": "",
+        "class": "",
+        "id": ""
+      },
+      "choices": {
+        "default": "Par défaut",
+        "muted": "Atténué",
+        "inverted": "Inversé",
+        "primary": "Primaire"
+      },
+      "default_value": "default",
+      "return_format": "value",
+      "allow_null": 0,
+      "allow_in_bindings": 0,
+      "layout": "horizontal",
+      "show_in_graphql": 1,
+      "graphql_description": "",
+      "graphql_field_name": "color",
+      "graphql_non_null": 0
+    }
+  ],
+  "location": [
+    [
+      {
+        "param": "abstract"
+      }
+    ]
+  ],
+  "menu_order": 0,
+  "position": "normal",
+  "style": "seamless",
+  "label_placement": "top",
+  "instruction_placement": "label",
+  "hide_on_screen": "",
+  "active": true,
+  "description": "",
+  "show_in_rest": 0,
+  "display_title": "",
+  "acfe_autosync": ["json"],
+  "acfe_form": 0,
+  "show_in_graphql": 1,
+  "graphql_field_name": "GroupLayoutColor",
+  "map_graphql_types_from_location_rules": 0,
+  "graphql_types": "",
+  "acfe_meta": "",
+  "acfe_note": "",
+  "modified": 1774616167
+}

wp-content/themes/headless/acf-json/group_layout_container.json

@@ -0,0 +1,67 @@
+{
+    "key": "group_layout_container",
+    "title": "Layout - Container",
+    "fields": [
+        {
+            "key": "field_68dc29d78941c",
+            "label": "Largeur du contenu",
+            "name": "container",
+            "aria-label": "",
+            "type": "button_group",
+            "instructions": "",
+            "required": 1,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "choices": {
+                "default": "1536px",
+                "xl": "1280px",
+                "lg": "1024px",
+                "md": "768px",
+                "sm": "640px",
+                "fluid": "Fluide",
+                "none": "Aucun"
+            },
+            "default_value": "default",
+            "return_format": "value",
+            "allow_null": 0,
+            "allow_in_bindings": 0,
+            "layout": "horizontal",
+            "show_in_graphql": 1,
+            "graphql_description": "",
+            "graphql_field_name": "container",
+            "graphql_non_null": 0
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "abstract"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "normal",
+    "style": "default",
+    "label_placement": "top",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": true,
+    "description": "",
+    "show_in_rest": 0,
+    "display_title": "",
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfe_form": 0,
+    "show_in_graphql": 1,
+    "graphql_field_name": "GroupLayoutContainer",
+    "map_graphql_types_from_location_rules": 0,
+    "graphql_types": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1774616268
+}

wp-content/themes/headless/acf-json/group_layout_flex.json

@@ -0,0 +1,59 @@
+{
+    "key": "group_layout_flex",
+    "title": "Layout - Flex",
+    "fields": [
+        {
+            "key": "field_6995cd0191df2",
+            "label": "Inverser",
+            "name": "flex_reverse",
+            "aria-label": "",
+            "type": "true_false",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "message": "Inverser l'ordre des colonnes",
+            "default_value": 0,
+            "allow_in_bindings": 0,
+            "ui_on_text": "",
+            "ui_off_text": "",
+            "ui": 1,
+            "show_in_graphql": 1,
+            "graphql_description": "",
+            "graphql_field_name": "flexReverse",
+            "graphql_non_null": 0
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "abstract"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "normal",
+    "style": "seamless",
+    "label_placement": "left",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": true,
+    "description": "",
+    "show_in_rest": 0,
+    "display_title": "",
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfe_form": 0,
+    "show_in_graphql": 1,
+    "graphql_field_name": "GroupLayoutFlex",
+    "map_graphql_types_from_location_rules": 0,
+    "graphql_types": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1774616260
+}

wp-content/themes/headless/acf-json/group_layout_grid.json

@@ -0,0 +1,63 @@
+{
+    "key": "group_layout_grid",
+    "title": "Layout - Grid",
+    "fields": [
+        {
+            "key": "field_6995cc72e62f6",
+            "label": "Taille des items de la grille",
+            "name": "grid_item_size",
+            "aria-label": "",
+            "type": "button_group",
+            "instructions": "",
+            "required": 1,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "choices": {
+                "sm": "Petits",
+                "md": "Moyens",
+                "lg": "Grands"
+            },
+            "default_value": "md",
+            "return_format": "value",
+            "allow_null": 0,
+            "allow_in_bindings": 0,
+            "layout": "horizontal",
+            "show_in_graphql": 1,
+            "graphql_description": "",
+            "graphql_field_name": "gridItemSize",
+            "graphql_non_null": 0
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "abstract"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "normal",
+    "style": "default",
+    "label_placement": "left",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": true,
+    "description": "",
+    "show_in_rest": 0,
+    "display_title": "",
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfe_form": 0,
+    "show_in_graphql": 1,
+    "graphql_field_name": "GroupLayoutGrid",
+    "map_graphql_types_from_location_rules": 0,
+    "graphql_types": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1774616297
+}

wp-content/themes/headless/acf-json/group_layout_padding.json

@@ -0,0 +1,64 @@
+{
+    "key": "group_layout_padding",
+    "title": "Layout - Padding",
+    "fields": [
+        {
+            "key": "field_693c8c3b5ce50",
+            "label": "Espacement intérieur vertical",
+            "name": "vertical_padding",
+            "aria-label": "",
+            "type": "button_group",
+            "instructions": "",
+            "required": 1,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "choices": {
+                "none": "Aucun",
+                "sm": "Petit (24px)",
+                "md": "Medium (48px)",
+                "lg": "Grand (96px)"
+            },
+            "default_value": "md",
+            "return_format": "value",
+            "allow_null": 0,
+            "allow_in_bindings": 0,
+            "layout": "horizontal",
+            "show_in_graphql": 1,
+            "graphql_description": "",
+            "graphql_field_name": "verticalPadding",
+            "graphql_non_null": 0
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "abstract"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "normal",
+    "style": "default",
+    "label_placement": "left",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": true,
+    "description": "",
+    "show_in_rest": 0,
+    "display_title": "",
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfe_form": 0,
+    "show_in_graphql": 1,
+    "graphql_field_name": "GroupLayoutPadding",
+    "map_graphql_types_from_location_rules": 0,
+    "graphql_types": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1774873127
+}

wp-content/themes/headless/acf-json/group_options_site.json

@@ -63,9 +63,7 @@
         "id": ""
       },
       "graphql_field_name": "social",
-            "clone": [
-                "group_abstract_social"
-            ],
+      "clone": ["group_abstract_social"],
       "display": "seamless",
       "layout": "block",
       "prefix_label": 0,
@@ -144,9 +142,7 @@
   "description": "",
   "show_in_rest": 0,
   "display_title": "",
-    "acfe_autosync": [
-        "json"
-    ],
+  "acfe_autosync": ["json"],
   "acfe_form": 0,
   "show_in_graphql": 1,
   "graphql_field_name": "GroupSiteOptions",

wp-content/themes/headless/acf-json/group_post_page.json

@@ -0,0 +1,66 @@
+{
+    "key": "group_post_page",
+    "title": "Post - Page",
+    "fields": [
+        {
+            "key": "field_690cbda0abcbb",
+            "label": "Constructeur de page",
+            "name": "builder",
+            "aria-label": "",
+            "type": "clone",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "graphql_field_name": "builder",
+            "clone": [
+                "group_abstract_builder"
+            ],
+            "display": "seamless",
+            "layout": "block",
+            "prefix_label": 0,
+            "prefix_name": 1,
+            "acfe_seamless_style": 0,
+            "acfe_clone_modal": 0,
+            "acfe_clone_modal_close": 0,
+            "acfe_clone_modal_button": "",
+            "acfe_clone_modal_size": "large"
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "post_type",
+                "operator": "==",
+                "value": "page"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "normal",
+    "style": "seamless",
+    "label_placement": "top",
+    "instruction_placement": "label",
+    "hide_on_screen": [
+        "the_content"
+    ],
+    "active": true,
+    "description": "",
+    "show_in_rest": 0,
+    "display_title": "",
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfe_form": 0,
+    "show_in_graphql": 1,
+    "graphql_field_name": "GroupPostPage",
+    "map_graphql_types_from_location_rules": 0,
+    "graphql_types": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1774616961
+}

wp-content/themes/headless/acf-json/group_post_template.json

@@ -0,0 +1,66 @@
+{
+    "key": "group_post_template",
+    "title": "Post - Template",
+    "fields": [
+        {
+            "key": "field_690cbda0abcbb",
+            "label": "Constructeur de page",
+            "name": "builder",
+            "aria-label": "",
+            "type": "clone",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "graphql_field_name": "builder",
+            "clone": [
+                "group_abstract_builder"
+            ],
+            "display": "seamless",
+            "layout": "block",
+            "prefix_label": 0,
+            "prefix_name": 1,
+            "acfe_seamless_style": 0,
+            "acfe_clone_modal": 0,
+            "acfe_clone_modal_close": 0,
+            "acfe_clone_modal_button": "",
+            "acfe_clone_modal_size": "large"
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "post_type",
+                "operator": "==",
+                "value": "template"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "normal",
+    "style": "seamless",
+    "label_placement": "top",
+    "instruction_placement": "label",
+    "hide_on_screen": [
+        "the_content"
+    ],
+    "active": true,
+    "description": "",
+    "show_in_rest": 0,
+    "display_title": "",
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfe_form": 0,
+    "show_in_graphql": 1,
+    "graphql_field_name": "GroupTemplate",
+    "map_graphql_types_from_location_rules": 0,
+    "graphql_types": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1774624640
+}

wp-content/themes/headless/app/assets/css/lists.css

@@ -4,9 +4,9 @@
 }
 
 @utility list-ordered {
-  @apply list-decimal list-inside;
+  @apply list-inside list-decimal;
 }
 
 @utility list-unordered {
-  @apply list-disc list-inside;
+  @apply list-inside list-disc;
 }

wp-content/themes/headless/app/components/acf/AcfBuilder.gql

@@ -0,0 +1,8 @@
+fragment AcfBuilder on GroupAbstractBuilder_Fields {
+  sections @nullToEmpty @filterNullItems {
+    __typename
+    ... on GroupAbstractBuilderSectionsProseLayout {
+      ...SectionProse
+    }
+  }
+}

wp-content/themes/headless/app/components/acf/AcfBuilder.vue

@@ -0,0 +1,20 @@
+<script setup lang="ts">
+import type { AcfBuilderFragment } from "#graphql/types";
+
+const props = defineProps<{ builder: AcfBuilderFragment }>();
+const sections = computed(() =>
+  props.builder.sections.map(({ __typename, ...section }) => ({
+    component: __typename.replace(/^GroupAbstractBuilderSections(.+?)Layout$/, "Section$1"),
+    section,
+  })),
+);
+</script>
+
+<template>
+  <Component
+    v-for="({ component, section }, key) in sections"
+    :key="key"
+    :is="component"
+    :section="section"
+  />
+</template>

wp-content/themes/headless/app/components/acf/AcfImage.gql

@@ -0,0 +1,9 @@
+fragment AcfImage on MediaItem {
+  src: sourceUrl @nonNull
+  alt: altText
+  mediaDetails {
+    width @nullToUndefined
+    height @nullToUndefined
+  }
+  objectPosition @nullTo(value: "center")
+}

wp-content/themes/headless/app/components/acf/AcfImage.vue

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+import type { AcfImageFragment } from "#graphql/types";
+
+defineProps<{ image: AcfImageFragment }>();
+</script>
+
+<template>
+  <NuxtImg
+    :src="image.src"
+    :alt="image.alt"
+    :width="image.mediaDetails?.width"
+    :height="image.mediaDetails?.height"
+    :style="{ objectPosition: image.objectPosition }"
+    placeholder
+  />
+</template>

wp-content/themes/headless/app/components/acf/AcfLayout.gql

@@ -0,0 +1,18 @@
+fragment LayoutColor on GroupLayoutColor_Fields {
+  color @nullToUndefined @enum(values: ["default", "muted", "inverted", "primary"])
+}
+
+fragment LayoutContainer on GroupLayoutContainer_Fields {
+  container @nullToUndefined @enum(values: ["default", "xl", "lg", "md", "sm", "fluid", "none"])
+}
+
+fragment LayoutPadding on GroupLayoutPadding_Fields {
+  verticalPadding @nullToUndefined @enum(values: ["none", "sm", "md", "lg"])
+}
+
+fragment AcfLayout on GroupAbstractBuilderSectionsLayoutSettings_Fields {
+  __typename
+  ...LayoutColor
+  ...LayoutContainer
+  ...LayoutPadding
+}

wp-content/themes/headless/app/components/acf/AcfLayout.vue

@@ -0,0 +1,61 @@
+<script setup lang="ts">
+import { tv } from "tailwind-variants";
+
+import type { AcfLayoutFragment } from "#graphql/types";
+
+const props = defineProps<{ layout: AcfLayoutFragment }>();
+
+const tvLayoutVariants = tv({
+  slots: {
+    base: "",
+    inner: "",
+  },
+  variants: {
+    display: {
+      block: { inner: "block" },
+      flex: { inner: "flex flex-col gap-6" },
+      grid: { inner: "grid" },
+    },
+
+    color: {
+      default: { base: "bg-default" },
+      muted: { base: "bg-muted" },
+      inverted: { base: "bg-inverted text-inverted" },
+      primary: { base: "bg-primary text-inverted" },
+    },
+
+    container: {
+      default: { inner: "container" },
+      xl: { inner: "container-xl" },
+      lg: { inner: "container-lg" },
+      md: { inner: "container-md" },
+      sm: { inner: "container-sm" },
+      fluid: { inner: "container-fluid" },
+      none: { inner: "container-none" },
+    },
+
+    verticalPadding: {
+      none: { base: "py-0" },
+      sm: { base: "py-6" },
+      md: { base: "py-12" },
+      lg: { base: "py-24" },
+    },
+  },
+  defaultVariants: {
+    display: "block",
+    color: "default",
+    container: "default",
+    verticalPadding: "md",
+  },
+});
+
+const { base, inner } = tvLayoutVariants(props.layout);
+</script>
+
+<template>
+  <section :class="base()">
+    <div :class="inner()">
+      <slot />
+    </div>
+  </section>
+</template>

wp-content/themes/headless/app/components/acf/AcfMedia.gql

@@ -0,0 +1,9 @@
+fragment AcfMedia on GroupAbstractMedia_Fields {
+  image @nonNull {
+    node {
+      ...AcfImage
+    }
+  }
+  aspectRatio @enum(values: ["square", "video", "portrait", "auto"])
+  objectFit @enum(values: ["cover", "contain"])
+}

wp-content/themes/headless/app/components/acf/AcfMedia.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import { tv } from "tailwind-variants";
+
+import type { AcfMediaFragment } from "#graphql/types";
+
+const props = defineProps<{ media: AcfMediaFragment }>();
+
+const tvAcfMedia = tv({
+  slots: {
+    image: "w-full",
+  },
+  variants: {
+    aspectRatio: {
+      square: { image: "aspect-[1/1]" },
+      video: { image: "aspect-video" },
+      portrait: { image: "aspect-[2/3]" },
+      auto: { image: "aspect-auto" },
+    },
+    objectFit: {
+      cover: { image: "object-cover" },
+      contain: { image: "object-contain" },
+    },
+  },
+  defaultVariants: {
+    aspectRatio: "auto",
+    objectFit: "cover",
+  },
+});
+
+const classes = tvAcfMedia(props.media);
+</script>
+
+<template>
+  <AcfImage :image="media.image.node" :class="classes.image()" />
+</template>

wp-content/themes/headless/app/components/acf/AcfPhone.gql

@@ -0,0 +1,5 @@
+fragment AcfPhone on AcfPhone {
+  e164
+  national
+  extension
+}

wp-content/themes/headless/app/components/acf/AcfPhone.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import type { AcfPhoneFragment } from "#graphql/types";
+
+defineProps<{ phone: AcfPhoneFragment; link?: boolean }>();
+</script>
+
+<template>
+  <Component :is="link ? 'a' : 'span'" v-if="phone" :href="link ? `tel:${phone.e164}` : undefined">
+    {{ phone.national }}{{ phone.extension ? ` ext. ${phone.extension}` : "" }}
+  </Component>
+</template>

wp-content/themes/headless/app/components/acf/AcfProse.gql

@@ -0,0 +1,3 @@
+fragment AcfProse on GroupAbstractProse_Fields {
+  content
+}

wp-content/themes/headless/app/components/acf/AcfProse.vue

@@ -0,0 +1,12 @@
+<script setup lang="ts">
+import type { AcfProseFragment } from "#graphql/types";
+
+defineProps<{ prose: AcfProseFragment }>();
+
+const refContent = useTemplateRef("refContent");
+useProseLinks(refContent);
+</script>
+
+<template>
+  <div ref="refContent" class="prose" v-html="prose.content" />
+</template>

wp-content/themes/headless/app/components/acf/AcfSocial.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { AcfSocialFragment } from "#graphql/types";
 
-defineProps<{ social?: AcfSocialFragment }>();
+defineProps<{ social: AcfSocialFragment }>();
 
 const socialIconNames = {
   "facebook.com": "i-cib-facebook-f",
@@ -24,7 +24,7 @@ function getSocialIcon(url: string): string {
 </script>
 
 <template>
-  <ul v-if="social?.profiles.length">
+  <ul v-if="social.profiles.length">
     <li v-for="({ url }, key) in social.profiles" :key="key">
       <a :href="url" target="_blank" rel="noopener noreferrer">
         <UIcon :name="getSocialIcon(url)" />

wp-content/themes/headless/app/components/nodes/NodePage.gql

@@ -1,3 +1,9 @@
 fragment NodePage on Page {
   title @nonNull
+  isFrontPage
+  groupPostPage @nonNull {
+    builder @nonNull {
+      ...AcfBuilder
+    }
+  }
 }

wp-content/themes/headless/app/components/nodes/NodePage.vue

@@ -5,5 +5,8 @@ defineProps<{ node: NodePageFragment }>();
 </script>
 
 <template>
-  <div id="node-page">{{ node.title }}</div>
+  <div id="node-page">
+    <PageHeader v-if="!node.isFrontPage" :title="node.title" />
+    <AcfBuilder :builder="node.groupPostPage.builder" />
+  </div>
 </template>

wp-content/themes/headless/app/components/sections/SectionProse.gql

@@ -0,0 +1,8 @@
+fragment SectionProse on GroupAbstractBuilderSectionsProseLayout {
+  prose @nonNull {
+    ...AcfProse
+  }
+  layout: layoutSettings @nonNull {
+    ...AcfLayout
+  }
+}

wp-content/themes/headless/app/components/sections/SectionProse.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import type { SectionProseFragment } from "#graphql/types";
+
+defineProps<{ section: SectionProseFragment }>();
+</script>
+
+<template>
+  <AcfLayout :layout="section.layout">
+    <AcfProse :prose="section.prose" />
+  </AcfLayout>
+</template>

wp-content/themes/headless/app/components/site/SiteFooter.vue

@@ -3,12 +3,13 @@ const { data: siteOptions } = await useSiteOptions();
 </script>
 
 <template>
-  <footer class="links:link-prose bg-muted">
+  <footer v-if="siteOptions" class="bg-muted links:link-underline">
     <div class="container py-3">
       <AcfSocial
-        :social="siteOptions?.social"
+        :social="siteOptions.social"
         class="flex items-center gap-1.5 links:link-opacity"
       ></AcfSocial>
+      <AcfPhone :phone="siteOptions.phoneNumber" link></AcfPhone>
     </div>
     <SiteFooterBottom />
   </footer>

wp-content/themes/headless/app/composables/useProseLinks.ts

@@ -0,0 +1,70 @@
+export function useProseLinks(refContent: Ref<HTMLElement | null>) {
+  const router = useRouter();
+  const { url } = useSiteConfig();
+  const siteUrl = new URL(url);
+
+  // Determine if the href is internal
+  const isInternal = (href: string) => {
+    if (!href) return false;
+    if (href.startsWith("/")) return true;
+    if (href.startsWith("#")) return false;
+    try {
+      const hrefUrl = new URL(href);
+      return hrefUrl.hostname === siteUrl.hostname;
+    } catch {
+      return false;
+    }
+  };
+
+  // Convert href to relative path
+  const convertToRelative = (href: string) => {
+    if (href.startsWith("/")) return href;
+    try {
+      const hrefUrl = new URL(href);
+      if (hrefUrl.hostname === siteUrl.hostname) {
+        return hrefUrl.pathname + hrefUrl.search + hrefUrl.hash;
+      }
+    } catch {
+      // Invalid URL
+    }
+    return href;
+  };
+
+  // Highjack click events to use router for internal links
+  const handleClick = (event: MouseEvent) => {
+    const target = event.target as HTMLElement;
+    const link = target.closest("a");
+    if (!link) return;
+    const href = link.getAttribute("href");
+    if (!href) return;
+    if (
+      event.metaKey ||
+      event.ctrlKey ||
+      event.shiftKey ||
+      event.altKey ||
+      link.target === "_blank" ||
+      link.hasAttribute("download")
+    ) {
+      return;
+    }
+    if (isInternal(href)) {
+      event.preventDefault();
+      const path = convertToRelative(href);
+      router.push(path);
+    }
+  };
+
+  // Attach and detach event listeners
+  onMounted(() => {
+    const element = unref(refContent);
+    if (element) {
+      element.addEventListener("click", handleClick);
+    }
+  });
+  onBeforeUnmount(() => {
+    const element = unref(refContent);
+    if (element) {
+      element.removeEventListener("click", handleClick);
+    }
+  });
+}

wp-content/themes/headless/app/composables/useSiteOptions.gql

@@ -3,6 +3,9 @@ fragment SiteOptions on GroupSiteOptions {
   social @nonNull {
     ...AcfSocial
   }
+  phoneNumber {
+    ...AcfPhone
+  }
 }
 
 query SiteOptions {

wp-content/themes/headless/functions.php

@@ -3,6 +3,9 @@
 // Core
 require_once __DIR__ . '/includes/core/theme-setup.php';
 
+// Custom Post Types
+require_once __DIR__ . '/includes/cpt/template.php';
+
 // Vendors
 require_once __DIR__ . '/includes/vendors/acf.php';
 require_once __DIR__ . '/includes/vendors/rankmath.php';

wp-content/themes/headless/includes/cpt/template.php

@@ -0,0 +1,130 @@
+<?php
+
+// Register 'template' post type
+add_action( 'init', 'headless_template_register_post_type' );
+function headless_template_register_post_type() {
+	register_post_type(
+		'template',
+		array(
+			'labels'                => array(
+				'name'                     => "Modèles",
+				'menu_name'                => "Modèles",
+				'singular_name'            => "Modèle",
+				'add_new'                  => "Ajouter",
+				'add_new_item'             => "Ajouter un modèle",
+				'new_item'                 => "Nouveau modèle",
+				'edit_item'                => "Modifier le modèle",
+				'view_item'                => "Voir le modèle",
+				'view_items'               => "Voir les modèles",
+				'search_items'             => "Rechercher des modèles",
+				'not_found'                => "Aucun modèle trouvé",
+				'not_found_in_trash'       => "Aucun modèle trouvé dans la corbeille",
+				'parent_item_colon'        => "Modèle parent :",
+				'all_items'                => "Tous les modèles",
+				'archives'                 => "Archives des modèles",
+				'attributes'               => "Attributs du modèle",
+				'insert_into_item'         => "Insérer dans le modèle",
+				'uploaded_to_this_item'    => "Téléversé dans ce modèle",
+				'featured_image'           => "Vignette",
+				'set_featured_image'       => "Définir la vignette",
+				'remove_featured_image'    => "Supprimer la vignette",
+				'use_featured_image'       => "Utiliser comme vignette",
+				'filter_items_list'        => "Filtrer la liste des modèles",
+				'items_list_navigation'    => "Navigation dans la liste des modèles",
+				'items_list'               => "Liste des modèles",
+				'item_published'           => "Modèle publié.",
+				'item_published_privately' => "Modèle publié en privé.",
+				'item_reverted_to_draft'   => "Modèle remis au brouillon.",
+				'item_scheduled'           => "Modèle planifié.",
+				'item_updated'             => "Modèle mis à jour.",
+			),
+			'public'                => false,
+			'hierarchical'          => false,
+			'show_ui'               => true,
+			'show_in_nav_menus'     => false,
+			'supports'              => array( 'title', 'revisions' ),
+			'has_archive'           => false,
+			'rewrite'               => false,
+			'query_var'             => true,
+			'menu_icon'             => 'dashicons-clipboard',
+			'show_in_rest'          => false,
+			'rest_base'             => 'template',
+			'rest_controller_class' => 'WP_REST_Posts_Controller',
+			'show_in_graphql'       => true,
+			'graphql_single_name'   => "Template",
+			'graphql_plural_name'   => "Templates",
+			'graphql_interfaces'    => array( 'Node' ),
+		)
+	);
+}
+
+// Custom 'template' post updated messages
+add_filter( 'post_updated_messages', 'headless_template_post_updated_messages' );
+function headless_template_post_updated_messages( $messages ) {
+	global $post;
+	$permalink                = get_permalink( $post );
+	$preview_post_link_html   = sprintf( ' <a target="_blank" href="%1$s">%2$s</a>', esc_url( get_preview_post_link( $post ) ), "Prévisualiser le modèle" );
+	$scheduled_post_link_html = sprintf( ' <a target="_blank" href="%1$s">%2$s</a>', esc_url( $permalink ), "Prévisualiser le modèle" );
+	$scheduled_date           = date_i18n( "j M Y à H:i", strtotime( $post->post_date ) );
+	$view_post_link_html      = sprintf( ' <a href="%1$s">%2$s</a>', esc_url( $permalink ), "Voir le modèle" );
+	$messages['template']     = array(
+		0  => '',
+		1  => "Modèle mis à jour." . $view_post_link_html,
+		2  => "Champ personnalisé mis à jour.",
+		3  => "Champ personnalisé supprimé.",
+		4  => "Modèle mis à jour.",
+		5  => isset( $_GET['revision'] ) ? sprintf( "Modèle restauré à partir de la révision du %s", wp_post_revision_title( (int) $_GET['revision'], false ) ) : false,
+		6  => "Modèle publié." . $view_post_link_html,
+		7  => "Modèle enregistré.",
+		8  => "Modèle soumis." . $preview_post_link_html,
+		9  => sprintf( "Modèle planifié pour le : %s.", '<strong>' . $scheduled_date . '</strong>' ) . $scheduled_post_link_html,
+		10 => "Brouillon du modèle mis à jour." . $preview_post_link_html,
+	);
+
+	return $messages;
+}
+
+// Helper: Replace template(s) in sections value recursively
+function headless_template_replace_sections( $sections ) {
+	if ( ! is_array( $sections ) ) {
+		return $sections;
+	}
+
+	$processed_sections = array();
+	foreach ( $sections as $section ) {
+		if ( empty( $layout = $section['acf_fc_layout'] ?? false ) ) {
+			continue;
+		}
+
+		if ( $layout !== 'template' ) {
+			$processed_sections[] = $section;
+			continue;
+		}
+
+		if ( empty( $template_id = $section['template'] ?? false ) ) {
+			continue;
+		}
+
+		$template_sections = get_field( 'builder_sections', $template_id );
+		if ( is_array( $template_sections ) ) {
+			$expanded_sections = headless_template_replace_sections( $template_sections );
+			foreach ( $expanded_sections as $expanded_section ) {
+				$processed_sections[] = $expanded_section;
+			}
+		}
+	}
+
+	return $processed_sections;
+}
+
+// Replace template(s) in GraphQL builder sections value
+add_filter( 'wpgraphql/acf/field_value', 'headless_graphql_process_sections', 10, 2 );
+function headless_graphql_process_sections( $value, $field_config ) {
+	if ( 'builder' !== $field_config['name'] ?? false || ! is_array( $value['sections'] ?? false ) ) {
+		return $value;
+	}
+
+	$value['sections'] = headless_template_replace_sections( $value['sections'] );
+
+	return $value;
+}

wp-content/themes/headless/includes/vendors/acf.php

@@ -13,3 +13,21 @@ function headless_acf_init() {
 	acf_update_setting( 'acfe/modules/taxonomies', false );
 	acf_update_setting( 'acfe/modules/templates', false );
 }
+
+// Customize ACF Flexible Content settings modal field to only show layout field groups
+add_filter( 'acf/prepare_field', 'headless_acfe_flexible_settings_prepare_field', 20 );
+function headless_acfe_flexible_settings_prepare_field( $field ) {
+	if ( ( $field['_name'] ?? '' ) !== 'acfe_flexible_settings' ) {
+		return $field;
+	}
+
+	$field['choices'] = array_filter(
+		$field['choices'],
+		function ( $key ) {
+			return strpos( $key, 'group_layout_' ) === 0;
+		},
+		ARRAY_FILTER_USE_KEY
+	);
+
+	return $field;
+}

wp-content/themes/headless/nuxt.config.ts

@@ -2,7 +2,14 @@ import { version, description } from "./package.json";
 
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
-  modules: ["@lewebsimple/nuxt-graphql", "@nuxt/ui", "@nuxtjs/seo", "nuxt-auth-utils", "nuxt-svgo"],
+  modules: [
+    "@lewebsimple/nuxt-graphql",
+    "@nuxt/image",
+    "@nuxt/ui",
+    "@nuxtjs/seo",
+    "nuxt-auth-utils",
+    "nuxt-svgo",
+  ],
 
   compatibilityDate: "2026-03-18",
   devtools: { enabled: true },
@@ -11,6 +18,7 @@ export default defineNuxtConfig({
   components: {
     dirs: [
       { path: "~/components/nodes", global: true },
+      { path: "~/components/sections", global: true },
       { path: "~/components", pathPrefix: false },
     ],
   },
@@ -30,9 +38,8 @@ export default defineNuxtConfig({
 
   graphql: {
     client: {
-      cache: {
-        keyVersion: version,
-      },
+      cache: { keyVersion: version },
+      ssrForwardHeaders: ["authorization", "cookie"],
     },
     server: {
       context: ["server/graphql/context.ts"],
@@ -54,7 +61,13 @@ export default defineNuxtConfig({
 
   vite: {
     optimizeDeps: {
-      include: ["@vue/devtools-core", "@vue/devtools-kit", "es-toolkit/promise", "zod"],
+      include: [
+        "@vue/devtools-core",
+        "@vue/devtools-kit",
+        "es-toolkit",
+        "tailwind-variants",
+        "zod",
+      ],
     },
   },
 });

wp-content/themes/headless/package.json

@@ -18,16 +18,20 @@
   },
   "dependencies": {
     "@iconify-json/cib": "^1.2.3",
-    "@iconify-json/lucide": "^1.2.99",
-    "@lewebsimple/nuxt-graphql": "^0.7.7",
+    "@iconify-json/lucide": "^1.2.100",
+    "@lewebsimple/graphql-codegen-zod": "^0.2.2",
+    "@lewebsimple/nuxt-graphql": "^0.7.8",
+    "@nuxt/image": "^2.0.0",
     "@nuxt/ui": "^4.6.0",
     "@nuxtjs/seo": "^4.0.2",
     "defu": "^6.1.4",
     "es-toolkit": "^1.45.1",
+    "graphql-codegen-zod": "link: @lewebsimple/graphql-codegen-zod",
     "jwt-decode": "^4.0.0",
     "nuxt": "^4.4.2",
     "nuxt-auth-utils": "^0.5.29",
     "nuxt-svgo": "^4.2.6",
+    "tailwind-variants": "^3.2.2",
     "tailwindcss": "^4.2.2",
     "vue": "^3.5.31",
     "vue-router": "^4.6.4"