@lls/vivi 24.1.7-d088161a → 24.1.7-e05728e4

package/lib/index.js

@@ -58,7 +58,8 @@ var init_layoutTemplate = __esm({
 
 // src/utils/template.ts
 import _3 from "lodash/fp.js";
-var getDocumentByUuid, getDepth, parseErrorsInContentMd, getDocumentUniqueId, getMissingUuid, getMissingId, updateTemplate;
+import { nanoid } from "nanoid";
+var getDocumentByUuid, getDepth, parseErrorsInContentMd, getDocumentUniqueId, getMissingUuid, getMissingId, updateTemplate, addDocumentToTemplate, deleteDocumentFromTemplate;
 var init_template = __esm({
   "src/utils/template.ts"() {
     "use strict";
@@ -91,6 +92,32 @@ var init_template = __esm({
         return node;
       });
     };
+    addDocumentToTemplate = (template, partialDoc) => {
+      const uuid = nanoid();
+      const children = [
+        ...template.children ?? [],
+        {
+          // id: newCardId(), //TODO vraisemblablement inutile. A supprimer si création de page côté BE ok sans
+          uuid,
+          contentMd: ""
+        }
+      ];
+      const layouts = {
+        primary: [
+          ...template?.layouts?.primary ?? [],
+          {
+            id: uuid,
+            ...partialDoc
+          }
+        ]
+      };
+      return { ...template, children, layouts };
+    };
+    deleteDocumentFromTemplate = (template, docUuid) => {
+      const children = template.children?.filter((child) => child.uuid !== docUuid) ?? [];
+      const layouts = { primary: template.layouts?.primary?.filter((doc) => doc.id !== docUuid) ?? [] };
+      return { ...template, children, layouts };
+    };
   }
 });
 
@@ -267,9 +294,9 @@ var init_mode = __esm({
   }
 });
 
-// css-modules:css-modules://v55PWB9nAJQuRkGNDb4PSzswK0IT8X6YlIgXJ4Px4dA.css
-var init_v55PWB9nAJQuRkGNDb4PSzswK0IT8X6YlIgXJ4Px4dA = __esm({
-  "css-modules:css-modules://v55PWB9nAJQuRkGNDb4PSzswK0IT8X6YlIgXJ4Px4dA.css"() {
+// css-modules:css-modules://SiZlRV2YWb1jY5gExVMrYPMZB79ONPQM_B3jhc8NVMM.css
+var init_SiZlRV2YWb1jY5gExVMrYPMZB79ONPQM_B3jhc8NVMM = __esm({
+  "css-modules:css-modules://SiZlRV2YWb1jY5gExVMrYPMZB79ONPQM_B3jhc8NVMM.css"() {
   }
 });
 
@@ -278,8 +305,8 @@ var src_components_core_DocumentToolbar_default;
 var init_src_components_core_DocumentToolbar = __esm({
   "tmp_esbuild/_src_components_core_DocumentToolbar.module.css"() {
     "use strict";
-    init_v55PWB9nAJQuRkGNDb4PSzswK0IT8X6YlIgXJ4Px4dA();
-    src_components_core_DocumentToolbar_default = { "toolbar": "vv-JySIna-toolbar", "toggleMenuButton": "vv-JySIna-toggleMenuButton", "parentToolbar": "vv-JySIna-parentToolbar" };
+    init_SiZlRV2YWb1jY5gExVMrYPMZB79ONPQM_B3jhc8NVMM();
+    src_components_core_DocumentToolbar_default = { "toggleMenuButton": "vv-JySIna-toggleMenuButton", "parentToolbar": "vv-JySIna-parentToolbar", "toolbar": "vv-JySIna-toolbar" };
   }
 });
 
@@ -292,7 +319,7 @@ var init_DocumentToolbar = __esm({
 });
 
 // src/components/core/DocumentToolbar.tsx
-import { useState, useCallback } from "react";
+import { useCallback, useState } from "react";
 import { Button, Tooltip, Z_DOCUMENT_TOOLBAR } from "@lls/lls-kit";
 import { cx } from "@lls/utils";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -359,50 +386,9 @@ var init_DocumentToolbar2 = __esm({
   }
 });
 
-// src/constants/index.ts
-var VIVI_CLASSNAME, VIVI_COMPONENT_CLASSNAME_PREFIX, DOCUMENT_CLASSNAME;
-var init_constants = __esm({
-  "src/constants/index.ts"() {
-    "use strict";
-    VIVI_CLASSNAME = "lls-vivi";
-    VIVI_COMPONENT_CLASSNAME_PREFIX = `${VIVI_CLASSNAME}-`;
-    DOCUMENT_CLASSNAME = `${VIVI_COMPONENT_CLASSNAME_PREFIX}document-root`;
-  }
-});
-
-// src/utils/string.ts
-import _8 from "lodash/fp.js";
-var OPENING_TAG_CHAR, ESCAPED_OPENING_TAG_CHAR, CLOSING_TAG_CHAR, removeTrailingNewLines, escapeTags, escapeTagContent;
-var init_string = __esm({
-  "src/utils/string.ts"() {
-    "use strict";
-    OPENING_TAG_CHAR = "<";
-    ESCAPED_OPENING_TAG_CHAR = "_<_";
-    CLOSING_TAG_CHAR = "</";
-    removeTrailingNewLines = _8.replace(/(\r?\n|\r)+$/, "");
-    escapeTags = (content) => _8.isString(content) ? content.replace(new RegExp(OPENING_TAG_CHAR, "g"), ESCAPED_OPENING_TAG_CHAR) : content;
-    escapeTagContent = (tagName, str) => {
-      if (!_8.isString(tagName) || !_8.isString(str))
-        return str;
-      const tagRegex = /((?:<[^>]+>)|(?:[^<]+))/;
-      const tokens = _8.flow(_8.split(tagRegex), _8.compact)(str);
-      let out = "";
-      let tagDepth = 0;
-      for (const token of tokens) {
-        if (token.startsWith(`${CLOSING_TAG_CHAR}${tagName}`))
-          tagDepth--;
-        out += tagDepth > 0 ? escapeTags(token) : token;
-        if (token.startsWith(`${OPENING_TAG_CHAR}${tagName}`))
-          tagDepth++;
-      }
-      return out;
-    };
-  }
-});
-
-// css-modules:css-modules://4JkF5C825c4pv8Vosat9qIwv9j-m3hEXWHpgSlQTM8A.css
-var init_JkF5C825c4pv8Vosat9qIwv9j_m3hEXWHpgSlQTM8A = __esm({
-  "css-modules:css-modules://4JkF5C825c4pv8Vosat9qIwv9j-m3hEXWHpgSlQTM8A.css"() {
+// css-modules:css-modules://zZWuUZWdv3guaQJ1cvM0SwHTxY4fYPtYqwbv1rmUg_o.css
+var init_zZWuUZWdv3guaQJ1cvM0SwHTxY4fYPtYqwbv1rmUg_o = __esm({
+  "css-modules:css-modules://zZWuUZWdv3guaQJ1cvM0SwHTxY4fYPtYqwbv1rmUg_o.css"() {
   }
 });
 
@@ -411,7 +397,7 @@ var src_components_core_ErrorBoundary_default;
 var init_src_components_core_ErrorBoundary = __esm({
   "tmp_esbuild/_src_components_core_ErrorBoundary.module.css"() {
     "use strict";
-    init_JkF5C825c4pv8Vosat9qIwv9j_m3hEXWHpgSlQTM8A();
+    init_zZWuUZWdv3guaQJ1cvM0SwHTxY4fYPtYqwbv1rmUg_o();
     src_components_core_ErrorBoundary_default = { "errorBoundary": "vv-yYzCbG-errorBoundary" };
   }
 });
@@ -425,7 +411,7 @@ var init_ErrorBoundary = __esm({
 });
 
 // src/components/core/ErrorBoundary.tsx
-import React2 from "react";
+import React from "react";
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var ErrorBoundary, ErrorBoundary_default;
 var init_ErrorBoundary2 = __esm({
@@ -433,7 +419,7 @@ var init_ErrorBoundary2 = __esm({
     "use strict";
     init_mode();
     init_ErrorBoundary();
-    ErrorBoundary = class extends React2.Component {
+    ErrorBoundary = class extends React.Component {
       constructor(props) {
         super(props);
         this.state = { hasError: false, message: "", componentStack: "" };
@@ -471,139 +457,659 @@ var init_ErrorBoundary2 = __esm({
   }
 });
 
-// css-modules:css-modules://4-USCbHsBClfq-o-EYY6-LK-ltjIvQ59gWjolWR2IEo.css
-var init_USCbHsBClfq_o_EYY6_LK_ltjIvQ59gWjolWR2IEo = __esm({
-  "css-modules:css-modules://4-USCbHsBClfq-o-EYY6-LK-ltjIvQ59gWjolWR2IEo.css"() {
+// src/constants/index.ts
+var VIVI_CLASSNAME, VIVI_COMPONENT_CLASSNAME_PREFIX, DOCUMENT_CLASSNAME;
+var init_constants = __esm({
+  "src/constants/index.ts"() {
+    "use strict";
+    VIVI_CLASSNAME = "lls-vivi";
+    VIVI_COMPONENT_CLASSNAME_PREFIX = `${VIVI_CLASSNAME}-`;
+    DOCUMENT_CLASSNAME = `${VIVI_COMPONENT_CLASSNAME_PREFIX}document-root`;
   }
 });
 
-// tmp_esbuild/_src_components_core_DocumentHtml.module.css
-var src_components_core_DocumentHtml_default;
-var init_src_components_core_DocumentHtml = __esm({
-  "tmp_esbuild/_src_components_core_DocumentHtml.module.css"() {
+// src/utils/string.ts
+import _8 from "lodash/fp.js";
+var OPENING_TAG_CHAR, ESCAPED_OPENING_TAG_CHAR, CLOSING_TAG_CHAR, removeTrailingNewLines, escapeTags, escapeTagContent;
+var init_string = __esm({
+  "src/utils/string.ts"() {
     "use strict";
-    init_USCbHsBClfq_o_EYY6_LK_ltjIvQ59gWjolWR2IEo();
-    src_components_core_DocumentHtml_default = { "document": "vv-GTaOhq-document" };
+    OPENING_TAG_CHAR = "<";
+    ESCAPED_OPENING_TAG_CHAR = "_<_";
+    CLOSING_TAG_CHAR = "</";
+    removeTrailingNewLines = _8.replace(/(\r?\n|\r)+$/, "");
+    escapeTags = (content) => _8.isString(content) ? content.replace(new RegExp(OPENING_TAG_CHAR, "g"), ESCAPED_OPENING_TAG_CHAR) : content;
+    escapeTagContent = (tagName, str) => {
+      if (!_8.isString(tagName) || !_8.isString(str))
+        return str;
+      const tagRegex = /((?:<[^>]+>)|(?:[^<]+))/;
+      const tokens = _8.flow(_8.split(tagRegex), _8.compact)(str);
+      let out = "";
+      let tagDepth = 0;
+      for (const token of tokens) {
+        if (token.startsWith(`${CLOSING_TAG_CHAR}${tagName}`))
+          tagDepth--;
+        out += tagDepth > 0 ? escapeTags(token) : token;
+        if (token.startsWith(`${OPENING_TAG_CHAR}${tagName}`))
+          tagDepth++;
+      }
+      return out;
+    };
   }
 });
 
-// src/components/core/DocumentHtml.module.css
-var init_DocumentHtml = __esm({
-  "src/components/core/DocumentHtml.module.css"() {
+// src/constants/grid.ts
+var GRID_ZONES_COLORS, ILLUSTRATION_ASPECT_RATIO;
+var init_grid = __esm({
+  "src/constants/grid.ts"() {
+    "use strict";
+    GRID_ZONES_COLORS = [
+      "var(--primary-40-color)",
+      "var(--secondary-40-color)",
+      "var(--premium-40-color)",
+      "var(--green-40-color)",
+      "var(--purple-40-color)",
+      "var(--orange-40-color)",
+      "var(--gray-40-color)",
+      "var(--primary-70-color)",
+      "var(--secondary-70-color)",
+      "var(--premium-70-color)",
+      "var(--green-70-color)",
+      "var(--purple-70-color)",
+      "var(--orange-70-color)"
+    ];
+    ILLUSTRATION_ASPECT_RATIO = 3149 / 2126;
+  }
+});
+
+// src/utils/url.ts
+var asLlsWebp;
+var init_url = __esm({
+  "src/utils/url.ts"() {
     "use strict";
-    init_src_components_core_DocumentHtml();
+    asLlsWebp = (url) => {
+      return /https:\/\/assets(-mid|-lite|-dev|-dev-mid|-dev-lite)?\.lls\.fr.*\.(png|jpe?g)$/.test(url) ? url.replace(/\.(png|jpe?g)$/, ".webp") : url;
+    };
   }
 });
 
-// css-modules:css-modules://O33TtB9PRCTwb4sTLsvHxRLVlvvgk7rVn2k8rnGvKak.css
-var init_O33TtB9PRCTwb4sTLsvHxRLVlvvgk7rVn2k8rnGvKak = __esm({
-  "css-modules:css-modules://O33TtB9PRCTwb4sTLsvHxRLVlvvgk7rVn2k8rnGvKak.css"() {
+// css-modules:css-modules://vFzhiihuB7Z8HMP8oT-qcw0NyCnSgKQtL5TqEfjnBaQ.css
+var init_vFzhiihuB7Z8HMP8oT_qcw0NyCnSgKQtL5TqEfjnBaQ = __esm({
+  "css-modules:css-modules://vFzhiihuB7Z8HMP8oT-qcw0NyCnSgKQtL5TqEfjnBaQ.css"() {
   }
 });
 
-// tmp_esbuild/_src_components_primarygrid_Grid.module.css
-var src_components_primarygrid_Grid_default;
-var init_src_components_primarygrid_Grid = __esm({
-  "tmp_esbuild/_src_components_primarygrid_Grid.module.css"() {
+// tmp_esbuild/_src_components_primarygrid_EditGrid.module.css
+var src_components_primarygrid_EditGrid_default;
+var init_src_components_primarygrid_EditGrid = __esm({
+  "tmp_esbuild/_src_components_primarygrid_EditGrid.module.css"() {
     "use strict";
-    init_O33TtB9PRCTwb4sTLsvHxRLVlvvgk7rVn2k8rnGvKak();
-    src_components_primarygrid_Grid_default = { "interface": "vv-s56jqa-interface", "viewGrid": "vv-s56jqa-viewGrid", "editGrid": "vv-s56jqa-editGrid", "illu": "vv-s56jqa-illu", "layout": "vv-s56jqa-layout" };
+    init_vFzhiihuB7Z8HMP8oT_qcw0NyCnSgKQtL5TqEfjnBaQ();
+    src_components_primarygrid_EditGrid_default = { "col": "vv-WWJSSq-col", "zonePicture": "vv-WWJSSq-zonePicture", "interface": "vv-WWJSSq-interface", "zone": "vv-WWJSSq-zone", "editGrid": "vv-WWJSSq-editGrid", "layout": "vv-WWJSSq-layout", "addZone": "vv-WWJSSq-addZone", "row": "vv-WWJSSq-row", "interfaceHeader": "vv-WWJSSq-interfaceHeader" };
   }
 });
 
-// src/components/primarygrid/Grid.module.css
-var init_Grid = __esm({
-  "src/components/primarygrid/Grid.module.css"() {
+// src/components/primarygrid/EditGrid.module.css
+var init_EditGrid = __esm({
+  "src/components/primarygrid/EditGrid.module.css"() {
     "use strict";
-    init_src_components_primarygrid_Grid();
+    init_src_components_primarygrid_EditGrid();
   }
 });
 
-// src/utils/url.ts
-var asLlsWebp;
-var init_url = __esm({
-  "src/utils/url.ts"() {
+// src/constants/zoneMaker.ts
+var HANDLES, MAGNET_ATTRACTION_ZONE;
+var init_zoneMaker = __esm({
+  "src/constants/zoneMaker.ts"() {
     "use strict";
-    asLlsWebp = (url) => {
-      return /https:\/\/assets(-mid|-lite|-dev|-dev-mid|-dev-lite)?\.lls\.fr.*\.(png|jpe?g)$/.test(url) ? url.replace(/\.(png|jpe?g)$/, ".webp") : url;
+    HANDLES = [
+      {
+        id: "NW",
+        left: 0,
+        top: 0
+      },
+      {
+        id: "N",
+        left: 50,
+        top: 0
+      },
+      {
+        id: "NE",
+        left: 100,
+        top: 0
+      },
+      {
+        id: "E",
+        left: 100,
+        top: 50
+      },
+      {
+        id: "SE",
+        left: 100,
+        top: 100
+      },
+      {
+        id: "S",
+        left: 50,
+        top: 100
+      },
+      {
+        id: "SW",
+        left: 0,
+        top: 100
+      },
+      {
+        id: "W",
+        left: 0,
+        top: 50
+      }
+    ];
+    MAGNET_ATTRACTION_ZONE = 10;
+  }
+});
+
+// src/utils/zoneMaker.ts
+import _9 from "lodash/fp.js";
+var roundAndBound, getMagnets, dragZoneWithMagnets, dragZone, magnetCursorPosition, resizeZone;
+var init_zoneMaker2 = __esm({
+  "src/utils/zoneMaker.ts"() {
+    "use strict";
+    init_zoneMaker();
+    roundAndBound = (val, min = 0, max = 100) => Math.max(min, Math.min(max, Math.round(val * 10) / 10));
+    getMagnets = ({
+      containerRect,
+      zones,
+      currentZoneId
+    }) => {
+      return _9.flow(
+        () => zones,
+        _9.filter((zone) => zone.id !== currentZoneId),
+        _9.flatMap((zone) => [
+          [containerRect.x + containerRect.width * zone.x / 100, containerRect.y + containerRect.height * zone.y / 100],
+          [containerRect.x + containerRect.width * (zone.x + zone.w) / 100, containerRect.y + containerRect.height * (zone.y + zone.h) / 100]
+        ]),
+        _9.unzip,
+        (result) => ({ x: result[0] ?? [], y: result[1] ?? [] })
+      )();
+    };
+    dragZoneWithMagnets = ({ containerRect, zone, magnets }) => {
+      const zoneInPx = {
+        x: containerRect.x + zone.x * containerRect.width / 100,
+        w: zone.w * containerRect.width / 100,
+        y: containerRect.y + zone.y * containerRect.height / 100,
+        h: zone.h * containerRect.height / 100
+      };
+      const sortedMagnetWithX = _9.sortBy((coordinate) => Math.abs(coordinate - zoneInPx.x), magnets.x);
+      const sortedMagnetWithW = _9.sortBy((coordinate) => Math.abs(coordinate - (zoneInPx.x + zoneInPx.w)), magnets.x);
+      const sortedMagnetWithY = _9.sortBy((coordinate) => Math.abs(coordinate - zoneInPx.y), magnets.y);
+      const sortedMagnetWithH = _9.sortBy((coordinate) => Math.abs(coordinate - (zoneInPx.y + zoneInPx.h)), magnets.y);
+      const draggedX = Math.abs(sortedMagnetWithX[0] - zoneInPx.x) < Math.abs(sortedMagnetWithW[0] - (zoneInPx.x + zoneInPx.w)) && Math.abs(sortedMagnetWithX[0] - zoneInPx.x) <= MAGNET_ATTRACTION_ZONE ? (sortedMagnetWithX[0] - containerRect.x) / containerRect.width * 100 : Math.abs(sortedMagnetWithW[0] - (zoneInPx.x + zoneInPx.w)) <= MAGNET_ATTRACTION_ZONE ? (sortedMagnetWithW[0] - zoneInPx.w - containerRect.x) / containerRect.width * 100 : zone.x;
+      const draggedY = Math.abs(sortedMagnetWithY[0] - zoneInPx.y) < Math.abs(sortedMagnetWithH[0] - (zoneInPx.y + zoneInPx.h)) && Math.abs(sortedMagnetWithY[0] - zoneInPx.y) <= MAGNET_ATTRACTION_ZONE ? (sortedMagnetWithY[0] - containerRect.y) / containerRect.height * 100 : Math.abs(sortedMagnetWithH[0] - (zoneInPx.y + zoneInPx.h)) <= MAGNET_ATTRACTION_ZONE ? (sortedMagnetWithH[0] - zoneInPx.h - containerRect.y) / containerRect.height * 100 : zone.y;
+      return {
+        ...zone,
+        x: draggedX,
+        y: draggedY
+      };
+    };
+    dragZone = ({
+      zone,
+      magnets,
+      startPosition,
+      cursorPosition,
+      containerRect
+    }) => {
+      const cursorMoveX = (cursorPosition.x - startPosition.x) / containerRect.width * 100;
+      const cursorMoveY = (cursorPosition.y - startPosition.y) / containerRect.height * 100;
+      const newX = roundAndBound(zone.x + cursorMoveX, 0, 100 - zone.w);
+      const newY = roundAndBound(zone.y + cursorMoveY, 0, 100 - zone.h);
+      const magnettedZone = dragZoneWithMagnets({
+        containerRect,
+        zone: {
+          ...zone,
+          x: newX,
+          y: newY
+        },
+        magnets
+      });
+      return magnettedZone;
+    };
+    magnetCursorPosition = (cursorPosition, magnets) => {
+      const sortedMagnetX = _9.sortBy((coordinate) => Math.abs(coordinate - cursorPosition.x), magnets.x);
+      const sortedMagnetY = _9.sortBy((coordinate) => Math.abs(coordinate - cursorPosition.y), magnets.y);
+      const x = sortedMagnetX[0] !== void 0 && Math.abs(sortedMagnetX[0] - cursorPosition.x) <= MAGNET_ATTRACTION_ZONE ? sortedMagnetX[0] : cursorPosition.x;
+      const y = sortedMagnetY[0] !== void 0 && Math.abs(sortedMagnetY[0] - cursorPosition.y) <= MAGNET_ATTRACTION_ZONE ? sortedMagnetY[0] : cursorPosition.y;
+      return {
+        x,
+        y
+      };
+    };
+    resizeZone = ({
+      zone,
+      handleId,
+      magnets,
+      cursorPosition,
+      containerRect
+    }) => {
+      if (!handleId)
+        return zone;
+      const magnettedCursorPos = magnetCursorPosition(cursorPosition, magnets);
+      const cursorMoveX = (magnettedCursorPos.x - containerRect.x) / containerRect.width * 100;
+      const cursorMoveY = (magnettedCursorPos.y - containerRect.y) / containerRect.height * 100;
+      const newX = roundAndBound(
+        ["NW", "W", "SW"].includes(handleId) ? cursorMoveX > zone.x + zone.w ? zone.x + zone.w : cursorMoveX : ["NE", "E", "SE"].includes(handleId) ? cursorMoveX < zone.x ? cursorMoveX : zone.x : zone.x
+      );
+      const newWidth = roundAndBound(
+        ["NW", "W", "SW"].includes(handleId) ? cursorMoveX > zone.x + zone.w ? cursorMoveX - newX : zone.w + zone.x - newX : ["NE", "E", "SE"].includes(handleId) ? newX < zone.x ? zone.x - newX : cursorMoveX - zone.x : zone.w,
+        0,
+        100 - newX
+      );
+      const newY = roundAndBound(
+        ["NW", "N", "NE"].includes(handleId) ? cursorMoveY > zone.y + zone.h ? zone.y + zone.h : cursorMoveY : ["SE", "S", "SW"].includes(handleId) ? cursorMoveY < zone.y ? cursorMoveY : zone.y : zone.y
+      );
+      const newHeight = roundAndBound(
+        ["NW", "N", "NE"].includes(handleId) ? cursorMoveY > zone.y + zone.h ? cursorMoveY - newY : zone.h + zone.y - newY : ["SE", "S", "SW"].includes(handleId) ? newY < zone.y ? zone.y - newY : cursorMoveY - zone.y : zone.h,
+        0,
+        100 - newY
+      );
+      return {
+        ...zone,
+        x: newX,
+        w: newWidth,
+        y: newY,
+        h: newHeight
+      };
     };
   }
 });
 
-// src/components/primarygrid/Grid.tsx
-import { useState as useState2 } from "react";
-import { Button as Button2, TextField } from "@lls/lls-kit";
+// css-modules:css-modules://27imZi27_UCk5xmhRkGJbtYm5sGwf0_-1B99-Xe1fxg.css
+var init_imZi27_UCk5xmhRkGJbtYm5sGwf0_1B99_Xe1fxg = __esm({
+  "css-modules:css-modules://27imZi27_UCk5xmhRkGJbtYm5sGwf0_-1B99-Xe1fxg.css"() {
+  }
+});
+
+// tmp_esbuild/_src_components_primarygrid_ZonesMaker.module.css
+var src_components_primarygrid_ZonesMaker_default;
+var init_src_components_primarygrid_ZonesMaker = __esm({
+  "tmp_esbuild/_src_components_primarygrid_ZonesMaker.module.css"() {
+    "use strict";
+    init_imZi27_UCk5xmhRkGJbtYm5sGwf0_1B99_Xe1fxg();
+    src_components_primarygrid_ZonesMaker_default = { "handle": "vv-WzhmXa-handle", "zoneMaker": "vv-WzhmXa-zoneMaker", "pictureZone": "vv-WzhmXa-pictureZone" };
+  }
+});
+
+// src/components/primarygrid/ZonesMaker.module.css
+var init_ZonesMaker = __esm({
+  "src/components/primarygrid/ZonesMaker.module.css"() {
+    "use strict";
+    init_src_components_primarygrid_ZonesMaker();
+  }
+});
+
+// src/components/primarygrid/ZonesMaker.tsx
+import { getClientPosition } from "@lls/utils";
+import { useEffect as useEffect2, useRef, useState as useState2 } from "react";
 import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-var EditGrid, ViewGrid, PrimaryGrid, Grid_default;
-var init_Grid2 = __esm({
-  "src/components/primarygrid/Grid.tsx"() {
+var ZonesMaker, ZonesMaker_default;
+var init_ZonesMaker2 = __esm({
+  "src/components/primarygrid/ZonesMaker.tsx"() {
+    "use strict";
+    init_grid();
+    init_zoneMaker();
+    init_zoneMaker2();
+    init_ZonesMaker();
+    ZonesMaker = ({ pictureUrl, zones, onChangeZone }) => {
+      const ref = useRef(null);
+      const [transformationData, setTransformationData] = useState2(void 0);
+      const onStartDragging = (e, zone) => {
+        if (!ref.current)
+          return;
+        const cursorPosition = getClientPosition(e);
+        const magnets = getMagnets({ containerRect: ref.current.getBoundingClientRect(), currentZoneId: zone.id, zones });
+        setTransformationData({ zone, mode: "drag", magnets, startPosition: cursorPosition });
+      };
+      const onStartResizing = (e, zone, handleId) => {
+        if (!ref.current)
+          return;
+        e.stopPropagation();
+        const cursorPosition = getClientPosition(e);
+        const magnets = getMagnets({ containerRect: ref.current.getBoundingClientRect(), currentZoneId: zone.id, zones });
+        setTransformationData({ zone, mode: "resize", magnets, handleId, startPosition: cursorPosition });
+      };
+      useEffect2(() => {
+        if (!transformationData)
+          return;
+        const onMove = (e) => {
+          if (!ref.current)
+            return;
+          const cursorPosition = getClientPosition(e);
+          const containerRect = ref.current.getBoundingClientRect();
+          const transformedZone = transformationData.mode === "resize" ? resizeZone({
+            zone: transformationData.zone,
+            handleId: transformationData.handleId,
+            magnets: transformationData.magnets,
+            cursorPosition,
+            containerRect
+          }) : dragZone({
+            zone: transformationData.zone,
+            startPosition: transformationData.startPosition,
+            magnets: transformationData.magnets,
+            cursorPosition,
+            containerRect
+          });
+          onChangeZone(transformedZone);
+        };
+        const onStopDragging = () => {
+          setTransformationData(void 0);
+        };
+        document.addEventListener("mousemove", onMove, { passive: true });
+        document.addEventListener("touchmove", onMove, { passive: true });
+        document.addEventListener("mouseup", onStopDragging, { passive: true });
+        document.addEventListener("touchend", onStopDragging, { passive: true });
+        return () => {
+          document.removeEventListener("mousemove", onMove);
+          document.removeEventListener("touchmove", onMove);
+          document.removeEventListener("mouseup", onStopDragging);
+          document.removeEventListener("touchend", onStopDragging);
+        };
+      }, [transformationData, onChangeZone]);
+      return /* @__PURE__ */ jsxs3("div", { className: src_components_primarygrid_ZonesMaker_default.zoneMaker, ref, children: [
+        /* @__PURE__ */ jsx3("img", { alt: "illustration", src: pictureUrl ?? "" }),
+        zones.map((zone, index) => {
+          return /* @__PURE__ */ jsx3(
+            "div",
+            {
+              "data-has-selection": +!!transformationData,
+              "data-selected": +(transformationData?.zone.id === zone.id),
+              className: src_components_primarygrid_ZonesMaker_default.pictureZone,
+              onMouseDown: (e) => onStartDragging(e, zone),
+              onTouchStart: (e) => onStartDragging(e, zone),
+              style: {
+                "--v-zonemaker-x": `${zone.x}%`,
+                "--v-zonemaker-y": `${zone.y}%`,
+                "--v-zonemaker-w": `${zone.w}%`,
+                "--v-zonemaker-h": `${zone.h}%`,
+                "--v-zonemaker-color": GRID_ZONES_COLORS[index % GRID_ZONES_COLORS.length]
+              },
+              children: HANDLES.map((handle) => /* @__PURE__ */ jsx3(
+                "div",
+                {
+                  className: src_components_primarygrid_ZonesMaker_default.handle,
+                  style: {
+                    "--v-zonemaker-handle-left": `${handle.left}%`,
+                    "--v-zonemaker-handle-top": `${handle.top}%`
+                  },
+                  onMouseDown: (e) => onStartResizing(e, zone, handle.id)
+                },
+                handle.id
+              ))
+            },
+            zone.id
+          );
+        })
+      ] });
+    };
+    ZonesMaker_default = ZonesMaker;
+  }
+});
+
+// src/components/primarygrid/EditGrid.tsx
+import { Button as Button2, FlexibleGrid, TextField } from "@lls/lls-kit";
+import { useCallback as useCallback2, useEffect as useEffect3, useState as useState3 } from "react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var EditGrid, EditGrid_default;
+var init_EditGrid2 = __esm({
+  "src/components/primarygrid/EditGrid.tsx"() {
     "use strict";
+    init_grid();
     init_store();
-    init_mode();
-    init_Grid();
     init_url();
+    init_EditGrid();
+    init_ZonesMaker2();
     EditGrid = ({ children, picture }) => {
-      const [picValue, setPicValue] = useState2(picture);
-      const { addPicture, layouts } = useReadMdRendererProps(["layouts", "addPicture"]);
+      const { addPicture, addDocument, updateLayouts, deleteDocument, layouts } = useReadMdRendererProps([
+        "layouts",
+        "addPicture",
+        "addDocument",
+        "updateLayouts",
+        "deleteDocument"
+      ]);
+      const [picValue, setPicValue] = useState3(picture);
+      const [layoutItems, setLayoutItems] = useState3({ items: layouts?.primary ?? [], draft: false });
+      const pictureUrl = picture ? asLlsWebp(picture) : void 0;
+      useEffect3(() => {
+        setLayoutItems({ items: layouts?.primary ?? [], draft: false });
+      }, [layouts?.primary]);
       const onChangePicture = () => {
         addPicture(picValue ?? "");
       };
-      return /* @__PURE__ */ jsxs3("div", { className: src_components_primarygrid_Grid_default.editGrid, children: [
-        /* @__PURE__ */ jsxs3("div", { className: src_components_primarygrid_Grid_default.layout, children: [
-          /* @__PURE__ */ jsx3("div", { className: src_components_primarygrid_Grid_default.illu, children: picture && /* @__PURE__ */ jsx3("img", { alt: "illustration", src: asLlsWebp(picture) }) }),
-          /* @__PURE__ */ jsxs3("div", { className: src_components_primarygrid_Grid_default.interface, children: [
-            /* @__PURE__ */ jsx3("h3", { children: "Interface d'\xE9dition" }),
-            /* @__PURE__ */ jsx3(TextField, { type: "text", placeholder: "Ajouter une url d'asset", value: picValue, onChange: setPicValue }),
-            /* @__PURE__ */ jsx3(Button2, { onClick: onChangePicture, children: "Submit" })
-          ] })
+      const onUpdateLayoutItemProp = (id, prop, value) => {
+        const parsedValue = Number.parseFloat(value);
+        setLayoutItems((prev) => ({
+          items: prev.items.map((item) => item.id === id ? { ...item, [prop]: Number.isNaN(parsedValue) ? 0 : parsedValue } : item),
+          draft: true
+        }));
+      };
+      const goToZone = () => {
+      };
+      const onRemoveDocument = (uuid) => {
+        if (confirm("Voulez-vous vraiment supprimer ce document ?")) {
+          deleteDocument(uuid);
+        }
+      };
+      const onUpdateLayoutItem = useCallback2((newLayoutItem) => {
+        setLayoutItems((prev) => ({ items: prev.items.map((item) => item.id === newLayoutItem.id ? newLayoutItem : item), draft: true }));
+      }, []);
+      useEffect3(() => {
+        if (!layoutItems.draft)
+          return;
+        const timeoutId = setTimeout(() => {
+          updateLayouts({ primary: layoutItems.items });
+        }, 1e3);
+        return () => {
+          clearTimeout(timeoutId);
+        };
+      }, [updateLayouts, layoutItems]);
+      return /* @__PURE__ */ jsxs4("div", { className: src_components_primarygrid_EditGrid_default.editGrid, style: { "--v-grid-picture-aspect-ratio": ILLUSTRATION_ASPECT_RATIO }, children: [
+        /* @__PURE__ */ jsxs4("div", { className: src_components_primarygrid_EditGrid_default.layout, children: [
+          /* @__PURE__ */ jsxs4("div", { className: src_components_primarygrid_EditGrid_default.interface, children: [
+            /* @__PURE__ */ jsxs4("div", { className: src_components_primarygrid_EditGrid_default.interfaceHeader, children: [
+              /* @__PURE__ */ jsx4("h2", { children: "Gestion des Zones" }),
+              /* @__PURE__ */ jsxs4("div", { children: [
+                /* @__PURE__ */ jsx4(TextField, { type: "text", label: "url de la double page", value: picValue, onChange: setPicValue }),
+                /* @__PURE__ */ jsx4(Button2, { onClick: onChangePicture, children: "Submit" })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs4(FlexibleGrid, { gap: 16, minColSize: 320, maxColCount: 6, children: [
+              layoutItems.items.map((layoutItem, index) => {
+                return /* @__PURE__ */ jsxs4("div", { className: src_components_primarygrid_EditGrid_default.zone, children: [
+                  /* @__PURE__ */ jsxs4("div", { className: src_components_primarygrid_EditGrid_default.col, children: [
+                    /* @__PURE__ */ jsxs4("div", { className: src_components_primarygrid_EditGrid_default.row, children: [
+                      /* @__PURE__ */ jsx4("span", { children: /* @__PURE__ */ jsxs4("strong", { children: [
+                        "Zone ",
+                        index + 1
+                      ] }) }),
+                      /* @__PURE__ */ jsxs4("span", { children: [
+                        /* @__PURE__ */ jsx4(Button2, { theme: "gray", accent: "floating", icon: "arrowdown", onClick: goToZone }),
+                        /* @__PURE__ */ jsx4(Button2, { theme: "error", accent: "floating", icon: "trash", onClick: () => onRemoveDocument(layoutItem.id) })
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ jsx4("div", { className: src_components_primarygrid_EditGrid_default.zonePicture, children: /* @__PURE__ */ jsx4(
+                      "div",
+                      {
+                        style: {
+                          "--v-grid-zone-picture-url": `url('${pictureUrl}')`,
+                          "--v-grid-zone-picture-ratio": layoutItem.w / layoutItem.h * ILLUSTRATION_ASPECT_RATIO,
+                          "--v-grid-zone-picture-size": `${1e4 / layoutItem.w}%`,
+                          "--v-grid-zone-picture-left": `${-layoutItem.x}%`,
+                          "--v-grid-zone-picture-top": `${-layoutItem.y}%`,
+                          "--v-grid-zone-picture-color": GRID_ZONES_COLORS[index % GRID_ZONES_COLORS.length]
+                        }
+                      }
+                    ) })
+                  ] }),
+                  /* @__PURE__ */ jsx4("div", { className: src_components_primarygrid_EditGrid_default.col, children: ["x", "y", "w", "h"].map((prop) => {
+                    return /* @__PURE__ */ jsx4(
+                      TextField,
+                      {
+                        type: "number",
+                        label: prop,
+                        value: layoutItem[prop],
+                        width: "100px",
+                        onChange: (value) => onUpdateLayoutItemProp(layoutItem.id, prop, value)
+                      },
+                      prop
+                    );
+                  }) })
+                ] }, layoutItem.id);
+              }),
+              /* @__PURE__ */ jsx4("div", { className: src_components_primarygrid_EditGrid_default.addZone, children: /* @__PURE__ */ jsx4(Button2, { onClick: () => addDocument({ x: 0, y: 0, w: 25, h: 25 }), children: "Add document" }) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx4(ZonesMaker_default, { pictureUrl, zones: layoutItems.items, onChangeZone: onUpdateLayoutItem })
         ] }),
-        /* @__PURE__ */ jsx3("div", { className: src_components_primarygrid_Grid_default.docs, children: /* @__PURE__ */ jsx3("b", { children }) })
+        /* @__PURE__ */ jsx4("div", { className: src_components_primarygrid_EditGrid_default.docs, children: /* @__PURE__ */ jsx4("b", { children }) })
       ] });
     };
+    EditGrid_default = EditGrid;
+  }
+});
+
+// css-modules:css-modules://INxu5dk73JTxjtEzrQ83WOJDTfp5b5jZD8ZfkbKQHIA.css
+var init_INxu5dk73JTxjtEzrQ83WOJDTfp5b5jZD8ZfkbKQHIA = __esm({
+  "css-modules:css-modules://INxu5dk73JTxjtEzrQ83WOJDTfp5b5jZD8ZfkbKQHIA.css"() {
+  }
+});
+
+// tmp_esbuild/_src_components_primarygrid_ViewGrid.module.css
+var src_components_primarygrid_ViewGrid_default;
+var init_src_components_primarygrid_ViewGrid = __esm({
+  "tmp_esbuild/_src_components_primarygrid_ViewGrid.module.css"() {
+    "use strict";
+    init_INxu5dk73JTxjtEzrQ83WOJDTfp5b5jZD8ZfkbKQHIA();
+    src_components_primarygrid_ViewGrid_default = { "illu": "vv-TauroG-illu", "pictureZone": "vv-TauroG-pictureZone", "viewGrid": "vv-TauroG-viewGrid" };
+  }
+});
+
+// src/components/primarygrid/ViewGrid.module.css
+var init_ViewGrid = __esm({
+  "src/components/primarygrid/ViewGrid.module.css"() {
+    "use strict";
+    init_src_components_primarygrid_ViewGrid();
+  }
+});
+
+// src/components/primarygrid/ViewGrid.tsx
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+var ViewGrid, ViewGrid_default;
+var init_ViewGrid2 = __esm({
+  "src/components/primarygrid/ViewGrid.tsx"() {
+    "use strict";
+    init_grid();
+    init_store();
+    init_url();
+    init_ViewGrid();
     ViewGrid = ({ children, picture }) => {
-      return /* @__PURE__ */ jsxs3("div", { className: src_components_primarygrid_Grid_default.viewGrid, children: [
-        /* @__PURE__ */ jsx3("div", { className: src_components_primarygrid_Grid_default.illu, children: picture ? /* @__PURE__ */ jsx3("img", { alt: "illustration", src: asLlsWebp(picture) }) : null }),
-        /* @__PURE__ */ jsx3("div", { className: src_components_primarygrid_Grid_default.docs, children: /* @__PURE__ */ jsx3("b", { children }) })
+      const { layouts } = useReadMdRendererProps(["layouts"]);
+      return /* @__PURE__ */ jsxs5("div", { className: src_components_primarygrid_ViewGrid_default.viewGrid, style: { "--v-grid-picture-aspect-ratio": ILLUSTRATION_ASPECT_RATIO }, children: [
+        /* @__PURE__ */ jsxs5("div", { className: src_components_primarygrid_ViewGrid_default.illu, children: [
+          /* @__PURE__ */ jsx5("img", { alt: "illustration", src: asLlsWebp(picture ?? "") }),
+          layouts?.primary?.map((layoutItem, index) => {
+            return /* @__PURE__ */ jsx5(
+              "div",
+              {
+                className: src_components_primarygrid_ViewGrid_default.pictureZone,
+                style: {
+                  "--v-picturezone-x": `${layoutItem.x}%`,
+                  "--v-picturezone-y": `${layoutItem.y}%`,
+                  "--v-picturezone-w": `${layoutItem.w}%`,
+                  "--v-picturezone-h": `${layoutItem.h}%`,
+                  "--v-picturezone-color": GRID_ZONES_COLORS[index % GRID_ZONES_COLORS.length]
+                }
+              },
+              layoutItem.id
+            );
+          })
+        ] }),
+        /* @__PURE__ */ jsx5("div", { className: src_components_primarygrid_ViewGrid_default.docs, children: /* @__PURE__ */ jsx5("b", { children }) })
       ] });
     };
+    ViewGrid_default = ViewGrid;
+  }
+});
+
+// src/components/primarygrid/Grid.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var PrimaryGrid, Grid_default;
+var init_Grid = __esm({
+  "src/components/primarygrid/Grid.tsx"() {
+    "use strict";
+    init_store();
+    init_mode();
+    init_EditGrid2();
+    init_ViewGrid2();
     PrimaryGrid = (props) => {
       const { mode } = useReadMdRendererProps(["mode"]);
-      return isEditMode(mode) ? /* @__PURE__ */ jsx3(EditGrid, { ...props }) : /* @__PURE__ */ jsx3(ViewGrid, { ...props });
+      return isEditMode(mode) ? /* @__PURE__ */ jsx6(EditGrid_default, { ...props }) : /* @__PURE__ */ jsx6(ViewGrid_default, { ...props });
     };
     Grid_default = PrimaryGrid;
   }
 });
 
+// css-modules:css-modules://8Bws6tfkpio6klj_RtRC_R7kDQ_jPBbqtQQfWJr6y_4.css
+var init_Bws6tfkpio6klj_RtRC_R7kDQ_jPBbqtQQfWJr6y_4 = __esm({
+  "css-modules:css-modules://8Bws6tfkpio6klj_RtRC_R7kDQ_jPBbqtQQfWJr6y_4.css"() {
+  }
+});
+
+// tmp_esbuild/_src_components_core_DocumentHtml.module.css
+var src_components_core_DocumentHtml_default;
+var init_src_components_core_DocumentHtml = __esm({
+  "tmp_esbuild/_src_components_core_DocumentHtml.module.css"() {
+    "use strict";
+    init_Bws6tfkpio6klj_RtRC_R7kDQ_jPBbqtQQfWJr6y_4();
+    src_components_core_DocumentHtml_default = { "document": "vv-GTaOhq-document" };
+  }
+});
+
+// src/components/core/DocumentHtml.module.css
+var init_DocumentHtml = __esm({
+  "src/components/core/DocumentHtml.module.css"() {
+    "use strict";
+    init_src_components_core_DocumentHtml();
+  }
+});
+
 // src/components/core/DocumentHtml.tsx
-import React3, { memo, useRef } from "react";
+import React2, { memo, useRef as useRef2 } from "react";
 import HtmlToReact from "html-to-react";
-import _9 from "lodash/fp.js";
+import _10 from "lodash/fp.js";
 import { cx as cx2 } from "@lls/utils";
-import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 var htmlToReactParser, processNodeDefinitions, MemoToolbar, DocumentHtml, getProcessingInstructions, MdRenderer, DocumentHtml_default;
 var init_DocumentHtml2 = __esm({
   "src/components/core/DocumentHtml.tsx"() {
     "use strict";
     init_DocumentToolbar2();
+    init_ErrorBoundary2();
     init_constants();
     init_store();
     init_dom();
     init_memo();
     init_string();
-    init_ErrorBoundary2();
+    init_Grid();
     init_DocumentHtml();
-    init_Grid2();
     htmlToReactParser = new HtmlToReact.Parser({
       recognizeSelfClosing: true
     });
-    processNodeDefinitions = new HtmlToReact.ProcessNodeDefinitions(React3);
+    processNodeDefinitions = new HtmlToReact.ProcessNodeDefinitions(React2);
     MemoToolbar = memo(({ toolbarProps: props, docJson }) => {
-      const compactMode = _9.get("compactMode", props);
-      const openEditor = _9.get("openEditor", props);
-      const openMetadataEditor = _9.get("openMetadataEditor", props);
-      const deleteCard = _9.get("deleteCard", props);
-      const deleteRightResponses = _9.get("deleteRightResponses", props);
-      return /* @__PURE__ */ jsx4(
+      const compactMode = _10.get("compactMode", props);
+      const openEditor = _10.get("openEditor", props);
+      const openMetadataEditor = _10.get("openMetadataEditor", props);
+      const deleteCard = _10.get("deleteCard", props);
+      const deleteRightResponses = _10.get("deleteRightResponses", props);
+      return /* @__PURE__ */ jsx7(
         Toolbar,
         {
           compactMode,
@@ -617,8 +1123,8 @@ var init_DocumentHtml2 = __esm({
     }, areToolbarPropsEqual);
     DocumentHtml = ({ toolbarProps: props, mdRendererProps, docJson, children: docChildren }) => {
       const { mode } = useReadMdRendererProps(["mode"]);
-      const documentRef = useRef(null);
-      return /* @__PURE__ */ jsxs4(
+      const documentRef = useRef2(null);
+      return /* @__PURE__ */ jsxs6(
         "div",
         {
           ref: documentRef,
@@ -627,25 +1133,25 @@ var init_DocumentHtml2 = __esm({
           "data-isprint": +isPrint(),
           className: cx2(DOCUMENT_CLASSNAME, src_components_core_DocumentHtml_default.document),
           children: [
-            /* @__PURE__ */ jsx4(MemoToolbar, { toolbarProps: props, docJson }),
-            /* @__PURE__ */ jsx4(ErrorBoundary_default, { docJson, mode, children: /* @__PURE__ */ jsx4(MdRenderer, { mdRendererProps, docJson, toolbarProps: props, docChildren }) })
+            /* @__PURE__ */ jsx7(MemoToolbar, { toolbarProps: props, docJson }),
+            /* @__PURE__ */ jsx7(ErrorBoundary_default, { docJson, mode, children: /* @__PURE__ */ jsx7(MdRenderer, { mdRendererProps, docJson, toolbarProps: props, docChildren }) })
           ]
         }
       );
     };
     getProcessingInstructions = ({ docChildren }) => {
       const tag = (nodeName, handler) => ({
-        shouldProcessNode: _9.matchesProperty("name", nodeName),
+        shouldProcessNode: _10.matchesProperty("name", nodeName),
         processNode: handler
       });
-      const shortTag = (name, Component, props = {}, mapAttributes = _9.identity) => {
-        return tag(name, (node, children, key) => /* @__PURE__ */ jsx4(Component, { ...mapAttributes(node.attribs), children, ...props }, key));
+      const _shortTag = (name, Component, props = {}, mapAttributes = _10.identity) => {
+        return tag(name, (node, children, key) => /* @__PURE__ */ jsx7(Component, { ...mapAttributes(node.attribs), children, ...props }, key));
       };
       return [
-        tag("primarygrid", (node) => /* @__PURE__ */ jsx4(Grid_default, { ...node.attribs, children: docChildren }, "grid")),
+        tag("primarygrid", (node) => /* @__PURE__ */ jsx7(Grid_default, { ...node.attribs, children: docChildren }, "grid")),
         {
           shouldProcessNode: (node) => {
-            if (node.type === "text" && _9.trim(node.data) === "") {
+            if (node.type === "text" && _10.trim(node.data) === "") {
               return true;
             }
           },
@@ -663,7 +1169,7 @@ var init_DocumentHtml2 = __esm({
         ...mdRendererProps,
         ...documentProps
       });
-      const contentMd = _9.flow(_9.get("docJson.contentMd"), _9.partial(escapeTagContent, ["code"]), removeTrailingNewLines)(props);
+      const contentMd = _10.flow(_10.get("docJson.contentMd"), _10.partial(escapeTagContent, ["code"]), removeTrailingNewLines)(props);
       const reactElement = htmlToReactParser.parseWithInstructions(contentMd, isValidNode, instructions) || null;
       return reactElement;
     }, areDocumentHtmlPropsEqual);
@@ -671,9 +1177,9 @@ var init_DocumentHtml2 = __esm({
   }
 });
 
-// css-modules:css-modules://J5_xl3NfC9uUzCf8dvnv2lVDvTF6x61j2B3MI8uRK3U.css
-var init_J5_xl3NfC9uUzCf8dvnv2lVDvTF6x61j2B3MI8uRK3U = __esm({
-  "css-modules:css-modules://J5_xl3NfC9uUzCf8dvnv2lVDvTF6x61j2B3MI8uRK3U.css"() {
+// css-modules:css-modules://kTdLFWdq92OvhQjGBgoqbpa-uWI0Nagw0W33VXQfA9A.css
+var init_kTdLFWdq92OvhQjGBgoqbpa_uWI0Nagw0W33VXQfA9A = __esm({
+  "css-modules:css-modules://kTdLFWdq92OvhQjGBgoqbpa-uWI0Nagw0W33VXQfA9A.css"() {
   }
 });
 
@@ -682,8 +1188,8 @@ var src_components_core_Document_default;
 var init_src_components_core_Document = __esm({
   "tmp_esbuild/_src_components_core_Document.module.css"() {
     "use strict";
-    init_J5_xl3NfC9uUzCf8dvnv2lVDvTF6x61j2B3MI8uRK3U();
-    src_components_core_Document_default = { "divSearch": "vv--ZTaFW-divSearch", "rootDocument": "vv--ZTaFW-rootDocument" };
+    init_kTdLFWdq92OvhQjGBgoqbpa_uWI0Nagw0W33VXQfA9A();
+    src_components_core_Document_default = { "rootDocument": "vv--ZTaFW-rootDocument", "divSearch": "vv--ZTaFW-divSearch" };
   }
 });
 
@@ -696,9 +1202,9 @@ var init_Document = __esm({
 });
 
 // src/components/core/Document.tsx
-import _10 from "lodash/fp.js";
-import React4 from "react";
-import { jsx as jsx5 } from "react/jsx-runtime";
+import _11 from "lodash/fp.js";
+import React3 from "react";
+import { jsx as jsx8 } from "react/jsx-runtime";
 var Document, RootDocument, Document_default;
 var init_Document2 = __esm({
   "src/components/core/Document.tsx"() {
@@ -706,19 +1212,19 @@ var init_Document2 = __esm({
     init_DocumentHtml2();
     init_Document();
     Document = ({ docJson, toolbarProps = {}, mdRendererProps }) => {
-      return /* @__PURE__ */ jsx5(DocumentHtml_default, { toolbarProps, mdRendererProps, docJson });
+      return /* @__PURE__ */ jsx8(DocumentHtml_default, { toolbarProps, mdRendererProps, docJson });
     };
     Document.displayName = "Document";
-    RootDocument = React4.forwardRef(({ docJson = {}, toolbarProps, mdRendererProps }, ref) => {
-      const children = _10.getOr([], "children", docJson);
-      return /* @__PURE__ */ jsx5("div", { className: src_components_core_Document_default.rootDocument, ref, children: /* @__PURE__ */ jsx5(
+    RootDocument = React3.forwardRef(({ docJson = {}, toolbarProps, mdRendererProps }, ref) => {
+      const children = _11.getOr([], "children", docJson);
+      return /* @__PURE__ */ jsx8("div", { className: src_components_core_Document_default.rootDocument, ref, children: /* @__PURE__ */ jsx8(
         DocumentHtml_default,
         {
           toolbarProps,
           mdRendererProps,
           docJson,
-          children: _10.map((child) => {
-            return /* @__PURE__ */ jsx5(
+          children: _11.map((child) => {
+            return /* @__PURE__ */ jsx8(
               Document,
               {
                 toolbarProps,
@@ -735,9 +1241,9 @@ var init_Document2 = __esm({
   }
 });
 
-// css-modules:css-modules://qc8hHnFyo6Lr96_0ShIiN5V_2JCgy_z-WPzO51QaEM0.css
-var init_qc8hHnFyo6Lr96_0ShIiN5V_2JCgy_z_WPzO51QaEM0 = __esm({
-  "css-modules:css-modules://qc8hHnFyo6Lr96_0ShIiN5V_2JCgy_z-WPzO51QaEM0.css"() {
+// css-modules:css-modules://Ef1FR8r0TZLJbQLu_YjOXfH5QGvXBuqIuVcDNrn2dlo.css
+var init_Ef1FR8r0TZLJbQLu_YjOXfH5QGvXBuqIuVcDNrn2dlo = __esm({
+  "css-modules:css-modules://Ef1FR8r0TZLJbQLu_YjOXfH5QGvXBuqIuVcDNrn2dlo.css"() {
   }
 });
 
@@ -745,7 +1251,7 @@ var init_qc8hHnFyo6Lr96_0ShIiN5V_2JCgy_z_WPzO51QaEM0 = __esm({
 var init_src_styles_Codemirror = __esm({
   "tmp_esbuild/_src_styles_Codemirror.module.css"() {
     "use strict";
-    init_qc8hHnFyo6Lr96_0ShIiN5V_2JCgy_z_WPzO51QaEM0();
+    init_Ef1FR8r0TZLJbQLu_YjOXfH5QGvXBuqIuVcDNrn2dlo();
   }
 });
 
@@ -757,9 +1263,9 @@ var init_Codemirror = __esm({
   }
 });
 
-// css-modules:css-modules://0JpW1nUt7xW7qwOpENEm-oylMzow4l0aKU2OuIG0bXI.css
-var init_JpW1nUt7xW7qwOpENEm_oylMzow4l0aKU2OuIG0bXI = __esm({
-  "css-modules:css-modules://0JpW1nUt7xW7qwOpENEm-oylMzow4l0aKU2OuIG0bXI.css"() {
+// css-modules:css-modules://-ADr1fQ65axwxa_akiSkLSAd8UytGnzX8BkDH_z6IJg.css
+var init_ADr1fQ65axwxa_akiSkLSAd8UytGnzX8BkDH_z6IJg = __esm({
+  "css-modules:css-modules://-ADr1fQ65axwxa_akiSkLSAd8UytGnzX8BkDH_z6IJg.css"() {
   }
 });
 
@@ -768,7 +1274,7 @@ var src_components_core_viewer_ViewerMd_default;
 var init_src_components_core_viewer_ViewerMd = __esm({
   "tmp_esbuild/_src_components_core_viewer_ViewerMd.module.css"() {
     "use strict";
-    init_JpW1nUt7xW7qwOpENEm_oylMzow4l0aKU2OuIG0bXI();
+    init_ADr1fQ65axwxa_akiSkLSAd8UytGnzX8BkDH_z6IJg();
     src_components_core_viewer_ViewerMd_default = { "viewer": "vv-j3jlxa-viewer kit-themecss", "viewerInner": "vv-j3jlxa-viewerInner" };
   }
 });
@@ -782,11 +1288,11 @@ var init_ViewerMd = __esm({
 });
 
 // src/components/core/viewer/ViewerMd.tsx
-import React5, { useRef as useRef2, useCallback as useCallback2, useMemo } from "react";
-import _11 from "lodash/fp.js";
+import React4, { useRef as useRef3, useCallback as useCallback3, useMemo } from "react";
 import { styleThemeProps } from "@lls/lls-kit";
+import _12 from "lodash/fp.js";
 import { cx as cx3 } from "@lls/utils";
-import { jsx as jsx6 } from "react/jsx-runtime";
+import { jsx as jsx9 } from "react/jsx-runtime";
 var getMdRendererProps, ViewerMd, ViewerMd_default;
 var init_ViewerMd2 = __esm({
   "src/components/core/viewer/ViewerMd.tsx"() {
@@ -796,17 +1302,29 @@ var init_ViewerMd2 = __esm({
     init_template();
     init_Document2();
     init_Codemirror();
-    init_ViewerMd();
     init_constants();
-    getMdRendererProps = _11.pick(["isOffline", "isTouchable", "wasSsrRendered", "picture"]);
-    ViewerMd = React5.forwardRef(
-      ({ template = {}, addPicture = _11.noop, onChange = _11.noop, sizeIndex = 2, fontFamily = "LatoWeb", mode = "view", isDysMode = false, ...props }, ref) => {
-        const pageId = _11.get("id", template);
-        const onChangeCallbackRef = useRef2(_11.noop);
-        const innerViewerRef = useRef2(null);
-        const hashMdRendererProps = _11.flow(
+    init_ViewerMd();
+    getMdRendererProps = _12.pick(["isOffline", "isTouchable", "wasSsrRendered", "picture"]);
+    ViewerMd = React4.forwardRef(
+      ({
+        template = {},
+        addPicture = _12.noop,
+        addDocument = _12.noop,
+        updateLayouts = _12.noop,
+        deleteDocument = _12.noop,
+        onChange = _12.noop,
+        sizeIndex = 2,
+        fontFamily = "LatoWeb",
+        mode = "view",
+        isDysMode = false,
+        ...props
+      }, ref) => {
+        const pageId = _12.get("id", template);
+        const onChangeCallbackRef = useRef3(_12.noop);
+        const innerViewerRef = useRef3(null);
+        const hashMdRendererProps = _12.flow(
           getMdRendererProps,
-          _11.assign({
+          _12.assign({
             mode,
             pageId
           }),
@@ -815,23 +1333,24 @@ var init_ViewerMd2 = __esm({
         onChangeCallbackRef.current = (doc, ctx) => {
           onChange(updateTemplate(template, doc), ctx);
         };
-        const { addDocument, deleteDocument, deleteRightResponses, openEditor, openMetadataEditor } = props;
+        const { deleteRightResponses, openEditor, openMetadataEditor } = props;
         const isPrint2 = isPrint();
         const mdRendererProps = useMemo(() => {
-          return _11.flow(
+          return _12.flow(
             JSON.parse,
-            _11.assign({
+            _12.assign({
               // there should only be FUNCTIONS here
               addPicture,
               addDocument,
+              updateLayouts,
               deleteDocument
             })
           )(hashMdRendererProps);
-        }, [hashMdRendererProps, addPicture, addDocument, deleteDocument]);
-        const onDocChange = useCallback2((doc) => {
+        }, [hashMdRendererProps, addPicture, addDocument, updateLayouts, deleteDocument]);
+        const onDocChange = useCallback3((doc) => {
           onChangeCallbackRef.current(doc);
         }, []);
-        _11.replace;
+        _12.replace;
         useWriteStore({
           mdRendererProps: {
             ...mdRendererProps,
@@ -850,71 +1369,375 @@ var init_ViewerMd2 = __esm({
             openEditor,
             openMetadataEditor
           };
-        }, [deleteDocument, deleteRightResponses, openEditor, openMetadataEditor]);
-        return /* @__PURE__ */ jsx6(
+        }, [deleteDocument, deleteRightResponses, openEditor, openMetadataEditor]);
+        return /* @__PURE__ */ jsx9(
+          "div",
+          {
+            style: {
+              ...styleThemeProps({ isDysMode, sizeIndex, font: fontFamily })
+            },
+            "data-isdysmode": +isDysMode,
+            "data-isprint": +isPrint2,
+            className: cx3(VIVI_CLASSNAME, src_components_core_viewer_ViewerMd_default.viewer),
+            ref,
+            children: /* @__PURE__ */ jsx9("div", { className: src_components_core_viewer_ViewerMd_default.viewerInner, ref: innerViewerRef, "data-mode": mode, children: /* @__PURE__ */ jsx9(Document_default, { mdRendererProps, toolbarProps, docJson: template }) })
+          }
+        );
+      }
+    );
+    ViewerMd_default = ViewerMd;
+  }
+});
+
+// src/components/core/editor/EditViewerMd.tsx
+import React5, { useCallback as useCallback4 } from "react";
+import { jsx as jsx10 } from "react/jsx-runtime";
+var EditViewerMd, EditViewerMd_default;
+var init_EditViewerMd = __esm({
+  "src/components/core/editor/EditViewerMd.tsx"() {
+    "use strict";
+    init_ViewerMd2();
+    init_template();
+    EditViewerMd = React5.forwardRef(({ template, onChange, ...props }, ref) => {
+      const addDocument = useCallback4(
+        (docInfos) => {
+          onChange((template2) => addDocumentToTemplate(template2, docInfos));
+        },
+        [onChange]
+      );
+      const updateLayouts = useCallback4(
+        (newLayouts) => {
+          onChange((template2) => ({ ...template2, layouts: newLayouts }));
+        },
+        [onChange]
+      );
+      const deleteDocument = useCallback4(
+        (uuid) => {
+          onChange((template2) => deleteDocumentFromTemplate(template2, uuid));
+        },
+        [onChange]
+      );
+      const deleteRightResponses = useCallback4(() => {
+      }, []);
+      const addPicture = (picture) => {
+        onChange((prev) => ({ ...prev, contentMd: `<primarygrid picture="${picture}" />` }));
+      };
+      return /* @__PURE__ */ jsx10(
+        ViewerMd_default,
+        {
+          template,
+          addDocument,
+          updateLayouts,
+          deleteDocument,
+          deleteRightResponses,
+          addPicture,
+          mode: "edit",
+          ref,
+          ...props
+        }
+      );
+    });
+    EditViewerMd_default = EditViewerMd;
+  }
+});
+
+// css-modules:css-modules://muFZYOO33Vml22ha9RBNYCIyflFehN2jLe0x7J_g3tk.css
+var init_muFZYOO33Vml22ha9RBNYCIyflFehN2jLe0x7J_g3tk = __esm({
+  "css-modules:css-modules://muFZYOO33Vml22ha9RBNYCIyflFehN2jLe0x7J_g3tk.css"() {
+  }
+});
+
+// tmp_esbuild/_home_ec2-user_actions-runner__work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize.module.css
+var home_ec2_user_actions_runner_work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize_default;
+var init_home_ec2_user_actions_runner_work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize = __esm({
+  "tmp_esbuild/_home_ec2-user_actions-runner__work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize.module.css"() {
+    "use strict";
+    init_muFZYOO33Vml22ha9RBNYCIyflFehN2jLe0x7J_g3tk();
+    home_ec2_user_actions_runner_work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize_default = { "handle": "vv-o5bldq-handle" };
+  }
+});
+
+// ../viewer/src/hooks/useDragAndResize.module.css
+var init_useDragAndResize = __esm({
+  "../viewer/src/hooks/useDragAndResize.module.css"() {
+    "use strict";
+    init_home_ec2_user_actions_runner_work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize();
+  }
+});
+
+// ../viewer/src/hooks/useDragAndResize.tsx
+import { useEffect as useEffect4, useRef as useRef4, useState as useState4 } from "react";
+import _13 from "lodash/fp.js";
+import { Fragment, jsx as jsx11 } from "react/jsx-runtime";
+var resizeHandlersProps, useDragAndResize, useDragAndResize_default;
+var init_useDragAndResize2 = __esm({
+  "../viewer/src/hooks/useDragAndResize.tsx"() {
+    "use strict";
+    init_useDragAndResize();
+    resizeHandlersProps = [
+      {
+        top: "-5px",
+        right: "0",
+        bottom: "calc(100% - 5px)",
+        left: "0",
+        cursor: "row-resize",
+        resizingProps: {
+          shouldSizeX: false,
+          shouldSizeY: true,
+          shouldMoveX: false,
+          shouldMoveY: true
+        }
+      },
+      {
+        top: "0",
+        right: "-5px",
+        bottom: "0",
+        left: "calc(100% - 5px)",
+        cursor: "col-resize",
+        resizingProps: {
+          shouldSizeX: true,
+          shouldSizeY: false,
+          shouldMoveX: false,
+          shouldMoveY: false
+        }
+      },
+      {
+        top: "calc(100% - 5px)",
+        right: "0",
+        bottom: "-5px",
+        left: "0",
+        cursor: "row-resize",
+        resizingProps: {
+          shouldSizeX: false,
+          shouldSizeY: true,
+          shouldMoveX: false,
+          shouldMoveY: false
+        }
+      },
+      {
+        top: "0",
+        right: "calc(100% - 5px)",
+        bottom: "0",
+        left: "-5px",
+        cursor: "col-resize",
+        resizingProps: {
+          shouldSizeX: true,
+          shouldSizeY: false,
+          shouldMoveX: true,
+          shouldMoveY: false
+        }
+      },
+      // corners
+      {
+        top: "-10px",
+        right: "-10px",
+        bottom: "calc(100% - 10px)",
+        left: "calc(100% - 10px)",
+        cursor: "ne-resize",
+        resizingProps: {
+          shouldSizeX: true,
+          shouldSizeY: true,
+          shouldMoveX: false,
+          shouldMoveY: true
+        }
+      },
+      {
+        top: "calc(100% - 10px)",
+        right: "-10px",
+        bottom: "-10px",
+        left: "calc(100% - 10px)",
+        cursor: "se-resize",
+        resizingProps: {
+          shouldSizeX: true,
+          shouldSizeY: true,
+          shouldMoveX: false,
+          shouldMoveY: false
+        }
+      },
+      {
+        top: "calc(100% - 10px)",
+        right: "calc(100% - 10px)",
+        bottom: "-10px",
+        left: "-10px",
+        cursor: "sw-resize",
+        resizingProps: {
+          shouldSizeX: true,
+          shouldSizeY: true,
+          shouldMoveX: true,
+          shouldMoveY: false
+        }
+      },
+      {
+        top: "-10px",
+        right: "calc(100% - 10px)",
+        bottom: "calc(100% - 10px)",
+        left: "-10px",
+        cursor: "nw-resize",
+        resizingProps: {
+          shouldSizeX: true,
+          shouldSizeY: true,
+          shouldMoveX: true,
+          shouldMoveY: true
+        }
+      }
+    ];
+    useDragAndResize = ({ defaultPositions, defaultSize = {}, onResize, canResize = true }) => {
+      const rndRef = useRef4(null);
+      const defaultWidth = defaultSize.width || 0;
+      const defaultHeight = defaultSize.height || 0;
+      const [size, setSize] = useState4({
+        height: defaultHeight,
+        width: defaultWidth
+      });
+      const [resizingData, setResizingData] = useState4({
+        isActive: false,
+        shouldSizeX: false,
+        shouldSizeY: false,
+        shouldMoveX: false,
+        shouldMoveY: false
+      });
+      const positionX = _13.getOr(0, "x", defaultPositions);
+      const bodyWidth = _13.getOr(0, "body.offsetWidth", document);
+      const x = positionX + defaultWidth > bodyWidth ? positionX - defaultWidth : positionX;
+      const [translateData, setTranslateData] = useState4({
+        isActive: false,
+        x,
+        y: _13.getOr(0, "y", defaultPositions)
+      });
+      useEffect4(() => {
+        if (translateData.isActive) {
+          const onMouseUp = () => setTranslateData(_13.set("isActive", false));
+          const onMouseMove = (e) => setTranslateData(({ x: x2, y, ...translateData2 }) => ({
+            ...translateData2,
+            x: x2 + e.movementX,
+            y: y + e.movementY
+          }));
+          document.addEventListener("mouseup", onMouseUp);
+          document.addEventListener("mousemove", onMouseMove);
+          return () => {
+            document.removeEventListener("mouseup", onMouseUp);
+            document.removeEventListener("mousemove", onMouseMove);
+          };
+        }
+      }, [translateData]);
+      useEffect4(() => {
+        if (resizingData.isActive) {
+          if (rndRef.current && !(size.height !== 0 && size.width !== 0)) {
+            const { height, width } = rndRef.current.getBoundingClientRect();
+            setSize({
+              height,
+              width
+            });
+          }
+          const { shouldSizeX, shouldSizeY, shouldMoveX, shouldMoveY } = resizingData;
+          const onMouseUp = () => {
+            setResizingData(_13.set("isActive", false));
+          };
+          const getNewSizeValue = ({
+            shouldMove,
+            shouldSize,
+            value,
+            modifier
+          }) => {
+            switch (true) {
+              case (shouldSize && !shouldMove):
+                return value + modifier;
+              case (shouldSize && shouldMove):
+                return value - modifier;
+              default:
+                return value;
+            }
+          };
+          const onMouseMove = (e) => {
+            setTranslateData(({ x: x2, y, ...translateData2 }) => {
+              const newX = shouldMoveX ? x2 + e.movementX : x2;
+              const newY = shouldMoveY ? y + e.movementY : y;
+              return {
+                ...translateData2,
+                x: newX,
+                y: newY
+              };
+            });
+            setSize(({ height, width }) => {
+              const newSize = {
+                height: getNewSizeValue({
+                  shouldMove: shouldMoveY,
+                  shouldSize: shouldSizeY,
+                  value: height,
+                  modifier: e.movementY
+                }),
+                width: getNewSizeValue({
+                  shouldMove: shouldMoveX,
+                  shouldSize: shouldSizeX,
+                  value: width,
+                  modifier: e.movementX
+                })
+              };
+              onResize?.(newSize);
+              return newSize;
+            });
+          };
+          document.addEventListener("mouseup", onMouseUp);
+          document.addEventListener("mousemove", onMouseMove);
+          return () => {
+            document.removeEventListener("mouseup", onMouseUp);
+            document.removeEventListener("mousemove", onMouseMove);
+          };
+        }
+      }, [size, resizingData, onResize]);
+      const launchTranslate = () => setTranslateData(_13.set("isActive", true));
+      const handlersElement = canResize ? /* @__PURE__ */ jsx11("div", { children: resizeHandlersProps.map((handle, key) => {
+        return /* @__PURE__ */ jsx11(
           "div",
           {
+            className: home_ec2_user_actions_runner_work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize_default.handle,
             style: {
-              ...styleThemeProps({ isDysMode, sizeIndex, font: fontFamily })
+              "--v-top": handle.top,
+              "--v-right": handle.right,
+              "--v-bottom": handle.bottom,
+              "--v-left": handle.left,
+              "--v-cursor": handle.cursor
             },
-            "data-isdysmode": +isDysMode,
-            "data-isprint": +isPrint2,
-            className: cx3(VIVI_CLASSNAME, src_components_core_viewer_ViewerMd_default.viewer),
-            ref,
-            children: /* @__PURE__ */ jsx6("div", { className: src_components_core_viewer_ViewerMd_default.viewerInner, ref: innerViewerRef, "data-mode": mode, children: /* @__PURE__ */ jsx6(Document_default, { mdRendererProps, toolbarProps, docJson: template }) })
-          }
+            ..._13.omit("resizingProps", handle),
+            onMouseDown: () => setResizingData({
+              isActive: true,
+              ..._13.get("resizingProps", handle)
+            })
+          },
+          key
         );
-      }
-    );
-    ViewerMd_default = ViewerMd;
-  }
-});
-
-// src/components/core/editor/EditViewerMd.tsx
-import React6, { useCallback as useCallback3 } from "react";
-import { jsx as jsx7 } from "react/jsx-runtime";
-var EditViewerMd, EditViewerMd_default;
-var init_EditViewerMd = __esm({
-  "src/components/core/editor/EditViewerMd.tsx"() {
-    "use strict";
-    init_ViewerMd2();
-    EditViewerMd = React6.forwardRef(({ template, onChange, ...props }, ref) => {
-      const addDocument = useCallback3(() => {
-      }, []);
-      const deleteDocument = useCallback3((uuid) => {
-      }, []);
-      const deleteRightResponses = useCallback3(() => {
-      }, []);
-      const addPicture = (picture) => {
-        onChange((prev) => ({ ...prev, contentMd: `<primarygrid picture="${picture}" />` }));
+      }) }) : /* @__PURE__ */ jsx11(Fragment, {});
+      const isActive = translateData.isActive || resizingData.isActive;
+      useEffect4(() => {
+        if (!rndRef.current)
+          return;
+        rndRef.current.style.userSelect = isActive ? "none" : "unset";
+        rndRef.current.style.position = "fixed";
+        rndRef.current.style.top = "0";
+        rndRef.current.style.left = "0";
+        rndRef.current.style.transform = `translate3d(${translateData.x}px, ${translateData.y}px, 0)`;
+        rndRef.current.style.height = size.height ? `${size.height}px` : "auto";
+        rndRef.current.style.width = size.width ? `${size.width}px` : "auto";
+      }, [translateData, size, isActive]);
+      return {
+        launchTranslate,
+        handlersElement,
+        rndRef
       };
-      return /* @__PURE__ */ jsx7(
-        ViewerMd_default,
-        {
-          template,
-          addDocument,
-          deleteDocument,
-          deleteRightResponses,
-          addPicture,
-          mode: "edit",
-          ref,
-          ...props
-        }
-      );
-    });
-    EditViewerMd_default = EditViewerMd;
+    };
+    useDragAndResize_default = useDragAndResize;
   }
 });
 
 // src/hooks/useClientMounted.tsx
-import { useEffect as useEffect2, useState as useState3 } from "react";
+import { useEffect as useEffect5, useState as useState5 } from "react";
 var useClientMounted, useClientMounted_default;
 var init_useClientMounted = __esm({
   "src/hooks/useClientMounted.tsx"() {
     "use strict";
     useClientMounted = () => {
-      const [mounted, setMounted] = useState3(false);
-      useEffect2(() => {
+      const [mounted, setMounted] = useState5(false);
+      useEffect5(() => {
         setMounted(true);
       }, []);
       return mounted;
@@ -937,9 +1760,9 @@ var init_lazy = __esm({
   }
 });
 
-// css-modules:css-modules://Uu0I-dgnin4bqXPxKf2Ezpbp2S-JUwCgdli4fWGAqsM.css
-var init_Uu0I_dgnin4bqXPxKf2Ezpbp2S_JUwCgdli4fWGAqsM = __esm({
-  "css-modules:css-modules://Uu0I-dgnin4bqXPxKf2Ezpbp2S-JUwCgdli4fWGAqsM.css"() {
+// css-modules:css-modules://ClwWsN3MG80fL5vx9ZgsHtKB5PCE9WSraTwa_GOO_kA.css
+var init_ClwWsN3MG80fL5vx9ZgsHtKB5PCE9WSraTwa_GOO_kA = __esm({
+  "css-modules:css-modules://ClwWsN3MG80fL5vx9ZgsHtKB5PCE9WSraTwa_GOO_kA.css"() {
   }
 });
 
@@ -948,7 +1771,7 @@ var src_components_lazy_CodemirrorEditor_browser_default;
 var init_src_components_lazy_CodemirrorEditor_browser = __esm({
   "tmp_esbuild/_src_components_lazy_CodemirrorEditor.browser.module.css"() {
     "use strict";
-    init_Uu0I_dgnin4bqXPxKf2Ezpbp2S_JUwCgdli4fWGAqsM();
+    init_ClwWsN3MG80fL5vx9ZgsHtKB5PCE9WSraTwa_GOO_kA();
     src_components_lazy_CodemirrorEditor_browser_default = { "codemirrorWrapper": "vv-E1cuPG-codemirrorWrapper" };
   }
 });
@@ -966,17 +1789,17 @@ var CodemirrorEditor_browser_exports = {};
 __export(CodemirrorEditor_browser_exports, {
   default: () => CodemirrorEditor_browser_default
 });
-import _12 from "lodash/fp.js";
-import { useEffect as useEffect3, useRef as useRef3, useState as useState4 } from "react";
-import { jsx as jsx8 } from "react/jsx-runtime";
+import _14 from "lodash/fp.js";
+import { useEffect as useEffect6, useRef as useRef5, useState as useState6 } from "react";
+import { jsx as jsx12 } from "react/jsx-runtime";
 var TAGS, completeAfter, completeIfAfterLt, completeIfInTag, xmlValidator, CodemirrorEditor, CodemirrorEditor_browser_default;
 var init_CodemirrorEditor_browser2 = __esm({
   "src/components/lazy/CodemirrorEditor.browser.tsx"() {
     "use strict";
     init_constants();
+    init_lazy();
     init_template();
     init_CodemirrorEditor_browser();
-    init_lazy();
     TAGS = {};
     completeAfter = (cm, pred) => {
       if (!pred || pred()) {
@@ -1024,15 +1847,15 @@ var init_CodemirrorEditor_browser2 = __esm({
     };
     CodemirrorEditor = ({
       readOnly,
-      onChange = _12.noop,
+      onChange = _14.noop,
       keyMap,
-      componentDidMount = _12.noop,
+      componentDidMount = _14.noop,
       value = "",
-      onError = _12.noop
+      onError = _14.noop
     }) => {
-      const textarea = useRef3(null);
-      const [editor, setEditor] = useState4(null);
-      useEffect3(() => {
+      const textarea = useRef5(null);
+      const [editor, setEditor] = useState6(null);
+      useEffect6(() => {
         const fn = async () => {
           const codemirror = (await import("codemirror").then(lazyInterop)).default;
           codemirror.registerHelper("lint", "xml", (text) => xmlValidator(codemirror, text, onError));
@@ -1064,7 +1887,7 @@ var init_CodemirrorEditor_browser2 = __esm({
         };
         fn();
       }, [readOnly, keyMap, componentDidMount, onError]);
-      useEffect3(() => {
+      useEffect6(() => {
         if (!editor) {
           return;
         }
@@ -1074,22 +1897,22 @@ var init_CodemirrorEditor_browser2 = __esm({
           editor.off("change", localChange);
         };
       }, [editor, onChange]);
-      return /* @__PURE__ */ jsx8("div", { className: src_components_lazy_CodemirrorEditor_browser_default.codemirrorWrapper, children: /* @__PURE__ */ jsx8("textarea", { ref: textarea, value, onChange: _12.noop }) });
+      return /* @__PURE__ */ jsx12("div", { className: src_components_lazy_CodemirrorEditor_browser_default.codemirrorWrapper, children: /* @__PURE__ */ jsx12("textarea", { ref: textarea, value, onChange: _14.noop }) });
     };
     CodemirrorEditor_browser_default = CodemirrorEditor;
   }
 });
 
 // src/components/core/editor/CodemirrorEditor.tsx
-import React7, { Suspense } from "react";
-import { jsx as jsx9 } from "react/jsx-runtime";
+import React6, { Suspense } from "react";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var LazyEditor, CodemirrorEditor2, CodemirrorEditor_default;
 var init_CodemirrorEditor = __esm({
   "src/components/core/editor/CodemirrorEditor.tsx"() {
     "use strict";
     init_useClientMounted();
     init_lazy();
-    LazyEditor = React7.lazy(
+    LazyEditor = React6.lazy(
       () => (
         // @ts-ignore TODO fallback is causing type issue
         typeof window === "undefined" ? { default: null } : Promise.resolve().then(() => (init_CodemirrorEditor_browser2(), CodemirrorEditor_browser_exports)).then(lazyInterop)
@@ -1097,15 +1920,15 @@ var init_CodemirrorEditor = __esm({
     );
     CodemirrorEditor2 = (props) => {
       const clientMounted = useClientMounted_default();
-      return clientMounted ? /* @__PURE__ */ jsx9(Suspense, { children: /* @__PURE__ */ jsx9(LazyEditor, { ...props }) }) : /* @__PURE__ */ jsx9("div", {});
+      return clientMounted ? /* @__PURE__ */ jsx13(Suspense, { children: /* @__PURE__ */ jsx13(LazyEditor, { ...props }) }) : /* @__PURE__ */ jsx13("div", {});
     };
     CodemirrorEditor_default = CodemirrorEditor2;
   }
 });
 
-// css-modules:css-modules://FCAd7_oVdm9kCj4j2YrzERVva7KEvx20ZcLApy3btiM.css
-var init_FCAd7_oVdm9kCj4j2YrzERVva7KEvx20ZcLApy3btiM = __esm({
-  "css-modules:css-modules://FCAd7_oVdm9kCj4j2YrzERVva7KEvx20ZcLApy3btiM.css"() {
+// css-modules:css-modules://D1lYSSaRELK-xOpLHrAFrFm44xAz5JpuKh1hj285xI4.css
+var init_D1lYSSaRELK_xOpLHrAFrFm44xAz5JpuKh1hj285xI4 = __esm({
+  "css-modules:css-modules://D1lYSSaRELK-xOpLHrAFrFm44xAz5JpuKh1hj285xI4.css"() {
   }
 });
 
@@ -1114,7 +1937,7 @@ var src_components_core_editor_EditorHeaderModal_default;
 var init_src_components_core_editor_EditorHeaderModal = __esm({
   "tmp_esbuild/_src_components_core_editor_EditorHeaderModal.module.css"() {
     "use strict";
-    init_FCAd7_oVdm9kCj4j2YrzERVva7KEvx20ZcLApy3btiM();
+    init_D1lYSSaRELK_xOpLHrAFrFm44xAz5JpuKh1hj285xI4();
     src_components_core_editor_EditorHeaderModal_default = { "header": "vv-go3bmq-header" };
   }
 });
@@ -1128,14 +1951,14 @@ var init_EditorHeaderModal = __esm({
 });
 
 // src/components/core/editor/EditorHeaderModal.tsx
-import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
 var EditorHeaderModal, EditorHeaderModal_default;
 var init_EditorHeaderModal2 = __esm({
   "src/components/core/editor/EditorHeaderModal.tsx"() {
     "use strict";
     init_EditorHeaderModal();
-    EditorHeaderModal = ({ onClick }) => /* @__PURE__ */ jsxs5("div", { children: [
-      /* @__PURE__ */ jsx10(
+    EditorHeaderModal = ({ onClick }) => /* @__PURE__ */ jsxs7("div", { children: [
+      /* @__PURE__ */ jsx14(
         "div",
         {
           className: src_components_core_editor_EditorHeaderModal_default.header,
@@ -1154,7 +1977,7 @@ var init_EditorHeaderModal2 = __esm({
           children: "Principale"
         }
       ),
-      /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsx14(
         "div",
         {
           className: src_components_core_editor_EditorHeaderModal_default.header,
@@ -1171,7 +1994,7 @@ var init_EditorHeaderModal2 = __esm({
           children: "Secondaire"
         }
       ),
-      /* @__PURE__ */ jsxs5(
+      /* @__PURE__ */ jsxs7(
         "div",
         {
           className: src_components_core_editor_EditorHeaderModal_default.header,
@@ -1190,7 +2013,7 @@ var init_EditorHeaderModal2 = __esm({
           ]
         }
       ),
-      /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsx14(
         "div",
         {
           className: src_components_core_editor_EditorHeaderModal_default.header,
@@ -1206,7 +2029,7 @@ var init_EditorHeaderModal2 = __esm({
           children: "Compl\xE9mentaire 2"
         }
       ),
-      /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsx14(
         "div",
         {
           className: src_components_core_editor_EditorHeaderModal_default.header,
@@ -1227,9 +2050,9 @@ var init_EditorHeaderModal2 = __esm({
   }
 });
 
-// css-modules:css-modules://FkovI3JwYnbBlV1RTxx19lg4XpgLRke3kTFrPkeXgkU.css
-var init_FkovI3JwYnbBlV1RTxx19lg4XpgLRke3kTFrPkeXgkU = __esm({
-  "css-modules:css-modules://FkovI3JwYnbBlV1RTxx19lg4XpgLRke3kTFrPkeXgkU.css"() {
+// css-modules:css-modules://FAXEjMKr_nbgBeI0HbQm4Hou8oDtA1fDSwLREXIxVJQ.css
+var init_FAXEjMKr_nbgBeI0HbQm4Hou8oDtA1fDSwLREXIxVJQ = __esm({
+  "css-modules:css-modules://FAXEjMKr_nbgBeI0HbQm4Hou8oDtA1fDSwLREXIxVJQ.css"() {
   }
 });
 
@@ -1238,7 +2061,7 @@ var src_components_core_editor_EditorListModal_default;
 var init_src_components_core_editor_EditorListModal = __esm({
   "tmp_esbuild/_src_components_core_editor_EditorListModal.module.css"() {
     "use strict";
-    init_FkovI3JwYnbBlV1RTxx19lg4XpgLRke3kTFrPkeXgkU();
+    init_FAXEjMKr_nbgBeI0HbQm4Hou8oDtA1fDSwLREXIxVJQ();
     src_components_core_editor_EditorListModal_default = { "ul": "vv-CkF5Qq-ul" };
   }
 });
@@ -1252,7 +2075,7 @@ var init_EditorListModal = __esm({
 });
 
 // src/components/core/editor/EditorListModal.tsx
-import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
 var generateList, EditorListModal, EditorListModal_default;
 var init_EditorListModal2 = __esm({
   "src/components/core/editor/EditorListModal.tsx"() {
@@ -1265,18 +2088,18 @@ var init_EditorListModal2 = __esm({
   <li></li>
 </ul>
 `;
-    EditorListModal = ({ onClick }) => /* @__PURE__ */ jsxs6("div", { children: [
-      /* @__PURE__ */ jsx11("ul", { className: src_components_core_editor_EditorListModal_default.ul, onClick: () => onClick(() => generateList("disc")), children: /* @__PURE__ */ jsx11("li", {}) }),
-      /* @__PURE__ */ jsx11("ul", { className: src_components_core_editor_EditorListModal_default.ul, type: "circle", onClick: () => onClick(() => generateList("circle")), children: /* @__PURE__ */ jsx11("li", {}) }),
-      /* @__PURE__ */ jsx11("ul", { className: src_components_core_editor_EditorListModal_default.ul, type: "square", onClick: () => onClick(() => generateList("square")), children: /* @__PURE__ */ jsx11("li", {}) })
+    EditorListModal = ({ onClick }) => /* @__PURE__ */ jsxs8("div", { children: [
+      /* @__PURE__ */ jsx15("ul", { className: src_components_core_editor_EditorListModal_default.ul, onClick: () => onClick(() => generateList("disc")), children: /* @__PURE__ */ jsx15("li", {}) }),
+      /* @__PURE__ */ jsx15("ul", { className: src_components_core_editor_EditorListModal_default.ul, type: "circle", onClick: () => onClick(() => generateList("circle")), children: /* @__PURE__ */ jsx15("li", {}) }),
+      /* @__PURE__ */ jsx15("ul", { className: src_components_core_editor_EditorListModal_default.ul, type: "square", onClick: () => onClick(() => generateList("square")), children: /* @__PURE__ */ jsx15("li", {}) })
     ] });
     EditorListModal_default = EditorListModal;
   }
 });
 
-// css-modules:css-modules://AB_xeFVw2qTXerTyhSybJJcQHmBUiuYom4Mp_ZIEYrU.css
-var init_AB_xeFVw2qTXerTyhSybJJcQHmBUiuYom4Mp_ZIEYrU = __esm({
-  "css-modules:css-modules://AB_xeFVw2qTXerTyhSybJJcQHmBUiuYom4Mp_ZIEYrU.css"() {
+// css-modules:css-modules://iTcvO_EuuRof0S3Q_EadEoweHD1OFDXkCVSSCGPHK5I.css
+var init_iTcvO_EuuRof0S3Q_EadEoweHD1OFDXkCVSSCGPHK5I = __esm({
+  "css-modules:css-modules://iTcvO_EuuRof0S3Q_EadEoweHD1OFDXkCVSSCGPHK5I.css"() {
   }
 });
 
@@ -1285,7 +2108,7 @@ var src_components_core_editor_EditorMathsModal_default;
 var init_src_components_core_editor_EditorMathsModal = __esm({
   "tmp_esbuild/_src_components_core_editor_EditorMathsModal.module.css"() {
     "use strict";
-    init_AB_xeFVw2qTXerTyhSybJJcQHmBUiuYom4Mp_ZIEYrU();
+    init_iTcvO_EuuRof0S3Q_EadEoweHD1OFDXkCVSSCGPHK5I();
     src_components_core_editor_EditorMathsModal_default = { "mathsElement": "vv-XGJSGG-mathsElement" };
   }
 });
@@ -1299,25 +2122,25 @@ var init_EditorMathsModal = __esm({
 });
 
 // src/components/core/editor/EditorMathsModal.tsx
-import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
 var EditorMathsModal, EditorMathsModal_default;
 var init_EditorMathsModal2 = __esm({
   "src/components/core/editor/EditorMathsModal.tsx"() {
     "use strict";
     init_EditorMathsModal();
-    EditorMathsModal = ({ onClick }) => /* @__PURE__ */ jsxs7("div", { children: [
-      /* @__PURE__ */ jsx12("div", { className: src_components_core_editor_EditorMathsModal_default.mathsElement, onClick: () => onClick((selectedText) => `<math>${selectedText}</math>`), children: "KaTeX" }),
-      /* @__PURE__ */ jsx12("div", { className: src_components_core_editor_EditorMathsModal_default.mathsElement, onClick: () => onClick((selectedText) => `\\text{${selectedText}}`), children: "\\text {...}" }),
-      /* @__PURE__ */ jsx12("div", { className: src_components_core_editor_EditorMathsModal_default.mathsElement, onClick: () => onClick((selectedText) => `<python inline="true">${selectedText}</python>`), children: "python" }),
-      /* @__PURE__ */ jsx12("div", { className: src_components_core_editor_EditorMathsModal_default.mathsElement, onClick: () => onClick((selectedText) => `<geogebra>${selectedText}</geogebra>`), children: "geogebra" })
+    EditorMathsModal = ({ onClick }) => /* @__PURE__ */ jsxs9("div", { children: [
+      /* @__PURE__ */ jsx16("div", { className: src_components_core_editor_EditorMathsModal_default.mathsElement, onClick: () => onClick((selectedText) => `<math>${selectedText}</math>`), children: "KaTeX" }),
+      /* @__PURE__ */ jsx16("div", { className: src_components_core_editor_EditorMathsModal_default.mathsElement, onClick: () => onClick((selectedText) => `\\text{${selectedText}}`), children: "\\text {...}" }),
+      /* @__PURE__ */ jsx16("div", { className: src_components_core_editor_EditorMathsModal_default.mathsElement, onClick: () => onClick((selectedText) => `<python inline="true">${selectedText}</python>`), children: "python" }),
+      /* @__PURE__ */ jsx16("div", { className: src_components_core_editor_EditorMathsModal_default.mathsElement, onClick: () => onClick((selectedText) => `<geogebra>${selectedText}</geogebra>`), children: "geogebra" })
     ] });
     EditorMathsModal_default = EditorMathsModal;
   }
 });
 
-// css-modules:css-modules://_GzDFX1RUCKi2_4ubFGNz3yW0aeiUb867B6oz559skY.css
-var init_GzDFX1RUCKi2_4ubFGNz3yW0aeiUb867B6oz559skY = __esm({
-  "css-modules:css-modules://_GzDFX1RUCKi2_4ubFGNz3yW0aeiUb867B6oz559skY.css"() {
+// css-modules:css-modules://-Z7nD8VDTTbf2fdFuqZ2hX3q2ctyJaUVhprv-NQnySo.css
+var init_Z7nD8VDTTbf2fdFuqZ2hX3q2ctyJaUVhprv_NQnySo = __esm({
+  "css-modules:css-modules://-Z7nD8VDTTbf2fdFuqZ2hX3q2ctyJaUVhprv-NQnySo.css"() {
   }
 });
 
@@ -1326,7 +2149,7 @@ var src_components_core_editor_EditorOrderedListModal_default;
 var init_src_components_core_editor_EditorOrderedListModal = __esm({
   "tmp_esbuild/_src_components_core_editor_EditorOrderedListModal.module.css"() {
     "use strict";
-    init_GzDFX1RUCKi2_4ubFGNz3yW0aeiUb867B6oz559skY();
+    init_Z7nD8VDTTbf2fdFuqZ2hX3q2ctyJaUVhprv_NQnySo();
     src_components_core_editor_EditorOrderedListModal_default = { "ol": "vv-IbixEG-ol" };
   }
 });
@@ -1340,7 +2163,7 @@ var init_EditorOrderedListModal = __esm({
 });
 
 // src/components/core/editor/EditorOrderedListModal.tsx
-import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
 var generateList2, EditorOrderedListModal, EditorOrderedListModal_default;
 var init_EditorOrderedListModal2 = __esm({
   "src/components/core/editor/EditorOrderedListModal.tsx"() {
@@ -1353,40 +2176,40 @@ var init_EditorOrderedListModal2 = __esm({
   <li></li>
 </ol>
 `;
-    EditorOrderedListModal = ({ onClick }) => /* @__PURE__ */ jsxs8("div", { children: [
-      /* @__PURE__ */ jsxs8("ol", { className: src_components_core_editor_EditorOrderedListModal_default.ol, type: "1", onClick: () => onClick(() => generateList2("1")), children: [
-        /* @__PURE__ */ jsx13("li", {}),
-        /* @__PURE__ */ jsx13("li", {}),
-        /* @__PURE__ */ jsx13("li", {})
+    EditorOrderedListModal = ({ onClick }) => /* @__PURE__ */ jsxs10("div", { children: [
+      /* @__PURE__ */ jsxs10("ol", { className: src_components_core_editor_EditorOrderedListModal_default.ol, type: "1", onClick: () => onClick(() => generateList2("1")), children: [
+        /* @__PURE__ */ jsx17("li", {}),
+        /* @__PURE__ */ jsx17("li", {}),
+        /* @__PURE__ */ jsx17("li", {})
       ] }),
-      /* @__PURE__ */ jsxs8("ol", { className: src_components_core_editor_EditorOrderedListModal_default.ol, type: "a", onClick: () => onClick(() => generateList2("a")), children: [
-        /* @__PURE__ */ jsx13("li", {}),
-        /* @__PURE__ */ jsx13("li", {}),
-        /* @__PURE__ */ jsx13("li", {})
+      /* @__PURE__ */ jsxs10("ol", { className: src_components_core_editor_EditorOrderedListModal_default.ol, type: "a", onClick: () => onClick(() => generateList2("a")), children: [
+        /* @__PURE__ */ jsx17("li", {}),
+        /* @__PURE__ */ jsx17("li", {}),
+        /* @__PURE__ */ jsx17("li", {})
       ] }),
-      /* @__PURE__ */ jsxs8("ol", { className: src_components_core_editor_EditorOrderedListModal_default.ol, type: "A", onClick: () => onClick(() => generateList2("A")), children: [
-        /* @__PURE__ */ jsx13("li", {}),
-        /* @__PURE__ */ jsx13("li", {}),
-        /* @__PURE__ */ jsx13("li", {})
+      /* @__PURE__ */ jsxs10("ol", { className: src_components_core_editor_EditorOrderedListModal_default.ol, type: "A", onClick: () => onClick(() => generateList2("A")), children: [
+        /* @__PURE__ */ jsx17("li", {}),
+        /* @__PURE__ */ jsx17("li", {}),
+        /* @__PURE__ */ jsx17("li", {})
       ] }),
-      /* @__PURE__ */ jsxs8("ol", { className: src_components_core_editor_EditorOrderedListModal_default.ol, type: "i", onClick: () => onClick(() => generateList2("i")), children: [
-        /* @__PURE__ */ jsx13("li", {}),
-        /* @__PURE__ */ jsx13("li", {}),
-        /* @__PURE__ */ jsx13("li", {})
+      /* @__PURE__ */ jsxs10("ol", { className: src_components_core_editor_EditorOrderedListModal_default.ol, type: "i", onClick: () => onClick(() => generateList2("i")), children: [
+        /* @__PURE__ */ jsx17("li", {}),
+        /* @__PURE__ */ jsx17("li", {}),
+        /* @__PURE__ */ jsx17("li", {})
       ] }),
-      /* @__PURE__ */ jsxs8("ol", { className: src_components_core_editor_EditorOrderedListModal_default.ol, type: "I", onClick: () => onClick(() => generateList2("I")), children: [
-        /* @__PURE__ */ jsx13("li", {}),
-        /* @__PURE__ */ jsx13("li", {}),
-        /* @__PURE__ */ jsx13("li", {})
+      /* @__PURE__ */ jsxs10("ol", { className: src_components_core_editor_EditorOrderedListModal_default.ol, type: "I", onClick: () => onClick(() => generateList2("I")), children: [
+        /* @__PURE__ */ jsx17("li", {}),
+        /* @__PURE__ */ jsx17("li", {}),
+        /* @__PURE__ */ jsx17("li", {})
       ] })
     ] });
     EditorOrderedListModal_default = EditorOrderedListModal;
   }
 });
 
-// css-modules:css-modules://ahb12XnLQklrK1BrY92oMAN69OZ4Cr01dyWTP4y8-qw.css
-var init_ahb12XnLQklrK1BrY92oMAN69OZ4Cr01dyWTP4y8_qw = __esm({
-  "css-modules:css-modules://ahb12XnLQklrK1BrY92oMAN69OZ4Cr01dyWTP4y8-qw.css"() {
+// css-modules:css-modules://gesVSQDjVmNzyeAM6C2g6PgbgdrauKrOml9XUyf0d1A.css
+var init_gesVSQDjVmNzyeAM6C2g6PgbgdrauKrOml9XUyf0d1A = __esm({
+  "css-modules:css-modules://gesVSQDjVmNzyeAM6C2g6PgbgdrauKrOml9XUyf0d1A.css"() {
   }
 });
 
@@ -1395,7 +2218,7 @@ var src_components_core_editor_EditorQuestionModal_default;
 var init_src_components_core_editor_EditorQuestionModal = __esm({
   "tmp_esbuild/_src_components_core_editor_EditorQuestionModal.module.css"() {
     "use strict";
-    init_ahb12XnLQklrK1BrY92oMAN69OZ4Cr01dyWTP4y8_qw();
+    init_gesVSQDjVmNzyeAM6C2g6PgbgdrauKrOml9XUyf0d1A();
     src_components_core_editor_EditorQuestionModal_default = { "question": "vv-QBK0Ba-question" };
   }
 });
@@ -1409,19 +2232,19 @@ var init_EditorQuestionModal = __esm({
 });
 
 // src/components/core/editor/EditorQuestionModal.tsx
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
 var EditorQuestionModal, EditorQuestionModal_default;
 var init_EditorQuestionModal2 = __esm({
   "src/components/core/editor/EditorQuestionModal.tsx"() {
     "use strict";
     init_EditorQuestionModal();
-    EditorQuestionModal = ({ onClick }) => /* @__PURE__ */ jsxs9("div", { children: [
-      /* @__PURE__ */ jsx14("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick(() => `<qtarea id="" width="90%" />`), children: "Question textarea" }),
-      /* @__PURE__ */ jsx14("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick((selectedText) => `<qt id="">${selectedText}</qt>`), children: "Question ouverte" }),
-      /* @__PURE__ */ jsx14("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick((selectedText) => `<qs id="">${selectedText}</qs>`), children: 'Question "select"' }),
-      /* @__PURE__ */ jsx14("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick(() => '<qc id="" />'), children: "Question checkbox" }),
-      /* @__PURE__ */ jsx14("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick(() => '<qr id="" value="" />'), children: "Question radio" }),
-      /* @__PURE__ */ jsx14(
+    EditorQuestionModal = ({ onClick }) => /* @__PURE__ */ jsxs11("div", { children: [
+      /* @__PURE__ */ jsx18("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick(() => `<qtarea id="" width="90%" />`), children: "Question textarea" }),
+      /* @__PURE__ */ jsx18("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick((selectedText) => `<qt id="">${selectedText}</qt>`), children: "Question ouverte" }),
+      /* @__PURE__ */ jsx18("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick((selectedText) => `<qs id="">${selectedText}</qs>`), children: 'Question "select"' }),
+      /* @__PURE__ */ jsx18("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick(() => '<qc id="" />'), children: "Question checkbox" }),
+      /* @__PURE__ */ jsx18("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick(() => '<qr id="" value="" />'), children: "Question radio" }),
+      /* @__PURE__ */ jsx18(
         "div",
         {
           className: src_components_core_editor_EditorQuestionModal_default.question,
@@ -1442,8 +2265,8 @@ var init_EditorQuestionModal2 = __esm({
           children: "Question DnD"
         }
       ),
-      /* @__PURE__ */ jsx14("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick((selectedText) => `<qmath id="">${selectedText}</qmath>`), children: "Question maths" }),
-      /* @__PURE__ */ jsx14(
+      /* @__PURE__ */ jsx18("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick((selectedText) => `<qmath id="">${selectedText}</qmath>`), children: "Question maths" }),
+      /* @__PURE__ */ jsx18(
         "div",
         {
           className: src_components_core_editor_EditorQuestionModal_default.question,
@@ -1456,15 +2279,15 @@ var init_EditorQuestionModal2 = __esm({
           children: "Question maths select"
         }
       ),
-      /* @__PURE__ */ jsx14("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick(() => `<qdraw2 id=""/>`), children: "Question draw" })
+      /* @__PURE__ */ jsx18("div", { className: src_components_core_editor_EditorQuestionModal_default.question, onClick: () => onClick(() => `<qdraw2 id=""/>`), children: "Question draw" })
     ] });
     EditorQuestionModal_default = EditorQuestionModal;
   }
 });
 
-// css-modules:css-modules://DniAyX3w8YOM864AikhU7_Oc8wGI75nhWfQ0Eb6A-zg.css
-var init_DniAyX3w8YOM864AikhU7_Oc8wGI75nhWfQ0Eb6A_zg = __esm({
-  "css-modules:css-modules://DniAyX3w8YOM864AikhU7_Oc8wGI75nhWfQ0Eb6A-zg.css"() {
+// css-modules:css-modules://aXP2yBEvDrqZAjdnvRWrB53787qw4y3ToSiBw04uiE8.css
+var init_aXP2yBEvDrqZAjdnvRWrB53787qw4y3ToSiBw04uiE8 = __esm({
+  "css-modules:css-modules://aXP2yBEvDrqZAjdnvRWrB53787qw4y3ToSiBw04uiE8.css"() {
   }
 });
 
@@ -1473,7 +2296,7 @@ var src_components_core_editor_EditorStampModal_default;
 var init_src_components_core_editor_EditorStampModal = __esm({
   "tmp_esbuild/_src_components_core_editor_EditorStampModal.module.css"() {
     "use strict";
-    init_DniAyX3w8YOM864AikhU7_Oc8wGI75nhWfQ0Eb6A_zg();
+    init_aXP2yBEvDrqZAjdnvRWrB53787qw4y3ToSiBw04uiE8();
     src_components_core_editor_EditorStampModal_default = { "stamp": "vv-pmaK1a-stamp" };
   }
 });
@@ -1487,37 +2310,37 @@ var init_EditorStampModal = __esm({
 });
 
 // src/components/core/editor/EditorStampModal.tsx
-import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
 var EditorStampModal, EditorStampModal_default;
 var init_EditorStampModal2 = __esm({
   "src/components/core/editor/EditorStampModal.tsx"() {
     "use strict";
     init_EditorStampModal();
-    EditorStampModal = ({ onClick }) => /* @__PURE__ */ jsxs10("div", { children: [
-      /* @__PURE__ */ jsx15("div", { className: src_components_core_editor_EditorStampModal_default.stamp, onClick: () => onClick((selectedText) => `<stamp theme="" size="">${selectedText}</stamp>`), children: "Stamp classique" }),
-      /* @__PURE__ */ jsx15("div", { className: src_components_core_editor_EditorStampModal_default.stamp, onClick: () => onClick(() => `<stamp theme="" icon="" size=""/>`), children: "Stamp avec icon" })
+    EditorStampModal = ({ onClick }) => /* @__PURE__ */ jsxs12("div", { children: [
+      /* @__PURE__ */ jsx19("div", { className: src_components_core_editor_EditorStampModal_default.stamp, onClick: () => onClick((selectedText) => `<stamp theme="" size="">${selectedText}</stamp>`), children: "Stamp classique" }),
+      /* @__PURE__ */ jsx19("div", { className: src_components_core_editor_EditorStampModal_default.stamp, onClick: () => onClick(() => `<stamp theme="" icon="" size=""/>`), children: "Stamp avec icon" })
     ] });
     EditorStampModal_default = EditorStampModal;
   }
 });
 
 // src/utils/table.ts
-import _13 from "lodash/fp.js";
+import _15 from "lodash/fp.js";
 var generateTable;
 var init_table = __esm({
   "src/utils/table.ts"() {
     "use strict";
     generateTable = ({ column, line }) => {
-      const headLine = _13.times(_13.constant("<th></th>"), column);
-      const bodyLine = _13.times(_13.constant("<td></td>"), column);
+      const headLine = _15.times(_15.constant("<th></th>"), column);
+      const bodyLine = _15.times(_15.constant("<td></td>"), column);
       const head = `<thead>
 		<tr>
-			${_13.join("\n			", headLine)}
+			${_15.join("\n			", headLine)}
 		</tr>
 	</thead>`;
       const body = `<tbody>
-		${_13.times(_13.constant(`<tr>
-			${_13.join("\n			", bodyLine)}
+		${_15.times(_15.constant(`<tr>
+			${_15.join("\n			", bodyLine)}
 		</tr>`), line - 1).join("\n		")}
 	</tbody>`;
       return `<table>
@@ -1529,9 +2352,9 @@ var init_table = __esm({
   }
 });
 
-// css-modules:css-modules://PUzC3cfirwsgprCC0t8XaW2Tcxdie8yFOj0O0VakWmM.css
-var init_PUzC3cfirwsgprCC0t8XaW2Tcxdie8yFOj0O0VakWmM = __esm({
-  "css-modules:css-modules://PUzC3cfirwsgprCC0t8XaW2Tcxdie8yFOj0O0VakWmM.css"() {
+// css-modules:css-modules://l9ewCrSeYzAUJUd9PfLHkZujTTXaJQ-auwa6d-qDY3s.css
+var init_l9ewCrSeYzAUJUd9PfLHkZujTTXaJQ_auwa6d_qDY3s = __esm({
+  "css-modules:css-modules://l9ewCrSeYzAUJUd9PfLHkZujTTXaJQ-auwa6d-qDY3s.css"() {
   }
 });
 
@@ -1540,8 +2363,8 @@ var src_components_core_editor_EditorTableModal_default;
 var init_src_components_core_editor_EditorTableModal = __esm({
   "tmp_esbuild/_src_components_core_editor_EditorTableModal.module.css"() {
     "use strict";
-    init_PUzC3cfirwsgprCC0t8XaW2Tcxdie8yFOj0O0VakWmM();
-    src_components_core_editor_EditorTableModal_default = { "grid": "vv-VbIHYG-grid", "cell": "vv-VbIHYG-cell", "header": "vv-VbIHYG-header", "line": "vv-VbIHYG-line" };
+    init_l9ewCrSeYzAUJUd9PfLHkZujTTXaJQ_auwa6d_qDY3s();
+    src_components_core_editor_EditorTableModal_default = { "line": "vv-VbIHYG-line", "cell": "vv-VbIHYG-cell", "grid": "vv-VbIHYG-grid", "header": "vv-VbIHYG-header" };
   }
 });
 
@@ -1554,9 +2377,9 @@ var init_EditorTableModal = __esm({
 });
 
 // src/components/core/editor/EditorTableModal.tsx
-import { useCallback as useCallback4, useState as useState5 } from "react";
-import _14 from "lodash/fp.js";
-import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
+import { useCallback as useCallback5, useState as useState7 } from "react";
+import _16 from "lodash/fp.js";
+import { jsx as jsx20, jsxs as jsxs13 } from "react/jsx-runtime";
 var LINE_COUNT, COLUMN_COUNT, CELL_WIDTH, CELL_HEIGHT, CELL_MARGIN, LINE_WIDTH, Cell, EditorTableModal, EditorTableModal_default;
 var init_EditorTableModal2 = __esm({
   "src/components/core/editor/EditorTableModal.tsx"() {
@@ -1570,13 +2393,13 @@ var init_EditorTableModal2 = __esm({
     CELL_MARGIN = 1;
     LINE_WIDTH = LINE_COUNT * CELL_WIDTH + (LINE_COUNT - 1) * CELL_MARGIN;
     Cell = ({ isSelected = false, onMouseEnter, onClick, column, line }) => {
-      const onMouseEnterCallback = useCallback4(() => {
+      const onMouseEnterCallback = useCallback5(() => {
         onMouseEnter({ column, line });
       }, [column, line, onMouseEnter]);
-      const onClickCallback = useCallback4(() => {
+      const onClickCallback = useCallback5(() => {
         onClick({ column, line });
       }, [column, line, onClick]);
-      return /* @__PURE__ */ jsx16(
+      return /* @__PURE__ */ jsx20(
         "div",
         {
           className: src_components_core_editor_EditorTableModal_default.cell,
@@ -1588,27 +2411,27 @@ var init_EditorTableModal2 = __esm({
       );
     };
     EditorTableModal = ({ onClick }) => {
-      const [selected, setSelected] = useState5({ line: 0, column: 0 });
-      const onMouseEnter = useCallback4(({ column, line }) => {
+      const [selected, setSelected] = useState7({ line: 0, column: 0 });
+      const onMouseEnter = useCallback5(({ column, line }) => {
         setSelected({ line, column });
       }, []);
-      const createTable = useCallback4(
+      const createTable = useCallback5(
         ({ column, line }) => {
           onClick(() => generateTable({ column, line }));
         },
         [onClick]
       );
-      const selectedLine = _14.getOr(0, "line", selected);
-      const selectedColumn = _14.getOr(0, "column", selected);
-      return /* @__PURE__ */ jsxs11("div", { children: [
-        /* @__PURE__ */ jsx16("div", { className: src_components_core_editor_EditorTableModal_default.header, children: `${selectedLine} x ${selectedColumn}` }),
-        /* @__PURE__ */ jsx16("div", { className: src_components_core_editor_EditorTableModal_default.grid, style: { "--v-line-width": `${LINE_WIDTH}px` }, children: _14.flow(
-          _14.range(1),
-          _14.map((line) => /* @__PURE__ */ jsx16("div", { className: src_components_core_editor_EditorTableModal_default.line, style: { "--v-cell-margin": `${CELL_MARGIN}px` }, children: _14.flow(
-            _14.range(1),
-            _14.map((column) => {
+      const selectedLine = _16.getOr(0, "line", selected);
+      const selectedColumn = _16.getOr(0, "column", selected);
+      return /* @__PURE__ */ jsxs13("div", { children: [
+        /* @__PURE__ */ jsx20("div", { className: src_components_core_editor_EditorTableModal_default.header, children: `${selectedLine} x ${selectedColumn}` }),
+        /* @__PURE__ */ jsx20("div", { className: src_components_core_editor_EditorTableModal_default.grid, style: { "--v-line-width": `${LINE_WIDTH}px` }, children: _16.flow(
+          _16.range(1),
+          _16.map((line) => /* @__PURE__ */ jsx20("div", { className: src_components_core_editor_EditorTableModal_default.line, style: { "--v-cell-margin": `${CELL_MARGIN}px` }, children: _16.flow(
+            _16.range(1),
+            _16.map((column) => {
               const isselected = line <= selectedLine && column <= selectedColumn;
-              return /* @__PURE__ */ jsx16(Cell, { isSelected: isselected, onMouseEnter, onClick: createTable, column, line }, column);
+              return /* @__PURE__ */ jsx20(Cell, { isSelected: isselected, onMouseEnter, onClick: createTable, column, line }, column);
             })
           )(COLUMN_COUNT) }, line))
         )(LINE_COUNT) })
@@ -1618,9 +2441,9 @@ var init_EditorTableModal2 = __esm({
   }
 });
 
-// css-modules:css-modules://cxKXXItV67ua_TIlhaSrnnrkoXVY8-Oh89yukaCrcmw.css
-var init_cxKXXItV67ua_TIlhaSrnnrkoXVY8_Oh89yukaCrcmw = __esm({
-  "css-modules:css-modules://cxKXXItV67ua_TIlhaSrnnrkoXVY8-Oh89yukaCrcmw.css"() {
+// css-modules:css-modules://V9YMxBzxg_bf_yrJnoKZc7V_grOZr8Z66I81mib-oQ4.css
+var init_V9YMxBzxg_bf_yrJnoKZc7V_grOZr8Z66I81mib_oQ4 = __esm({
+  "css-modules:css-modules://V9YMxBzxg_bf_yrJnoKZc7V_grOZr8Z66I81mib-oQ4.css"() {
   }
 });
 
@@ -1629,8 +2452,8 @@ var src_components_core_editor_EditorTitleModal_default;
 var init_src_components_core_editor_EditorTitleModal = __esm({
   "tmp_esbuild/_src_components_core_editor_EditorTitleModal.module.css"() {
     "use strict";
-    init_cxKXXItV67ua_TIlhaSrnnrkoXVY8_Oh89yukaCrcmw();
-    src_components_core_editor_EditorTitleModal_default = { "body2": "vv-_Pgo7W-body2", "body1": "vv-_Pgo7W-body1", "h1": "vv-_Pgo7W-h1", "body3": "vv-_Pgo7W-body3", "h4": "vv-_Pgo7W-h4", "h3": "vv-_Pgo7W-h3", "title": "vv-_Pgo7W-title", "h2": "vv-_Pgo7W-h2" };
+    init_V9YMxBzxg_bf_yrJnoKZc7V_grOZr8Z66I81mib_oQ4();
+    src_components_core_editor_EditorTitleModal_default = { "body3": "vv-_Pgo7W-body3", "title": "vv-_Pgo7W-title", "h2": "vv-_Pgo7W-h2", "h4": "vv-_Pgo7W-h4", "body1": "vv-_Pgo7W-body1", "body2": "vv-_Pgo7W-body2", "h1": "vv-_Pgo7W-h1", "h3": "vv-_Pgo7W-h3" };
   }
 });
 
@@ -1644,28 +2467,28 @@ var init_EditorTitleModal = __esm({
 
 // src/components/core/editor/EditorTitleModal.tsx
 import { cx as cx4 } from "@lls/utils";
-import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs14 } from "react/jsx-runtime";
 var EditorTitlesModal, EditorTitleModal_default;
 var init_EditorTitleModal2 = __esm({
   "src/components/core/editor/EditorTitleModal.tsx"() {
     "use strict";
     init_EditorTitleModal();
-    EditorTitlesModal = ({ onClick }) => /* @__PURE__ */ jsxs12("div", { children: [
-      /* @__PURE__ */ jsx17("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.h1, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<h1>${selectedText}</h1>`), children: "h1" }),
-      /* @__PURE__ */ jsx17("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.h2, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<h2>${selectedText}</h2>`), children: "h2" }),
-      /* @__PURE__ */ jsx17("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.h3, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<h3>${selectedText}</h3>`), children: "h3" }),
-      /* @__PURE__ */ jsx17("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.h4, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<h4>${selectedText}</h4>`), children: "h4" }),
-      /* @__PURE__ */ jsx17("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.body1, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<body1>${selectedText}</body1>`), children: "body1" }),
-      /* @__PURE__ */ jsx17("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.body2, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<body2>${selectedText}</body2>`), children: "body2" }),
-      /* @__PURE__ */ jsx17("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.body3, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<body3>${selectedText}</body3>`), children: "body3" })
+    EditorTitlesModal = ({ onClick }) => /* @__PURE__ */ jsxs14("div", { children: [
+      /* @__PURE__ */ jsx21("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.h1, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<h1>${selectedText}</h1>`), children: "h1" }),
+      /* @__PURE__ */ jsx21("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.h2, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<h2>${selectedText}</h2>`), children: "h2" }),
+      /* @__PURE__ */ jsx21("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.h3, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<h3>${selectedText}</h3>`), children: "h3" }),
+      /* @__PURE__ */ jsx21("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.h4, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<h4>${selectedText}</h4>`), children: "h4" }),
+      /* @__PURE__ */ jsx21("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.body1, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<body1>${selectedText}</body1>`), children: "body1" }),
+      /* @__PURE__ */ jsx21("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.body2, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<body2>${selectedText}</body2>`), children: "body2" }),
+      /* @__PURE__ */ jsx21("div", { className: cx4(src_components_core_editor_EditorTitleModal_default.body3, src_components_core_editor_EditorTitleModal_default.title), onClick: () => onClick((selectedText) => `<body3>${selectedText}</body3>`), children: "body3" })
     ] });
     EditorTitleModal_default = EditorTitlesModal;
   }
 });
 
-// css-modules:css-modules://YBH8CYiZVZGfw4n4G7PaCkm4JaDo0T7vSO2XxXTjS7s.css
-var init_YBH8CYiZVZGfw4n4G7PaCkm4JaDo0T7vSO2XxXTjS7s = __esm({
-  "css-modules:css-modules://YBH8CYiZVZGfw4n4G7PaCkm4JaDo0T7vSO2XxXTjS7s.css"() {
+// css-modules:css-modules://lMZNEEJTvWcOpUEI82Y2e_I9O1ERlgdLVk01D1TDHyU.css
+var init_lMZNEEJTvWcOpUEI82Y2e_I9O1ERlgdLVk01D1TDHyU = __esm({
+  "css-modules:css-modules://lMZNEEJTvWcOpUEI82Y2e_I9O1ERlgdLVk01D1TDHyU.css"() {
   }
 });
 
@@ -1674,8 +2497,8 @@ var src_components_core_editor_EditorToolbar_default;
 var init_src_components_core_editor_EditorToolbar = __esm({
   "tmp_esbuild/_src_components_core_editor_EditorToolbar.module.css"() {
     "use strict";
-    init_YBH8CYiZVZGfw4n4G7PaCkm4JaDo0T7vSO2XxXTjS7s();
-    src_components_core_editor_EditorToolbar_default = { "span": "vv-LGQOTG-span", "editorToolbar": "vv-LGQOTG-editorToolbar" };
+    init_lMZNEEJTvWcOpUEI82Y2e_I9O1ERlgdLVk01D1TDHyU();
+    src_components_core_editor_EditorToolbar_default = { "editorToolbar": "vv-LGQOTG-editorToolbar", "span": "vv-LGQOTG-span" };
   }
 });
 
@@ -1688,10 +2511,10 @@ var init_EditorToolbar = __esm({
 });
 
 // src/components/core/editor/EditorToolbar.tsx
-import { forwardRef, useCallback as useCallback5, useState as useState6 } from "react";
+import { forwardRef, useCallback as useCallback6, useState as useState8 } from "react";
 import xmlFormat from "xml-formatter";
 import { Button as Button3, ButtonsList, Tooltip as Tooltip2 } from "@lls/lls-kit";
-import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
 import { createElement } from "react";
 var EDITOR_BUTTONS, Dropdown, EditorToolbar, EditorToolbar_default;
 var init_EditorToolbar2 = __esm({
@@ -1850,360 +2673,72 @@ ${selectedText}
         title: "Question"
       },
       {
-        icon: "functions",
-        dropdown: EditorMathsModal_default,
-        action: (maths) => maths,
-        title: "Maths"
-      },
-      {
-        icon: "view_compact",
-        action: (selectedText = "") => `<genially id="${selectedText}" />`,
-        title: "Genially"
-      },
-      {
-        icon: "superscript",
-        action: (selectedText = "") => `<sup>${selectedText}</sup>`,
-        title: "Superscript"
-      },
-      {
-        icon: "subscript",
-        action: (selectedText = "") => `<sub>${selectedText}</sub>`,
-        title: "Subscript"
-      },
-      {
-        icon: "mic",
-        action: () => "<recorder />",
-        title: "Recorder"
-      },
-      {
-        icon: "format_indent_increase",
-        action: (selectedText = "") => xmlFormat(selectedText),
-        title: "Prettify"
-      }
-    ];
-    Dropdown = ({ icon, title, dropdown: Overlay, action }) => {
-      const [visible, setVisible] = useState6(false);
-      const toggleVisible = () => {
-        setVisible((isVisible) => !isVisible);
-      };
-      const onClickOverlay = useCallback5(
-        (params) => {
-          action(params);
-          setVisible(false);
-        },
-        [action]
-      );
-      const listItems = [
-        {
-          type: "component",
-          content: /* @__PURE__ */ jsx18(Overlay, { onClick: onClickOverlay })
-        }
-      ];
-      return /* @__PURE__ */ jsxs13("span", { className: src_components_core_editor_EditorToolbar_default.span, onClick: toggleVisible, children: [
-        /* @__PURE__ */ jsx18(Tooltip2, { content: title, children: /* @__PURE__ */ jsx18(Button3, { theme: "gray", icon, children: " " }) }),
-        visible && /* @__PURE__ */ jsx18(ButtonsList, { listItems, className: src_components_core_editor_EditorToolbar_default.absoluteMenuButton, zIndex: 1, withMask: false })
-      ] });
-    };
-    EditorToolbar = forwardRef(({ replace }, menuRef) => /* @__PURE__ */ jsx18("div", { className: src_components_core_editor_EditorToolbar_default.editorToolbar, ref: menuRef, children: EDITOR_BUTTONS.map((button, i) => {
-      const { icon, action, title, dropdown } = button;
-      return dropdown ? /* @__PURE__ */ createElement(Dropdown, { ...button, action: (callback) => replace(callback), key: i }) : /* @__PURE__ */ jsx18(Tooltip2, { content: title, children: /* @__PURE__ */ jsx18(Button3, { theme: "gray", onClick: () => replace(action, title), icon, children: " " }, i) });
-    }) }));
-    EditorToolbar.displayName = "EditorToolbar";
-    EditorToolbar_default = EditorToolbar;
-  }
-});
-
-// css-modules:css-modules://gqbJUDvYRnw2EEqRHbuvHhtAP_p2lL0u8k92bx4wMAU.css
-var init_gqbJUDvYRnw2EEqRHbuvHhtAP_p2lL0u8k92bx4wMAU = __esm({
-  "css-modules:css-modules://gqbJUDvYRnw2EEqRHbuvHhtAP_p2lL0u8k92bx4wMAU.css"() {
-  }
-});
-
-// tmp_esbuild/_home_ec2-user_github__work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize.module.css
-var home_ec2_user_github_work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize_default;
-var init_home_ec2_user_github_work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize = __esm({
-  "tmp_esbuild/_home_ec2-user_github__work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize.module.css"() {
-    "use strict";
-    init_gqbJUDvYRnw2EEqRHbuvHhtAP_p2lL0u8k92bx4wMAU();
-    home_ec2_user_github_work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize_default = { "handle": "vv-gepzXq-handle" };
-  }
-});
-
-// ../viewer/src/hooks/useDragAndResize.module.css
-var init_useDragAndResize = __esm({
-  "../viewer/src/hooks/useDragAndResize.module.css"() {
-    "use strict";
-    init_home_ec2_user_github_work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize();
-  }
-});
-
-// ../viewer/src/hooks/useDragAndResize.tsx
-import { useEffect as useEffect4, useRef as useRef4, useState as useState7 } from "react";
-import _15 from "lodash/fp.js";
-import { Fragment, jsx as jsx19 } from "react/jsx-runtime";
-var resizeHandlersProps, useDragAndResize, useDragAndResize_default;
-var init_useDragAndResize2 = __esm({
-  "../viewer/src/hooks/useDragAndResize.tsx"() {
-    "use strict";
-    init_useDragAndResize();
-    resizeHandlersProps = [
-      {
-        top: "-5px",
-        right: "0",
-        bottom: "calc(100% - 5px)",
-        left: "0",
-        cursor: "row-resize",
-        resizingProps: {
-          shouldSizeX: false,
-          shouldSizeY: true,
-          shouldMoveX: false,
-          shouldMoveY: true
-        }
-      },
-      {
-        top: "0",
-        right: "-5px",
-        bottom: "0",
-        left: "calc(100% - 5px)",
-        cursor: "col-resize",
-        resizingProps: {
-          shouldSizeX: true,
-          shouldSizeY: false,
-          shouldMoveX: false,
-          shouldMoveY: false
-        }
-      },
-      {
-        top: "calc(100% - 5px)",
-        right: "0",
-        bottom: "-5px",
-        left: "0",
-        cursor: "row-resize",
-        resizingProps: {
-          shouldSizeX: false,
-          shouldSizeY: true,
-          shouldMoveX: false,
-          shouldMoveY: false
-        }
-      },
-      {
-        top: "0",
-        right: "calc(100% - 5px)",
-        bottom: "0",
-        left: "-5px",
-        cursor: "col-resize",
-        resizingProps: {
-          shouldSizeX: true,
-          shouldSizeY: false,
-          shouldMoveX: true,
-          shouldMoveY: false
-        }
+        icon: "functions",
+        dropdown: EditorMathsModal_default,
+        action: (maths) => maths,
+        title: "Maths"
       },
-      // corners
       {
-        top: "-10px",
-        right: "-10px",
-        bottom: "calc(100% - 10px)",
-        left: "calc(100% - 10px)",
-        cursor: "ne-resize",
-        resizingProps: {
-          shouldSizeX: true,
-          shouldSizeY: true,
-          shouldMoveX: false,
-          shouldMoveY: true
-        }
+        icon: "view_compact",
+        action: (selectedText = "") => `<genially id="${selectedText}" />`,
+        title: "Genially"
       },
       {
-        top: "calc(100% - 10px)",
-        right: "-10px",
-        bottom: "-10px",
-        left: "calc(100% - 10px)",
-        cursor: "se-resize",
-        resizingProps: {
-          shouldSizeX: true,
-          shouldSizeY: true,
-          shouldMoveX: false,
-          shouldMoveY: false
-        }
+        icon: "superscript",
+        action: (selectedText = "") => `<sup>${selectedText}</sup>`,
+        title: "Superscript"
       },
       {
-        top: "calc(100% - 10px)",
-        right: "calc(100% - 10px)",
-        bottom: "-10px",
-        left: "-10px",
-        cursor: "sw-resize",
-        resizingProps: {
-          shouldSizeX: true,
-          shouldSizeY: true,
-          shouldMoveX: true,
-          shouldMoveY: false
-        }
+        icon: "subscript",
+        action: (selectedText = "") => `<sub>${selectedText}</sub>`,
+        title: "Subscript"
       },
       {
-        top: "-10px",
-        right: "calc(100% - 10px)",
-        bottom: "calc(100% - 10px)",
-        left: "-10px",
-        cursor: "nw-resize",
-        resizingProps: {
-          shouldSizeX: true,
-          shouldSizeY: true,
-          shouldMoveX: true,
-          shouldMoveY: true
-        }
+        icon: "mic",
+        action: () => "<recorder />",
+        title: "Recorder"
+      },
+      {
+        icon: "format_indent_increase",
+        action: (selectedText = "") => xmlFormat(selectedText),
+        title: "Prettify"
       }
     ];
-    useDragAndResize = ({ defaultPositions, defaultSize = {}, onResize, canResize = true }) => {
-      const rndRef = useRef4(null);
-      const defaultWidth = defaultSize.width || 0;
-      const defaultHeight = defaultSize.height || 0;
-      const [size, setSize] = useState7({
-        height: defaultHeight,
-        width: defaultWidth
-      });
-      const [resizingData, setResizingData] = useState7({
-        isActive: false,
-        shouldSizeX: false,
-        shouldSizeY: false,
-        shouldMoveX: false,
-        shouldMoveY: false
-      });
-      const positionX = _15.getOr(0, "x", defaultPositions);
-      const bodyWidth = _15.getOr(0, "body.offsetWidth", document);
-      const x = positionX + defaultWidth > bodyWidth ? positionX - defaultWidth : positionX;
-      const [translateData, setTranslateData] = useState7({
-        isActive: false,
-        x,
-        y: _15.getOr(0, "y", defaultPositions)
-      });
-      useEffect4(() => {
-        if (translateData.isActive) {
-          const onMouseUp = () => setTranslateData(_15.set("isActive", false));
-          const onMouseMove = (e) => setTranslateData(({ x: x2, y, ...translateData2 }) => ({
-            ...translateData2,
-            x: x2 + e.movementX,
-            y: y + e.movementY
-          }));
-          document.addEventListener("mouseup", onMouseUp);
-          document.addEventListener("mousemove", onMouseMove);
-          return () => {
-            document.removeEventListener("mouseup", onMouseUp);
-            document.removeEventListener("mousemove", onMouseMove);
-          };
-        }
-      }, [translateData]);
-      useEffect4(() => {
-        if (resizingData.isActive) {
-          if (rndRef.current && !(size.height !== 0 && size.width !== 0)) {
-            const { height, width } = rndRef.current.getBoundingClientRect();
-            setSize({
-              height,
-              width
-            });
-          }
-          const { shouldSizeX, shouldSizeY, shouldMoveX, shouldMoveY } = resizingData;
-          const onMouseUp = () => {
-            setResizingData(_15.set("isActive", false));
-          };
-          const getNewSizeValue = ({
-            shouldMove,
-            shouldSize,
-            value,
-            modifier
-          }) => {
-            switch (true) {
-              case (shouldSize && !shouldMove):
-                return value + modifier;
-              case (shouldSize && shouldMove):
-                return value - modifier;
-              default:
-                return value;
-            }
-          };
-          const onMouseMove = (e) => {
-            setTranslateData(({ x: x2, y, ...translateData2 }) => {
-              const newX = shouldMoveX ? x2 + e.movementX : x2;
-              const newY = shouldMoveY ? y + e.movementY : y;
-              return {
-                ...translateData2,
-                x: newX,
-                y: newY
-              };
-            });
-            setSize(({ height, width }) => {
-              const newSize = {
-                height: getNewSizeValue({
-                  shouldMove: shouldMoveY,
-                  shouldSize: shouldSizeY,
-                  value: height,
-                  modifier: e.movementY
-                }),
-                width: getNewSizeValue({
-                  shouldMove: shouldMoveX,
-                  shouldSize: shouldSizeX,
-                  value: width,
-                  modifier: e.movementX
-                })
-              };
-              onResize?.(newSize);
-              return newSize;
-            });
-          };
-          document.addEventListener("mouseup", onMouseUp);
-          document.addEventListener("mousemove", onMouseMove);
-          return () => {
-            document.removeEventListener("mouseup", onMouseUp);
-            document.removeEventListener("mousemove", onMouseMove);
-          };
-        }
-      }, [size, resizingData, onResize]);
-      const launchTranslate = () => setTranslateData(_15.set("isActive", true));
-      const handlersElement = canResize ? /* @__PURE__ */ jsx19("div", { children: resizeHandlersProps.map((handle, key) => {
-        return /* @__PURE__ */ jsx19(
-          "div",
-          {
-            className: home_ec2_user_github_work_monorepo_monorepo_libs_viewer_src_hooks_useDragAndResize_default.handle,
-            style: {
-              "--v-top": handle.top,
-              "--v-right": handle.right,
-              "--v-bottom": handle.bottom,
-              "--v-left": handle.left,
-              "--v-cursor": handle.cursor
-            },
-            ..._15.omit("resizingProps", handle),
-            onMouseDown: () => setResizingData({
-              isActive: true,
-              ..._15.get("resizingProps", handle)
-            })
-          },
-          key
-        );
-      }) }) : /* @__PURE__ */ jsx19(Fragment, {});
-      const isActive = translateData.isActive || resizingData.isActive;
-      useEffect4(() => {
-        if (!rndRef.current)
-          return;
-        rndRef.current.style.userSelect = isActive ? "none" : "unset";
-        rndRef.current.style.position = "fixed";
-        rndRef.current.style.top = "0";
-        rndRef.current.style.left = "0";
-        rndRef.current.style.transform = `translate3d(${translateData.x}px, ${translateData.y}px, 0)`;
-        rndRef.current.style.height = size.height ? `${size.height}px` : "auto";
-        rndRef.current.style.width = size.width ? `${size.width}px` : "auto";
-      }, [translateData, size, isActive]);
-      return {
-        launchTranslate,
-        handlersElement,
-        rndRef
+    Dropdown = ({ icon, title, dropdown: Overlay, action }) => {
+      const [visible, setVisible] = useState8(false);
+      const toggleVisible = () => {
+        setVisible((isVisible) => !isVisible);
       };
+      const onClickOverlay = useCallback6(
+        (params) => {
+          action(params);
+          setVisible(false);
+        },
+        [action]
+      );
+      const listItems = [
+        {
+          type: "component",
+          content: /* @__PURE__ */ jsx22(Overlay, { onClick: onClickOverlay })
+        }
+      ];
+      return /* @__PURE__ */ jsxs15("span", { className: src_components_core_editor_EditorToolbar_default.span, onClick: toggleVisible, children: [
+        /* @__PURE__ */ jsx22(Tooltip2, { content: title, children: /* @__PURE__ */ jsx22(Button3, { theme: "gray", icon, children: " " }) }),
+        visible && /* @__PURE__ */ jsx22(ButtonsList, { listItems, className: src_components_core_editor_EditorToolbar_default.absoluteMenuButton, zIndex: 1, withMask: false })
+      ] });
     };
-    useDragAndResize_default = useDragAndResize;
+    EditorToolbar = forwardRef(({ replace }, menuRef) => /* @__PURE__ */ jsx22("div", { className: src_components_core_editor_EditorToolbar_default.editorToolbar, ref: menuRef, children: EDITOR_BUTTONS.map((button, i) => {
+      const { icon, action, title, dropdown } = button;
+      return dropdown ? /* @__PURE__ */ createElement(Dropdown, { ...button, action: (callback) => replace(callback), key: i }) : /* @__PURE__ */ jsx22(Tooltip2, { content: title, children: /* @__PURE__ */ jsx22(Button3, { theme: "gray", onClick: () => replace(action, title), icon, children: " " }, i) });
+    }) }));
+    EditorToolbar.displayName = "EditorToolbar";
+    EditorToolbar_default = EditorToolbar;
   }
 });
 
-// css-modules:css-modules://4lEiBk0nzPl8xepK8MhbhXKbNfra5VDReD417YnvGVY.css
-var init_lEiBk0nzPl8xepK8MhbhXKbNfra5VDReD417YnvGVY = __esm({
-  "css-modules:css-modules://4lEiBk0nzPl8xepK8MhbhXKbNfra5VDReD417YnvGVY.css"() {
+// css-modules:css-modules://9NNguA--8WOGh41wmBCm8AF1DJWa35r2rfRhLOxgn68.css
+var init_NNguA_8WOGh41wmBCm8AF1DJWa35r2rfRhLOxgn68 = __esm({
+  "css-modules:css-modules://9NNguA--8WOGh41wmBCm8AF1DJWa35r2rfRhLOxgn68.css"() {
   }
 });
 
@@ -2212,8 +2747,8 @@ var src_components_core_editor_Editor_default;
 var init_src_components_core_editor_Editor = __esm({
   "tmp_esbuild/_src_components_core_editor_Editor.module.css"() {
     "use strict";
-    init_lEiBk0nzPl8xepK8MhbhXKbNfra5VDReD417YnvGVY();
-    src_components_core_editor_Editor_default = { "wrapper": "vv-cGAezq-wrapper", "rnd": "vv-cGAezq-rnd", "errorBanner": "vv-cGAezq-errorBanner", "header": "vv-cGAezq-header" };
+    init_NNguA_8WOGh41wmBCm8AF1DJWa35r2rfRhLOxgn68();
+    src_components_core_editor_Editor_default = { "wrapper": "vv-cGAezq-wrapper", "errorBanner": "vv-cGAezq-errorBanner", "rnd": "vv-cGAezq-rnd", "header": "vv-cGAezq-header" };
   }
 });
 
@@ -2226,26 +2761,26 @@ var init_Editor = __esm({
 });
 
 // src/components/core/editor/Editor.tsx
-import { useCallback as useCallback6, useMemo as useMemo2, useRef as useRef5 } from "react";
-import _16 from "lodash/fp.js";
+import { useCallback as useCallback7, useMemo as useMemo2, useRef as useRef6 } from "react";
+import _17 from "lodash/fp.js";
 import { Button as Button4 } from "@lls/lls-kit";
-import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
 var DEFAULT_WIDTH, DEFAULT_HEIGHT, Editor, Editor_default;
 var init_Editor2 = __esm({
   "src/components/core/editor/Editor.tsx"() {
     "use strict";
+    init_useDragAndResize2();
     init_CodemirrorEditor();
     init_EditorToolbar2();
-    init_useDragAndResize2();
     init_Editor();
     DEFAULT_WIDTH = 800;
     DEFAULT_HEIGHT = 500;
     Editor = ({ error, onError, onClose, doc, onDocChange, positions }) => {
-      const editor = useRef5(null);
-      const setEditor = useCallback6((codeMirrorEditor) => {
+      const editor = useRef6(null);
+      const setEditor = useCallback7((codeMirrorEditor) => {
         editor.current = codeMirrorEditor;
       }, []);
-      const replace = useCallback6((callback, title) => {
+      const replace = useCallback7((callback, title) => {
         if (!editor.current)
           return;
         const selection = editor.current.getSelection();
@@ -2259,7 +2794,7 @@ var init_Editor2 = __esm({
         editor.current.focus();
       }, []);
       const onChange = useMemo2(() => {
-        return _16.debounce(500, (contentMd) => onDocChange(_16.set("contentMd", contentMd, doc)));
+        return _17.debounce(500, (contentMd) => onDocChange(_17.set("contentMd", contentMd, doc)));
       }, [doc, onDocChange]);
       const keyMap = useMemo2(() => {
         return {
@@ -2277,11 +2812,11 @@ var init_Editor2 = __esm({
           height: DEFAULT_HEIGHT
         }
       });
-      return /* @__PURE__ */ jsxs14("div", { className: src_components_core_editor_Editor_default.rnd, ref: rndRef, children: [
-        /* @__PURE__ */ jsx20("div", { className: src_components_core_editor_Editor_default.header, onMouseDown: launchTranslate, children: /* @__PURE__ */ jsx20(Button4, { onClick: onClose, theme: "gray", children: "cancel" }) }),
-        /* @__PURE__ */ jsx20(EditorToolbar_default, { replace }),
-        /* @__PURE__ */ jsx20("div", { className: src_components_core_editor_Editor_default.wrapper, children: /* @__PURE__ */ jsx20(CodemirrorEditor_default, { componentDidMount: setEditor, value: _16.get("contentMd", doc), onChange, keyMap, onError }) }),
-        error && /* @__PURE__ */ jsx20("div", { className: src_components_core_editor_Editor_default.errorBanner, children: error }),
+      return /* @__PURE__ */ jsxs16("div", { className: src_components_core_editor_Editor_default.rnd, ref: rndRef, children: [
+        /* @__PURE__ */ jsx23("div", { className: src_components_core_editor_Editor_default.header, onMouseDown: launchTranslate, children: /* @__PURE__ */ jsx23(Button4, { onClick: onClose, theme: "gray", children: "cancel" }) }),
+        /* @__PURE__ */ jsx23(EditorToolbar_default, { replace }),
+        /* @__PURE__ */ jsx23("div", { className: src_components_core_editor_Editor_default.wrapper, children: /* @__PURE__ */ jsx23(CodemirrorEditor_default, { componentDidMount: setEditor, value: _17.get("contentMd", doc), onChange, keyMap, onError }) }),
+        error && /* @__PURE__ */ jsx23("div", { className: src_components_core_editor_Editor_default.errorBanner, children: error }),
         handlersElement
       ] });
     };
@@ -2290,19 +2825,19 @@ var init_Editor2 = __esm({
 });
 
 // src/components/core/editor/EditorSsr.tsx
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 var EditorSsr, EditorSsr_default;
 var init_EditorSsr = __esm({
   "src/components/core/editor/EditorSsr.tsx"() {
     "use strict";
-    EditorSsr = () => /* @__PURE__ */ jsx21("div", {});
+    EditorSsr = () => /* @__PURE__ */ jsx24("div", {});
     EditorSsr_default = EditorSsr;
   }
 });
 
-// css-modules:css-modules://9kfKKHUK56aP19K9XjWXXhpwpX3AbTuXglKvZjMbuNc.css
-var init_kfKKHUK56aP19K9XjWXXhpwpX3AbTuXglKvZjMbuNc = __esm({
-  "css-modules:css-modules://9kfKKHUK56aP19K9XjWXXhpwpX3AbTuXglKvZjMbuNc.css"() {
+// css-modules:css-modules://1MKBW8PG8GbZe8tC6V4ud90v1VdZx3mRrwXlGya-pMc.css
+var init_MKBW8PG8GbZe8tC6V4ud90v1VdZx3mRrwXlGya_pMc = __esm({
+  "css-modules:css-modules://1MKBW8PG8GbZe8tC6V4ud90v1VdZx3mRrwXlGya-pMc.css"() {
   }
 });
 
@@ -2311,7 +2846,7 @@ var src_hooks_useDragAndResize_default;
 var init_src_hooks_useDragAndResize = __esm({
   "tmp_esbuild/_src_hooks_useDragAndResize.module.css"() {
     "use strict";
-    init_kfKKHUK56aP19K9XjWXXhpwpX3AbTuXglKvZjMbuNc();
+    init_MKBW8PG8GbZe8tC6V4ud90v1VdZx3mRrwXlGya_pMc();
     src_hooks_useDragAndResize_default = { "handle": "vv-Uv6i-a-handle" };
   }
 });
@@ -2325,9 +2860,9 @@ var init_useDragAndResize3 = __esm({
 });
 
 // src/hooks/useDragAndResize.tsx
-import { useEffect as useEffect5, useRef as useRef6, useState as useState8 } from "react";
-import _17 from "lodash/fp.js";
-import { Fragment as Fragment2, jsx as jsx22 } from "react/jsx-runtime";
+import { useEffect as useEffect7, useRef as useRef7, useState as useState9 } from "react";
+import _18 from "lodash/fp.js";
+import { Fragment as Fragment2, jsx as jsx25 } from "react/jsx-runtime";
 var resizeHandlersProps2, useDragAndResize2, useDragAndResize_default2;
 var init_useDragAndResize4 = __esm({
   "src/hooks/useDragAndResize.tsx"() {
@@ -2441,31 +2976,31 @@ var init_useDragAndResize4 = __esm({
       }
     ];
     useDragAndResize2 = ({ defaultPositions, defaultSize = {}, onResize, canResize = true }) => {
-      const rndRef = useRef6(null);
+      const rndRef = useRef7(null);
       const defaultWidth = defaultSize.width || 0;
       const defaultHeight = defaultSize.height || 0;
-      const [size, setSize] = useState8({
+      const [size, setSize] = useState9({
         height: defaultHeight,
         width: defaultWidth
       });
-      const [resizingData, setResizingData] = useState8({
+      const [resizingData, setResizingData] = useState9({
         isActive: false,
         shouldSizeX: false,
         shouldSizeY: false,
         shouldMoveX: false,
         shouldMoveY: false
       });
-      const positionX = _17.getOr(0, "x", defaultPositions);
-      const bodyWidth = _17.getOr(0, "body.offsetWidth", document);
+      const positionX = _18.getOr(0, "x", defaultPositions);
+      const bodyWidth = _18.getOr(0, "body.offsetWidth", document);
       const x = positionX + defaultWidth > bodyWidth ? positionX - defaultWidth : positionX;
-      const [translateData, setTranslateData] = useState8({
+      const [translateData, setTranslateData] = useState9({
         isActive: false,
         x,
-        y: _17.getOr(0, "y", defaultPositions)
+        y: _18.getOr(0, "y", defaultPositions)
       });
-      useEffect5(() => {
+      useEffect7(() => {
         if (translateData.isActive) {
-          const onMouseUp = () => setTranslateData(_17.set("isActive", false));
+          const onMouseUp = () => setTranslateData(_18.set("isActive", false));
           const onMouseMove = (e) => setTranslateData(({ x: x2, y, ...translateData2 }) => ({
             ...translateData2,
             x: x2 + e.movementX,
@@ -2479,7 +3014,7 @@ var init_useDragAndResize4 = __esm({
           };
         }
       }, [translateData]);
-      useEffect5(() => {
+      useEffect7(() => {
         if (resizingData.isActive) {
           if (rndRef.current && !(size.height !== 0 && size.width !== 0)) {
             const { height, width } = rndRef.current.getBoundingClientRect();
@@ -2490,7 +3025,7 @@ var init_useDragAndResize4 = __esm({
           }
           const { shouldSizeX, shouldSizeY, shouldMoveX, shouldMoveY } = resizingData;
           const onMouseUp = () => {
-            setResizingData(_17.set("isActive", false));
+            setResizingData(_18.set("isActive", false));
           };
           const getNewSizeValue = ({
             shouldMove,
@@ -2544,9 +3079,9 @@ var init_useDragAndResize4 = __esm({
           };
         }
       }, [size, resizingData, onResize]);
-      const launchTranslate = () => setTranslateData(_17.set("isActive", true));
-      const handlersElement = canResize ? /* @__PURE__ */ jsx22("div", { children: resizeHandlersProps2.map((handle, key) => {
-        return /* @__PURE__ */ jsx22(
+      const launchTranslate = () => setTranslateData(_18.set("isActive", true));
+      const handlersElement = canResize ? /* @__PURE__ */ jsx25("div", { children: resizeHandlersProps2.map((handle, key) => {
+        return /* @__PURE__ */ jsx25(
           "div",
           {
             className: src_hooks_useDragAndResize_default.handle,
@@ -2557,17 +3092,17 @@ var init_useDragAndResize4 = __esm({
               "--v-left": handle.left,
               "--v-cursor": handle.cursor
             },
-            ..._17.omit("resizingProps", handle),
+            ..._18.omit("resizingProps", handle),
             onMouseDown: () => setResizingData({
               isActive: true,
-              ..._17.get("resizingProps", handle)
+              ..._18.get("resizingProps", handle)
             })
           },
           key
         );
-      }) }) : /* @__PURE__ */ jsx22(Fragment2, {});
+      }) }) : /* @__PURE__ */ jsx25(Fragment2, {});
       const isActive = translateData.isActive || resizingData.isActive;
-      useEffect5(() => {
+      useEffect7(() => {
         if (!rndRef.current)
           return;
         rndRef.current.style.userSelect = isActive ? "none" : "unset";
@@ -2588,9 +3123,9 @@ var init_useDragAndResize4 = __esm({
   }
 });
 
-// css-modules:css-modules://U8V5nDBlqycdkp1CuS13BrEMfGN5Xkd0n60BqPKYbkc.css
-var init_U8V5nDBlqycdkp1CuS13BrEMfGN5Xkd0n60BqPKYbkc = __esm({
-  "css-modules:css-modules://U8V5nDBlqycdkp1CuS13BrEMfGN5Xkd0n60BqPKYbkc.css"() {
+// css-modules:css-modules://Zb1cEYNT4eNwW8io0xWL7zXkOH8P26-7eImYlmla2wA.css
+var init_Zb1cEYNT4eNwW8io0xWL7zXkOH8P26_7eImYlmla2wA = __esm({
+  "css-modules:css-modules://Zb1cEYNT4eNwW8io0xWL7zXkOH8P26-7eImYlmla2wA.css"() {
   }
 });
 
@@ -2599,8 +3134,8 @@ var src_components_core_editor_MetadataEditor_default;
 var init_src_components_core_editor_MetadataEditor = __esm({
   "tmp_esbuild/_src_components_core_editor_MetadataEditor.module.css"() {
     "use strict";
-    init_U8V5nDBlqycdkp1CuS13BrEMfGN5Xkd0n60BqPKYbkc();
-    src_components_core_editor_MetadataEditor_default = { "fieldWrapper": "vv-ftXTRa-fieldWrapper", "select": "vv-ftXTRa-select", "header": "vv-ftXTRa-header", "uuid": "vv-ftXTRa-uuid", "field": "vv-ftXTRa-field", "body": "vv-ftXTRa-body", "rnd": "vv-ftXTRa-rnd" };
+    init_Zb1cEYNT4eNwW8io0xWL7zXkOH8P26_7eImYlmla2wA();
+    src_components_core_editor_MetadataEditor_default = { "field": "vv-ftXTRa-field", "select": "vv-ftXTRa-select", "rnd": "vv-ftXTRa-rnd", "body": "vv-ftXTRa-body", "uuid": "vv-ftXTRa-uuid", "header": "vv-ftXTRa-header", "fieldWrapper": "vv-ftXTRa-fieldWrapper" };
   }
 });
 
@@ -2613,10 +3148,10 @@ var init_MetadataEditor = __esm({
 });
 
 // src/components/core/editor/MetadataEditor.tsx
-import _18 from "lodash/fp.js";
-import Select from "react-select";
+import _19 from "lodash/fp.js";
 import { Button as Button5 } from "@lls/lls-kit";
-import { jsx as jsx23, jsxs as jsxs15 } from "react/jsx-runtime";
+import Select from "react-select";
+import { jsx as jsx26, jsxs as jsxs17 } from "react/jsx-runtime";
 var MetadataEditor, MetadataEditor_default;
 var init_MetadataEditor2 = __esm({
   "src/components/core/editor/MetadataEditor.tsx"() {
@@ -2624,79 +3159,79 @@ var init_MetadataEditor2 = __esm({
     init_useDragAndResize4();
     init_MetadataEditor();
     MetadataEditor = ({ doc, onDocChange, onClose, positions, notions }) => {
-      const metadata = _18.get("metadata", doc);
-      const setValue = (subName, e) => onDocChange(_18.set(["metadata", subName], _18.get("target.value", e), doc));
-      const setMultipleValue = (subName, values) => onDocChange(_18.set(["metadata", subName], _18.map("value", values), doc));
+      const metadata = _19.get("metadata", doc);
+      const setValue = (subName, e) => onDocChange(_19.set(["metadata", subName], _19.get("target.value", e), doc));
+      const setMultipleValue = (subName, values) => onDocChange(_19.set(["metadata", subName], _19.map("value", values), doc));
       const { handlersElement, launchTranslate, rndRef } = useDragAndResize_default2({
         defaultPositions: positions
       });
-      return /* @__PURE__ */ jsxs15("div", { className: src_components_core_editor_MetadataEditor_default.rnd, ref: rndRef, children: [
-        /* @__PURE__ */ jsx23("div", { className: src_components_core_editor_MetadataEditor_default.header, onMouseDown: launchTranslate, children: /* @__PURE__ */ jsx23(Button5, { onClick: onClose, theme: "gray", children: "cancel" }) }),
-        /* @__PURE__ */ jsxs15("div", { className: src_components_core_editor_MetadataEditor_default.body, children: [
-          /* @__PURE__ */ jsxs15("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
+      return /* @__PURE__ */ jsxs17("div", { className: src_components_core_editor_MetadataEditor_default.rnd, ref: rndRef, children: [
+        /* @__PURE__ */ jsx26("div", { className: src_components_core_editor_MetadataEditor_default.header, onMouseDown: launchTranslate, children: /* @__PURE__ */ jsx26(Button5, { onClick: onClose, theme: "gray", children: "cancel" }) }),
+        /* @__PURE__ */ jsxs17("div", { className: src_components_core_editor_MetadataEditor_default.body, children: [
+          /* @__PURE__ */ jsxs17("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
             "Uuid:",
             " ",
-            /* @__PURE__ */ jsx23("span", { className: src_components_core_editor_MetadataEditor_default.uuid, style: { "--data-font": "monospace" }, children: doc.uuid })
+            /* @__PURE__ */ jsx26("span", { className: src_components_core_editor_MetadataEditor_default.uuid, style: { "--data-font": "monospace" }, children: doc.uuid })
           ] }),
-          /* @__PURE__ */ jsxs15("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
+          /* @__PURE__ */ jsxs17("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
             "Title",
-            /* @__PURE__ */ jsx23(
+            /* @__PURE__ */ jsx26(
               "input",
               {
                 className: src_components_core_editor_MetadataEditor_default.field,
-                value: _18.getOr("", "title", metadata),
+                value: _19.getOr("", "title", metadata),
                 onChange: (e) => setValue("title", e),
                 onBlur: (e) => setValue("title", e)
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs15("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
+          /* @__PURE__ */ jsxs17("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
             "Description",
-            /* @__PURE__ */ jsx23(
+            /* @__PURE__ */ jsx26(
               "input",
               {
                 className: src_components_core_editor_MetadataEditor_default.field,
-                value: _18.getOr("", "description", metadata),
+                value: _19.getOr("", "description", metadata),
                 onChange: (e) => setValue("description", e),
                 onBlur: (e) => setValue("description", e)
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs15("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
+          /* @__PURE__ */ jsxs17("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
             "Image",
-            /* @__PURE__ */ jsx23(
+            /* @__PURE__ */ jsx26(
               "input",
               {
                 className: src_components_core_editor_MetadataEditor_default.field,
-                value: _18.getOr("", "image", metadata),
+                value: _19.getOr("", "image", metadata),
                 onChange: (e) => setValue("image", e),
                 onBlur: (e) => setValue("image", e)
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs15("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
+          /* @__PURE__ */ jsxs17("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
             "Keywords",
-            /* @__PURE__ */ jsx23(
+            /* @__PURE__ */ jsx26(
               "input",
               {
                 className: src_components_core_editor_MetadataEditor_default.field,
-                value: _18.getOr("", "keywords", metadata),
+                value: _19.getOr("", "keywords", metadata),
                 onChange: (e) => setValue("keywords", e),
                 onBlur: (e) => setValue("keywords", e)
               }
             )
           ] }),
-          !_18.isEmpty(notions) && /* @__PURE__ */ jsxs15("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
+          !_19.isEmpty(notions) && /* @__PURE__ */ jsxs17("div", { className: src_components_core_editor_MetadataEditor_default.fieldWrapper, children: [
             "Notion",
-            /* @__PURE__ */ jsx23(
+            /* @__PURE__ */ jsx26(
               Select,
               {
                 className: src_components_core_editor_MetadataEditor_default.select,
-                value: _18.flow(
-                  _18.get("notions"),
-                  _18.map((notion) => ({ label: notion, value: notion }))
+                value: _19.flow(
+                  _19.get("notions"),
+                  _19.map((notion) => ({ label: notion, value: notion }))
                 )(metadata),
-                options: _18.map((notion) => ({ label: notion, value: notion }), notions),
+                options: _19.map((notion) => ({ label: notion, value: notion }), notions),
                 isMulti: true,
                 onChange: (values) => setMultipleValue("notions", values)
               }
@@ -2711,8 +3246,8 @@ var init_MetadataEditor2 = __esm({
 });
 
 // src/hooks/useEditor.tsx
-import _19 from "lodash/fp.js";
-import { useCallback as useCallback7, useEffect as useEffect6, useState as useState9 } from "react";
+import _20 from "lodash/fp.js";
+import { useCallback as useCallback8, useEffect as useEffect8, useState as useState10 } from "react";
 var EDITOR_MARGIN, useEditor, useEditor_default;
 var init_useEditor = __esm({
   "src/hooks/useEditor.tsx"() {
@@ -2721,13 +3256,13 @@ var init_useEditor = __esm({
     useEditor = ({
       id
     }) => {
-      const [path, setPath] = useState9(void 0);
-      const [positions, setPositions] = useState9({ x: 0, y: 0 });
-      useEffect6(() => {
-        _19.noop(id);
+      const [path, setPath] = useState10(void 0);
+      const [positions, setPositions] = useState10({ x: 0, y: 0 });
+      useEffect8(() => {
+        _20.noop(id);
         setPath(void 0);
       }, [id]);
-      const open = useCallback7((editPath, e) => {
+      const open = useCallback8((editPath, e) => {
         const elementPositions = (e?.target instanceof Element ? e.target.getBoundingClientRect() : void 0) ?? { left: 0, top: 0 };
         setPath(editPath);
         setPositions({
@@ -2735,13 +3270,22 @@ var init_useEditor = __esm({
           y: elementPositions.top + EDITOR_MARGIN
         });
       }, []);
-      const close = useCallback7(() => setPath(void 0), []);
+      const close = useCallback8(() => setPath(void 0), []);
       return { positions, path, open, close };
     };
     useEditor_default = useEditor;
   }
 });
 
+// src/constants/config.ts
+var IS_PROD;
+var init_config = __esm({
+  "src/constants/config.ts"() {
+    "use strict";
+    IS_PROD = process.env.CONF_ENV === "prod";
+  }
+});
+
 // src/hooks/useScroll.tsx
 import { useMemo as useMemo3 } from "react";
 var useScroll, useScroll_default;
@@ -2765,18 +3309,9 @@ var init_useScroll = __esm({
   }
 });
 
-// src/constants/config.ts
-var IS_PROD;
-var init_config = __esm({
-  "src/constants/config.ts"() {
-    "use strict";
-    IS_PROD = process.env.CONF_ENV === "prod";
-  }
-});
-
-// css-modules:css-modules://5vBHtYTubWLIkQ7cwq88_cqGbPrRZDxVu51b9VQwno0.css
-var init_vBHtYTubWLIkQ7cwq88_cqGbPrRZDxVu51b9VQwno0 = __esm({
-  "css-modules:css-modules://5vBHtYTubWLIkQ7cwq88_cqGbPrRZDxVu51b9VQwno0.css"() {
+// css-modules:css-modules://N7qE5xz-356BL8FwluXb9SO0Q6g8pmP18e18R9y8bEU.css
+var init_N7qE5xz_356BL8FwluXb9SO0Q6g8pmP18e18R9y8bEU = __esm({
+  "css-modules:css-modules://N7qE5xz-356BL8FwluXb9SO0Q6g8pmP18e18R9y8bEU.css"() {
   }
 });
 
@@ -2785,8 +3320,8 @@ var src_components_lazy_index_editor_default;
 var init_src_components_lazy_index_editor = __esm({
   "tmp_esbuild/_src_components_lazy_index.editor.module.css"() {
     "use strict";
-    init_vBHtYTubWLIkQ7cwq88_cqGbPrRZDxVu51b9VQwno0();
-    src_components_lazy_index_editor_default = { "exitButton": "vv-RUXZgW-exitButton", "alert": "vv-RUXZgW-alert", "submit": "vv-RUXZgW-submit", "alertOpenedAnimation": "vv-RUXZgW-alertOpenedAnimation", "button": "vv-RUXZgW-button", "stickyBar": "vv-RUXZgW-stickyBar", "pageContainer": "vv-RUXZgW-pageContainer", "screen": "vv-RUXZgW-screen" };
+    init_N7qE5xz_356BL8FwluXb9SO0Q6g8pmP18e18R9y8bEU();
+    src_components_lazy_index_editor_default = { "submit": "vv-RUXZgW-submit", "pageContainer": "vv-RUXZgW-pageContainer", "screen": "vv-RUXZgW-screen", "alert": "vv-RUXZgW-alert", "alertOpenedAnimation": "vv-RUXZgW-alertOpenedAnimation", "exitButton": "vv-RUXZgW-exitButton", "stickyBar": "vv-RUXZgW-stickyBar", "button": "vv-RUXZgW-button" };
   }
 });
 
@@ -2803,11 +3338,11 @@ var index_editor_exports = {};
 __export(index_editor_exports, {
   default: () => index_editor_default
 });
-import React8, { useCallback as useCallback8, useEffect as useEffect7, useState as useState10 } from "react";
-import _20 from "lodash/fp.js";
+import React7, { useCallback as useCallback9, useEffect as useEffect9, useState as useState11 } from "react";
+import _21 from "lodash/fp.js";
 import { Button as Button6, RadioButton, Snackbar } from "@lls/lls-kit";
 import { copyToClipboard } from "@lls/utils";
-import { Fragment as Fragment3, jsx as jsx24, jsxs as jsxs16 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx27, jsxs as jsxs18 } from "react/jsx-runtime";
 var Editor2, CompactModeButton, CopyButton, EditorStickyBar, EditorNext, index_editor_default;
 var init_index_editor2 = __esm({
   "src/components/lazy/index.editor.tsx"() {
@@ -2821,48 +3356,48 @@ var init_index_editor2 = __esm({
     init_MetadataEditor2();
     init_ViewerMd2();
     init_useEditor();
-    init_useScroll();
     init_config();
+    init_useScroll();
     init_mode();
     init_index_editor();
     Editor2 = isSsr() ? EditorSsr_default : Editor_default;
     CompactModeButton = ({ isCompactMode = false, theme, setIsCompactMode }) => {
-      const onClick = useCallback8(() => {
+      const onClick = useCallback9(() => {
         setIsCompactMode(!isCompactMode);
       }, [setIsCompactMode, isCompactMode]);
-      return /* @__PURE__ */ jsx24(Button6, { theme, accent: "alt", "data-isactive": +isCompactMode, onClick, children: "cm" });
+      return /* @__PURE__ */ jsx27(Button6, { theme, accent: "alt", "data-isactive": +isCompactMode, onClick, children: "cm" });
     };
-    CopyButton = ({ template, theme, setCopied = _20.noop }) => {
-      const onClick = useCallback8(() => {
+    CopyButton = ({ template, theme, setCopied = _21.noop }) => {
+      const onClick = useCallback9(() => {
         copyToClipboard(JSON.stringify(template, null, 2));
         setCopied(true);
         setTimeout(() => {
           setCopied(false);
         }, 3500);
       }, [template, setCopied]);
-      return /* @__PURE__ */ jsx24(Button6, { className: src_components_lazy_index_editor_default.button, theme, accent: "alt", type: "button", onClick, children: "Copier le JSON" });
+      return /* @__PURE__ */ jsx27(Button6, { className: src_components_lazy_index_editor_default.button, theme, accent: "alt", type: "button", onClick, children: "Copier le JSON" });
     };
     EditorStickyBar = ({ mode, setMode, handleSubmit, template, isCompactMode, setIsCompactMode, setCopied }) => {
       const stickyBarTheme = IS_PROD ? "premium" : "primary";
-      return /* @__PURE__ */ jsxs16("div", { className: src_components_lazy_index_editor_default.stickyBar, children: [
-        /* @__PURE__ */ jsx24(RadioButton, { isChecked: mode === "edit", onChange: setMode, label: "Edit", name: "Mode", value: "edit" }),
-        /* @__PURE__ */ jsx24(RadioButton, { isChecked: mode === "view", onChange: setMode, label: "View", name: "Mode", value: "view" }),
-        /* @__PURE__ */ jsx24(Button6, { theme: stickyBarTheme, onClick: handleSubmit, children: "Submit" }),
-        /* @__PURE__ */ jsx24(CompactModeButton, { theme: stickyBarTheme, isCompactMode, setIsCompactMode }),
-        /* @__PURE__ */ jsx24(CopyButton, { theme: stickyBarTheme, template, setCopied })
+      return /* @__PURE__ */ jsxs18("div", { className: src_components_lazy_index_editor_default.stickyBar, children: [
+        /* @__PURE__ */ jsx27(RadioButton, { isChecked: mode === "edit", onChange: setMode, label: "Edit", name: "Mode", value: "edit" }),
+        /* @__PURE__ */ jsx27(RadioButton, { isChecked: mode === "view", onChange: setMode, label: "View", name: "Mode", value: "view" }),
+        /* @__PURE__ */ jsx27(Button6, { theme: stickyBarTheme, onClick: handleSubmit, children: "Submit" }),
+        /* @__PURE__ */ jsx27(CompactModeButton, { theme: stickyBarTheme, isCompactMode, setIsCompactMode }),
+        /* @__PURE__ */ jsx27(CopyButton, { theme: stickyBarTheme, template, setCopied })
       ] });
     };
-    EditorNext = React8.forwardRef(({ template, onChange = _20.noop, onSubmit = _20.noop, notions, ...props }, ref) => {
-      const [isCompactMode, setIsCompactMode] = useState10(false);
-      const [mode, setMode] = useState10("edit");
-      const [copied, setCopied] = useState10(false);
+    EditorNext = React7.forwardRef(({ template, onChange = _21.noop, onSubmit = _21.noop, notions, ...props }, ref) => {
+      const [isCompactMode, setIsCompactMode] = useState11(false);
+      const [mode, setMode] = useState11("edit");
+      const [copied, setCopied] = useState11(false);
       const id = template?.id;
       const editEditor = useEditor_default({ id });
       const metadataEditor = useEditor_default({ id });
-      const [docLintErrors, setDocLintErrors] = useState10({});
-      const firstFoundErrorUuid = _20.findKey.convert({ cap: false })(Boolean, docLintErrors);
-      const [showWarningSnackbar, setShowWarningSnackbar] = useState10(false);
-      useEffect7(() => {
+      const [docLintErrors, setDocLintErrors] = useState11({});
+      const firstFoundErrorUuid = _21.findKey.convert({ cap: false })(Boolean, docLintErrors);
+      const [showWarningSnackbar, setShowWarningSnackbar] = useState11(false);
+      useEffect9(() => {
         if (showWarningSnackbar) {
           const timeoutId = setTimeout(setShowWarningSnackbar, 1e4, false);
           return () => {
@@ -2870,18 +3405,18 @@ var init_index_editor2 = __esm({
           };
         }
       }, [showWarningSnackbar]);
-      useEffect7(() => {
+      useEffect9(() => {
         setDocLintErrors(
-          _20.flow(
-            _20.get("children"),
+          _21.flow(
+            _21.get("children"),
             (children) => [...children, { uuid: "root", contentMd: template?.contentMd }],
-            _20.map((child) => [child.uuid, parseErrorsInContentMd(child.contentMd)]),
-            _20.fromPairs
+            _21.map((child) => [child.uuid, parseErrorsInContentMd(child.contentMd)]),
+            _21.fromPairs
           )(template)
         );
       }, [template]);
       const { scrollTo } = useScroll_default({ scrollOffset: -150 });
-      const handleSubmit = useCallback8(() => {
+      const handleSubmit = useCallback9(() => {
         if (!isEditMode(mode)) {
           return;
         }
@@ -2899,7 +3434,7 @@ ${JSON.stringify(
           return;
         }
         const invalidIdCard = getMissingId(template);
-        if (!_20.isEmpty(invalidIdCard)) {
+        if (!_21.isEmpty(invalidIdCard)) {
           alert(
             `L'une des cartes du template n'a pas un id valide. Par mesure de securit\xE9 la sauvegarde \xE0 \xE9t\xE9 bloqu\xE9e. 
 
@@ -2914,9 +3449,9 @@ ${JSON.stringify(
         setShowWarningSnackbar(true);
         onSubmit(template);
       }, [mode, template, onSubmit]);
-      const onKeyDown = useCallback8(
+      const onKeyDown = useCallback9(
         (e) => {
-          const sKey = _20.flow(_20.invoke("key.toLowerCase"), _20.isEqual("s"))(e);
+          const sKey = _21.flow(_21.invoke("key.toLowerCase"), _21.isEqual("s"))(e);
           if (sKey && isMetaControlKeyPressed(e)) {
             e.preventDefault();
             return handleSubmit();
@@ -2924,15 +3459,15 @@ ${JSON.stringify(
         },
         [handleSubmit]
       );
-      useEffect7(() => {
+      useEffect9(() => {
         window.addEventListener("keydown", onKeyDown);
         return () => {
           window.removeEventListener("keydown", onKeyDown);
         };
       }, [onKeyDown]);
-      const onError = useCallback8(
+      const onError = useCallback9(
         (error) => {
-          setDocLintErrors(_20.set(editEditor.path, error));
+          setDocLintErrors(_21.set(editEditor.path, error));
         },
         [editEditor.path]
       );
@@ -2942,15 +3477,15 @@ ${JSON.stringify(
         scrollTo(firstFoundErrorUuid);
         editEditor.open(firstFoundErrorUuid);
       };
-      const onDocChange = useCallback8(
+      const onDocChange = useCallback9(
         (doc) => {
-          const uuid = _20.get("uuid", doc);
+          const uuid = _21.get("uuid", doc);
           if (!uuid) {
             onChange(doc);
           } else {
             onChange(({ children, ...template2 } = {}) => ({
               ...template2,
-              children: React8.Children.map(children, (child) => typeof child === "object" && child !== null && _20.matches({ uuid }, child) ? doc : child)
+              children: React7.Children.map(children, (child) => typeof child === "object" && child !== null && _21.matches({ uuid }, child) ? doc : child)
             }));
           }
         },
@@ -2966,11 +3501,11 @@ ${JSON.stringify(
         setIsCompactMode,
         setCopied
       };
-      return /* @__PURE__ */ jsxs16(Fragment3, { children: [
-        /* @__PURE__ */ jsx24(EditorStickyBar, { ...toolbarProps }),
-        /* @__PURE__ */ jsx24("div", { className: src_components_lazy_index_editor_default.pageContainer, children: /* @__PURE__ */ jsxs16("div", { className: src_components_lazy_index_editor_default.screen, children: [
-          copied && /* @__PURE__ */ jsx24("div", { className: src_components_lazy_index_editor_default.alert, children: "JSON copi\xE9 dans le presse-papier" }),
-          isEditMode(mode) ? /* @__PURE__ */ jsx24(
+      return /* @__PURE__ */ jsxs18(Fragment3, { children: [
+        /* @__PURE__ */ jsx27(EditorStickyBar, { ...toolbarProps }),
+        /* @__PURE__ */ jsx27("div", { className: src_components_lazy_index_editor_default.pageContainer, children: /* @__PURE__ */ jsxs18("div", { className: src_components_lazy_index_editor_default.screen, children: [
+          copied && /* @__PURE__ */ jsx27("div", { className: src_components_lazy_index_editor_default.alert, children: "JSON copi\xE9 dans le presse-papier" }),
+          isEditMode(mode) ? /* @__PURE__ */ jsx27(
             EditViewerMd_default,
             {
               ...props,
@@ -2982,8 +3517,8 @@ ${JSON.stringify(
               compactMode: isCompactMode,
               template
             }
-          ) : /* @__PURE__ */ jsx24(ViewerMd_default, { ...props, ref, mode, template, onChange }),
-          metadataEditor.path && /* @__PURE__ */ jsx24(
+          ) : /* @__PURE__ */ jsx27(ViewerMd_default, { ...props, ref, mode, template, onChange }),
+          metadataEditor.path && /* @__PURE__ */ jsx27(
             MetadataEditor_default,
             {
               doc: getDocumentByUuid(metadataEditor.path, template),
@@ -2994,7 +3529,7 @@ ${JSON.stringify(
             },
             `metadata_${metadataEditor.path}`
           ),
-          editEditor.path && /* @__PURE__ */ jsx24(
+          editEditor.path && /* @__PURE__ */ jsx27(
             Editor2,
             {
               error: docLintErrors[editEditor.path],
@@ -3007,7 +3542,7 @@ ${JSON.stringify(
             `edit_${editEditor.path}`
           )
         ] }) }),
-        showWarningSnackbar && !!firstFoundErrorUuid && /* @__PURE__ */ jsx24(
+        showWarningSnackbar && !!firstFoundErrorUuid && /* @__PURE__ */ jsx27(
           Snackbar,
           {
             open: true,
@@ -3028,19 +3563,19 @@ ${JSON.stringify(
 });
 
 // src/index.editor.tsx
-import React9, { Suspense as Suspense2 } from "react";
-import { jsx as jsx25 } from "react/jsx-runtime";
-var LazyEditor2 = React9.lazy(() => Promise.resolve().then(() => (init_index_editor2(), index_editor_exports)));
+import React8, { Suspense as Suspense2 } from "react";
+import { jsx as jsx28 } from "react/jsx-runtime";
+var LazyEditor2 = React8.lazy(() => Promise.resolve().then(() => (init_index_editor2(), index_editor_exports)));
 var ViewerEditor = (props) => {
-  return /* @__PURE__ */ jsx25(Suspense2, { children: /* @__PURE__ */ jsx25(LazyEditor2, { ...props }) });
+  return /* @__PURE__ */ jsx28(Suspense2, { children: /* @__PURE__ */ jsx28(LazyEditor2, { ...props }) });
 };
 var index_editor_default2 = ViewerEditor;
 
 // src/index.viewer.tsx
 init_ViewerMd2();
-import { jsx as jsx26 } from "react/jsx-runtime";
+import { jsx as jsx29 } from "react/jsx-runtime";
 var Viewer = (props) => {
-  return /* @__PURE__ */ jsx26(ViewerMd_default, { ...props });
+  return /* @__PURE__ */ jsx29(ViewerMd_default, { ...props });
 };
 var index_viewer_default = Viewer;
 export {