@kontakto/email-template-editor 2.3.1 → 2.5.0

package/dist/index.cjs

@@ -2,12 +2,14 @@
 
 var DOMPurify = require('dompurify');
 var marked = require('marked');
-var React62 = require('react');
+var React57 = require('react');
 var zod = require('zod');
 var server = require('react-dom/server');
 var Handlebars = require('handlebars');
 var styles = require('@mui/material/styles');
+var react = require('@lingui/react');
 var material = require('@mui/material');
+var core = require('@lingui/core');
 var zustand = require('zustand');
 var iconsMaterial = require('@mui/icons-material');
 var reactColorful = require('react-colorful');
@@ -19,7 +21,7 @@ var htmlfy = require('htmlfy');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var DOMPurify__default = /*#__PURE__*/_interopDefault(DOMPurify);
-var React62__default = /*#__PURE__*/_interopDefault(React62);
+var React57__default = /*#__PURE__*/_interopDefault(React57);
 var Handlebars__default = /*#__PURE__*/_interopDefault(Handlebars);
 var hljs__default = /*#__PURE__*/_interopDefault(hljs);
 var jsonHighlighter__default = /*#__PURE__*/_interopDefault(jsonHighlighter);
@@ -191,8 +193,8 @@ function renderInlineMarkdownString(str) {
 }
 function EmailMarkdown(_a) {
   var _b = _a, { markdown } = _b, props = __objRest(_b, ["markdown"]);
-  const data = React62.useMemo(() => renderMarkdownString(markdown), [markdown]);
-  return /* @__PURE__ */ React62__default.default.createElement("div", __spreadProps(__spreadValues({}, props), { dangerouslySetInnerHTML: { __html: data } }));
+  const data = React57.useMemo(() => renderMarkdownString(markdown), [markdown]);
+  return /* @__PURE__ */ React57__default.default.createElement("div", __spreadProps(__spreadValues({}, props), { dangerouslySetInnerHTML: { __html: data } }));
 }
 var FONT_FAMILY_SCHEMA = zod.z.enum([
   "MODERN_SANS",
@@ -272,9 +274,9 @@ function Text({ style, props }) {
   };
   const text = (_g = props == null ? void 0 : props.text) != null ? _g : TextPropsDefaults.text;
   if (props == null ? void 0 : props.markdown) {
-    return /* @__PURE__ */ React62__default.default.createElement(EmailMarkdown, { style: wStyle, markdown: text });
+    return /* @__PURE__ */ React57__default.default.createElement(EmailMarkdown, { style: wStyle, markdown: text });
   }
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: wStyle }, text);
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: wStyle }, text);
 }
 var PADDING_SCHEMA2 = zod.z.object({
   top: zod.z.number(),
@@ -323,7 +325,7 @@ function Avatar({ style, props }) {
     textAlign: (_e = style == null ? void 0 : style.textAlign) != null ? _e : void 0,
     padding: getPadding2(style == null ? void 0 : style.padding)
   };
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: sectionStyle }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: sectionStyle }, /* @__PURE__ */ React57__default.default.createElement(
     "img",
     {
       alt,
@@ -475,14 +477,14 @@ function Button({ style, props }) {
     padding: `${padding[0]}px ${padding[1]}px`,
     textDecoration: "none"
   };
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: wrapperStyle }, /* @__PURE__ */ React62__default.default.createElement("a", { href: url, style: linkStyle, target: "_blank" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: wrapperStyle }, /* @__PURE__ */ React57__default.default.createElement("a", { href: url, style: linkStyle, target: "_blank" }, /* @__PURE__ */ React57__default.default.createElement(
     "span",
     {
       dangerouslySetInnerHTML: {
         __html: `<!--[if mso]><i style="letter-spacing: ${padding[1]}px;mso-font-width:-100%;mso-text-raise:${textRaise}" hidden>&nbsp;</i><![endif]-->`
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement("span", null, text), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement("span", null, text), /* @__PURE__ */ React57__default.default.createElement(
     "span",
     {
       dangerouslySetInnerHTML: {
@@ -531,7 +533,7 @@ function ColumnsContainer({ style, columns, props }) {
     contentAlignment: (_d = props == null ? void 0 : props.contentAlignment) != null ? _d : ColumnsContainerPropsDefaults.contentAlignment,
     fixedWidths: props == null ? void 0 : props.fixedWidths
   };
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: wStyle }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: wStyle }, /* @__PURE__ */ React57__default.default.createElement(
     "table",
     {
       align: "center",
@@ -540,7 +542,7 @@ function ColumnsContainer({ style, columns, props }) {
       border: 0,
       style: { tableLayout: "fixed", borderCollapse: "collapse" }
     },
-    /* @__PURE__ */ React62__default.default.createElement("tbody", { style: { width: "100%" } }, /* @__PURE__ */ React62__default.default.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ React62__default.default.createElement(TableCell, { index: 0, props: blockProps, columns }), /* @__PURE__ */ React62__default.default.createElement(TableCell, { index: 1, props: blockProps, columns }), /* @__PURE__ */ React62__default.default.createElement(TableCell, { index: 2, props: blockProps, columns })))
+    /* @__PURE__ */ React57__default.default.createElement("tbody", { style: { width: "100%" } }, /* @__PURE__ */ React57__default.default.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ React57__default.default.createElement(TableCell, { index: 0, props: blockProps, columns }), /* @__PURE__ */ React57__default.default.createElement(TableCell, { index: 1, props: blockProps, columns }), /* @__PURE__ */ React57__default.default.createElement(TableCell, { index: 2, props: blockProps, columns })))
   ));
 }
 function TableCell({ index, props, columns }) {
@@ -558,7 +560,7 @@ function TableCell({ index, props, columns }) {
     width: (_d = (_c = props.fixedWidths) == null ? void 0 : _c[index]) != null ? _d : void 0
   };
   const children = (_e = columns && columns[index]) != null ? _e : null;
-  return /* @__PURE__ */ React62__default.default.createElement("td", { style }, children);
+  return /* @__PURE__ */ React57__default.default.createElement("td", { style }, children);
 }
 function getPaddingBefore(index, { columnsGap, columnsCount }) {
   if (index === 0) {
@@ -620,9 +622,9 @@ function Container({ style, children }) {
     padding: getPadding5(style == null ? void 0 : style.padding)
   };
   if (!children) {
-    return /* @__PURE__ */ React62__default.default.createElement("div", { style: wStyle });
+    return /* @__PURE__ */ React57__default.default.createElement("div", { style: wStyle });
   }
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: wStyle }, children);
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: wStyle }, children);
 }
 var container_default = Container;
 var COLOR_SCHEMA5 = zod.z.string().regex(/^#[0-9a-fA-F]{6}$/).nullable().optional();
@@ -656,7 +658,7 @@ function Divider({ style, props }) {
   };
   const borderTopWidth = (_b = props == null ? void 0 : props.lineHeight) != null ? _b : DividerPropsDefaults.lineHeight;
   const borderTopColor = (_c = props == null ? void 0 : props.lineColor) != null ? _c : DividerPropsDefaults.lineColor;
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: st }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: st }, /* @__PURE__ */ React57__default.default.createElement(
     "hr",
     {
       style: {
@@ -750,15 +752,15 @@ function Heading({ props, style }) {
     fontSize: getFontSize(level),
     padding: getPadding7(style == null ? void 0 : style.padding)
   };
-  const html2 = React62.useMemo(() => isMarkdown ? renderInlineMarkdownString(text) : null, [isMarkdown, text]);
+  const html2 = React57.useMemo(() => isMarkdown ? renderInlineMarkdownString(text) : null, [isMarkdown, text]);
   const renderProps = isMarkdown ? { style: hStyle, dangerouslySetInnerHTML: { __html: html2 != null ? html2 : "" } } : { style: hStyle, children: text };
   switch (level) {
     case "h1":
-      return /* @__PURE__ */ React62__default.default.createElement("h1", __spreadValues({}, renderProps));
+      return /* @__PURE__ */ React57__default.default.createElement("h1", __spreadValues({}, renderProps));
     case "h2":
-      return /* @__PURE__ */ React62__default.default.createElement("h2", __spreadValues({}, renderProps));
+      return /* @__PURE__ */ React57__default.default.createElement("h2", __spreadValues({}, renderProps));
     case "h3":
-      return /* @__PURE__ */ React62__default.default.createElement("h3", __spreadValues({}, renderProps));
+      return /* @__PURE__ */ React57__default.default.createElement("h3", __spreadValues({}, renderProps));
   }
 }
 function getFontSize(level) {
@@ -840,9 +842,9 @@ function Html({ style, props }) {
     padding: getPadding8(style == null ? void 0 : style.padding)
   };
   if (!children) {
-    return /* @__PURE__ */ React62__default.default.createElement("div", { style: cssStyle });
+    return /* @__PURE__ */ React57__default.default.createElement("div", { style: cssStyle });
   }
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: cssStyle, dangerouslySetInnerHTML: { __html: children } });
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: cssStyle, dangerouslySetInnerHTML: { __html: children } });
 }
 var html_default = Html;
 var PADDING_SCHEMA9 = zod.z.object({
@@ -878,7 +880,7 @@ function Image({ style, props }) {
   const linkHref = (_c = props == null ? void 0 : props.linkHref) != null ? _c : null;
   const width = (_d = props == null ? void 0 : props.width) != null ? _d : void 0;
   const height = (_e = props == null ? void 0 : props.height) != null ? _e : void 0;
-  const imageElement = /* @__PURE__ */ React62__default.default.createElement(
+  const imageElement = /* @__PURE__ */ React57__default.default.createElement(
     "img",
     {
       alt: (_f = props == null ? void 0 : props.alt) != null ? _f : "",
@@ -898,9 +900,9 @@ function Image({ style, props }) {
     }
   );
   if (!linkHref) {
-    return /* @__PURE__ */ React62__default.default.createElement("div", { style: sectionStyle }, imageElement);
+    return /* @__PURE__ */ React57__default.default.createElement("div", { style: sectionStyle }, imageElement);
   }
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: sectionStyle }, /* @__PURE__ */ React62__default.default.createElement("a", { href: linkHref, style: { textDecoration: "none" }, target: "_blank" }, imageElement));
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: sectionStyle }, /* @__PURE__ */ React57__default.default.createElement("a", { href: linkHref, style: { textDecoration: "none" }, target: "_blank" }, imageElement));
 }
 var image_default = Image;
 var FONT_FAMILY_SCHEMA5 = zod.z.enum([
@@ -1046,7 +1048,7 @@ function Signature({ style, props }) {
     color: linkColor,
     textDecoration: "none"
   };
-  const imageElement = imageUrl ? /* @__PURE__ */ React62__default.default.createElement(
+  const imageElement = imageUrl ? /* @__PURE__ */ React57__default.default.createElement(
     "img",
     {
       src: imageUrl,
@@ -1065,18 +1067,18 @@ function Signature({ style, props }) {
     }
   ) : null;
   const contactParts = [];
-  if (email) contactParts.push(/* @__PURE__ */ React62__default.default.createElement("a", { key: "email", href: `mailto:${email}`, style: linkStyle }, email));
-  if (phone) contactParts.push(/* @__PURE__ */ React62__default.default.createElement("a", { key: "phone", href: `tel:${phone}`, style: linkStyle }, phone));
+  if (email) contactParts.push(/* @__PURE__ */ React57__default.default.createElement("a", { key: "email", href: `mailto:${email}`, style: linkStyle }, email));
+  if (phone) contactParts.push(/* @__PURE__ */ React57__default.default.createElement("a", { key: "phone", href: `tel:${phone}`, style: linkStyle }, phone));
   if (website) {
     const href = website.startsWith("http") ? website : `https://${website}`;
-    contactParts.push(/* @__PURE__ */ React62__default.default.createElement("a", { key: "website", href, style: linkStyle, target: "_blank" }, website));
+    contactParts.push(/* @__PURE__ */ React57__default.default.createElement("a", { key: "website", href, style: linkStyle, target: "_blank" }, website));
   }
-  const textContent = /* @__PURE__ */ React62__default.default.createElement("div", null, name && /* @__PURE__ */ React62__default.default.createElement("p", { style: nameStyle }, name), title && /* @__PURE__ */ React62__default.default.createElement("p", { style: detailStyle }, title), company && /* @__PURE__ */ React62__default.default.createElement("p", { style: detailStyle }, company), address && /* @__PURE__ */ React62__default.default.createElement("p", { style: detailStyle }, address), contactParts.length > 0 && /* @__PURE__ */ React62__default.default.createElement("p", { style: __spreadProps(__spreadValues({}, detailStyle), { marginTop: 4 }) }, contactParts.map((part, i) => /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, { key: i }, i > 0 && /* @__PURE__ */ React62__default.default.createElement("span", { style: detailStyle }, " \xB7 "), part))));
-  const greetingElement = greeting ? /* @__PURE__ */ React62__default.default.createElement("p", { style: greetingStyle }, greeting) : null;
+  const textContent = /* @__PURE__ */ React57__default.default.createElement("div", null, name && /* @__PURE__ */ React57__default.default.createElement("p", { style: nameStyle }, name), title && /* @__PURE__ */ React57__default.default.createElement("p", { style: detailStyle }, title), company && /* @__PURE__ */ React57__default.default.createElement("p", { style: detailStyle }, company), address && /* @__PURE__ */ React57__default.default.createElement("p", { style: detailStyle }, address), contactParts.length > 0 && /* @__PURE__ */ React57__default.default.createElement("p", { style: __spreadProps(__spreadValues({}, detailStyle), { marginTop: 4 }) }, contactParts.map((part, i) => /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, { key: i }, i > 0 && /* @__PURE__ */ React57__default.default.createElement("span", { style: detailStyle }, " \xB7 "), part))));
+  const greetingElement = greeting ? /* @__PURE__ */ React57__default.default.createElement("p", { style: greetingStyle }, greeting) : null;
   if (layout === "vertical") {
-    return /* @__PURE__ */ React62__default.default.createElement("div", { style: wrapperStyle }, greetingElement, imageElement && /* @__PURE__ */ React62__default.default.createElement("div", { style: { marginBottom: 12 } }, imageElement), textContent);
+    return /* @__PURE__ */ React57__default.default.createElement("div", { style: wrapperStyle }, greetingElement, imageElement && /* @__PURE__ */ React57__default.default.createElement("div", { style: { marginBottom: 12 } }, imageElement), textContent);
   }
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: wrapperStyle }, greetingElement, /* @__PURE__ */ React62__default.default.createElement("table", { cellPadding: "0", cellSpacing: "0", border: 0, role: "presentation" }, /* @__PURE__ */ React62__default.default.createElement("tbody", null, /* @__PURE__ */ React62__default.default.createElement("tr", null, imageElement && /* @__PURE__ */ React62__default.default.createElement("td", { style: { verticalAlign: "middle", paddingRight: 16 } }, imageElement), /* @__PURE__ */ React62__default.default.createElement("td", { style: { verticalAlign: "middle" } }, textContent)))));
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: wrapperStyle }, greetingElement, /* @__PURE__ */ React57__default.default.createElement("table", { cellPadding: "0", cellSpacing: "0", border: 0, role: "presentation" }, /* @__PURE__ */ React57__default.default.createElement("tbody", null, /* @__PURE__ */ React57__default.default.createElement("tr", null, imageElement && /* @__PURE__ */ React57__default.default.createElement("td", { style: { verticalAlign: "middle", paddingRight: 16 } }, imageElement), /* @__PURE__ */ React57__default.default.createElement("td", { style: { verticalAlign: "middle" } }, textContent)))));
 }
 var signature_default = Signature;
 var SpacerPropsSchema = zod.z.object({
@@ -1093,13 +1095,13 @@ function Spacer({ props }) {
   const style = {
     height: (_a = props == null ? void 0 : props.height) != null ? _a : SpacerPropsDefaults.height
   };
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style });
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style });
 }
 var spacer_default = Spacer;
 function buildBlockComponent(blocks) {
   return function BlockComponent({ type, data }) {
     const Component = blocks[type].Component;
-    return /* @__PURE__ */ React62__default.default.createElement(Component, __spreadValues({}, data));
+    return /* @__PURE__ */ React57__default.default.createElement(Component, __spreadValues({}, data));
   };
 }
 function buildBlockConfigurationSchema(blocks) {
@@ -1168,9 +1170,9 @@ function ColumnsContainerReader({ style, props }) {
   const _a = props != null ? props : {}, { columns } = _a, restProps = __objRest(_a, ["columns"]);
   let cols = void 0;
   if (columns) {
-    cols = columns.map((col) => col.childrenIds.map((childId) => /* @__PURE__ */ React62__default.default.createElement(ReaderBlock, { key: childId, id: childId })));
+    cols = columns.map((col) => col.childrenIds.map((childId) => /* @__PURE__ */ React57__default.default.createElement(ReaderBlock, { key: childId, id: childId })));
   }
-  return /* @__PURE__ */ React62__default.default.createElement(columns_container_default, { props: restProps, columns: cols, style });
+  return /* @__PURE__ */ React57__default.default.createElement(columns_container_default, { props: restProps, columns: cols, style });
 }
 var ContainerPropsSchema2 = zod.z.object({
   style: ContainerPropsSchema.shape.style,
@@ -1181,7 +1183,7 @@ var ContainerPropsSchema2 = zod.z.object({
 function ContainerReader({ style, props }) {
   var _a;
   const childrenIds = (_a = props == null ? void 0 : props.childrenIds) != null ? _a : [];
-  return /* @__PURE__ */ React62__default.default.createElement(container_default, { style }, childrenIds.map((childId) => /* @__PURE__ */ React62__default.default.createElement(ReaderBlock, { key: childId, id: childId })));
+  return /* @__PURE__ */ React57__default.default.createElement(container_default, { style }, childrenIds.map((childId) => /* @__PURE__ */ React57__default.default.createElement(ReaderBlock, { key: childId, id: childId })));
 }
 var COLOR_SCHEMA9 = zod.z.string().regex(/^#[0-9a-fA-F]{6}$/).nullable().optional();
 var FONT_FAMILY_SCHEMA6 = zod.z.enum([
@@ -1254,9 +1256,9 @@ function EmailLayoutReader(props) {
     margin: "0"
   };
   if (props.backdropDisabled) {
-    return /* @__PURE__ */ React62__default.default.createElement("div", { style: baseStyle }, childrenIds.map((childId) => /* @__PURE__ */ React62__default.default.createElement(ReaderBlock, { key: childId, id: childId })));
+    return /* @__PURE__ */ React57__default.default.createElement("div", { style: baseStyle }, childrenIds.map((childId) => /* @__PURE__ */ React57__default.default.createElement(ReaderBlock, { key: childId, id: childId })));
   }
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     "div",
     {
       style: __spreadProps(__spreadValues({}, baseStyle), {
@@ -1266,7 +1268,7 @@ function EmailLayoutReader(props) {
         width: "100%"
       })
     },
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       "table",
       {
         align: "center",
@@ -1284,19 +1286,19 @@ function EmailLayoutReader(props) {
         cellPadding: "0",
         border: 0
       },
-      /* @__PURE__ */ React62__default.default.createElement("tbody", null, /* @__PURE__ */ React62__default.default.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ React62__default.default.createElement("td", null, childrenIds.map((childId) => /* @__PURE__ */ React62__default.default.createElement(ReaderBlock, { key: childId, id: childId })))))
+      /* @__PURE__ */ React57__default.default.createElement("tbody", null, /* @__PURE__ */ React57__default.default.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ React57__default.default.createElement("td", null, childrenIds.map((childId) => /* @__PURE__ */ React57__default.default.createElement(ReaderBlock, { key: childId, id: childId })))))
     )
   );
 }
 
 // src/email-builder/reader/core.tsx
-var ReaderContext = React62.createContext({});
+var ReaderContext = React57.createContext({});
 function useReaderDocument() {
-  return React62.useContext(ReaderContext);
+  return React57.useContext(ReaderContext);
 }
 function ReaderBlock({ id }) {
   const document2 = useReaderDocument();
-  return document2[id] ? /* @__PURE__ */ React62__default.default.createElement(BaseReaderBlock, __spreadValues({}, document2[id])) : null;
+  return document2[id] ? /* @__PURE__ */ React57__default.default.createElement(BaseReaderBlock, __spreadValues({}, document2[id])) : null;
 }
 var READER_DICTIONARY = buildBlockConfigurationDictionary({
   ColumnsContainer: {
@@ -1353,13 +1355,13 @@ var ReaderBlockSchema = buildBlockConfigurationSchema(READER_DICTIONARY);
 var ReaderDocumentSchema = zod.z.record(zod.z.string(), ReaderBlockSchema);
 var BaseReaderBlock = buildBlockComponent(READER_DICTIONARY);
 function Reader({ document: document2, rootBlockId }) {
-  return /* @__PURE__ */ React62__default.default.createElement(ReaderContext.Provider, { value: document2 }, /* @__PURE__ */ React62__default.default.createElement(ReaderBlock, { id: rootBlockId }));
+  return /* @__PURE__ */ React57__default.default.createElement(ReaderContext.Provider, { value: document2 }, /* @__PURE__ */ React57__default.default.createElement(ReaderBlock, { id: rootBlockId }));
 }
 
 // src/email-builder/renderers/render-to-static-markup.tsx
 function renderToStaticMarkup(document2, { rootBlockId, variables }) {
   const html2 = "<!DOCTYPE html>" + server.renderToStaticMarkup(
-    /* @__PURE__ */ React62__default.default.createElement("html", null, /* @__PURE__ */ React62__default.default.createElement("body", null, /* @__PURE__ */ React62__default.default.createElement(Reader, { document: document2, rootBlockId })))
+    /* @__PURE__ */ React57__default.default.createElement("html", null, /* @__PURE__ */ React57__default.default.createElement("body", null, /* @__PURE__ */ React57__default.default.createElement(Reader, { document: document2, rootBlockId })))
   );
   if (!variables) return html2;
   return evaluateHandlebars(html2, variables);
@@ -2011,6 +2013,37 @@ var THEME = styles.createTheme(BASE_THEME, {
   ]
 });
 var theme_default = THEME;
+
+// src/locales/en/messages.ts
+var messages = JSON.parse('{"drawer.library":["Library"],"drawer.new-sample":["New sample"],"drawer.new-template":["New template"],"drawer.no-samples":["No samples available"],"drawer.no-samples-match":["No samples match your filters"],"drawer.no-templates":["No saved templates yet"],"drawer.no-templates-match":["No templates match your filters"],"drawer.search-samples":["Search samples"],"drawer.search-templates":["Search templates"],"drawer.sort-by":["Sort by"],"drawer.tab.outline":["Outline"],"drawer.tab.samples":["Samples"],"drawer.tab.templates":["Templates"],"drawer.tag.all":["All"],"panel.avatar-block":["Avatar block"],"panel.button-block":["Button block"],"panel.columns-block":["Columns block"],"panel.container-block":["Container block"],"panel.divider-block":["Divider block"],"panel.editor-appearance":["Editor appearance"],"panel.export":["Export"],"panel.global":["Global"],"panel.heading-block":["Heading block"],"panel.html-block":["HTML block"],"panel.image-block":["Image block"],"panel.signature-block":["Signature block"],"panel.spacer-block":["Spacer block"],"panel.template":["Template"],"panel.text-block":["Text block"],"savebar.error-saving":["Error saving"],"savebar.new":["New"],"savebar.new-template-created":["New template created"],"savebar.sample-prefix":["Sample"],"savebar.sample-saved":["Sample saved"],"savebar.save":["Save"],"savebar.save-as":["Save as\u2026"],"savebar.save-as-new":["Save as new\u2026"],"savebar.save-as-new-template":["Save as a new template"],"savebar.save-changes":["Save changes"],"savebar.save-changes-to-sample":["Save changes to this sample"],"savebar.start-fresh":["Start a fresh template"],"savebar.template-saved":["Template saved"],"sort.last-updated":["Last updated"],"sort.name":["Name (A\u2013Z)"],"sort.recently-created":["Recently created"],"style.alignment":["Alignment"],"style.background-color":["Background color"],"style.border-color":["Border color"],"style.border-radius":["Border radius"],"style.font-family":["Font family"],"style.font-size":["Font size"],"style.font-weight":["Font weight"],"style.letter-spacing":["Letter spacing"],"style.line-height":["Line height"],"style.padding":["Padding"],"style.text-color":["Text color"],"toolbar.bold":["Bold"],"toolbar.bold-shortcut":["Bold (Cmd+B)"],"toolbar.italic":["Italic"],"toolbar.italic-shortcut":["Italic (Cmd+I)"],"toolbar.link":["Link"],"toolbar.link-shortcut":["Link (Cmd+K)"],"tune.copy":["Copy block"],"tune.delete":["Delete"],"tune.move-down":["Move down"],"tune.move-up":["Move up"]}');
+
+// src/locales/fi/messages.ts
+var messages2 = JSON.parse('{"drawer.library":["Kirjasto"],"drawer.new-sample":["Uusi malli"],"drawer.new-template":["Uusi pohja"],"drawer.no-samples":["Ei malleja saatavilla"],"drawer.no-samples-match":["Mik\xE4\xE4n malli ei vastaa hakua"],"drawer.no-templates":["Ei tallennettuja pohjia"],"drawer.no-templates-match":["Mik\xE4\xE4n pohja ei vastaa hakua"],"drawer.search-samples":["Etsi malleja"],"drawer.search-templates":["Etsi pohjia"],"drawer.sort-by":["J\xE4rjestys"],"drawer.tab.outline":["Rakenne"],"drawer.tab.samples":["Mallit"],"drawer.tab.templates":["Pohjat"],"drawer.tag.all":["Kaikki"],"panel.avatar-block":["Avatarlohko"],"panel.button-block":["Painikelohko"],"panel.columns-block":["Sarakkeet"],"panel.container-block":["S\xE4ili\xF6lohko"],"panel.divider-block":["Erotin"],"panel.editor-appearance":["Editorin ulkoasu"],"panel.export":["Vienti"],"panel.global":["Yleiset"],"panel.heading-block":["Otsikkolohko"],"panel.html-block":["HTML-lohko"],"panel.image-block":["Kuvalohko"],"panel.signature-block":["Allekirjoituslohko"],"panel.spacer-block":["V\xE4lilohko"],"panel.template":["Pohja"],"panel.text-block":["Tekstilohko"],"savebar.error-saving":["Tallennus ep\xE4onnistui"],"savebar.new":["Uusi"],"savebar.new-template-created":["Uusi pohja luotu"],"savebar.sample-prefix":["Malli"],"savebar.sample-saved":["Malli tallennettu"],"savebar.save":["Tallenna"],"savebar.save-as":["Tallenna nimell\xE4\u2026"],"savebar.save-as-new":["Tallenna uutena\u2026"],"savebar.save-as-new-template":["Tallenna uutena pohjana"],"savebar.save-changes":["Tallenna muutokset"],"savebar.save-changes-to-sample":["Tallenna muutokset t\xE4h\xE4n malliin"],"savebar.start-fresh":["Aloita tyhj\xE4st\xE4 pohjasta"],"savebar.template-saved":["Pohja tallennettu"],"sort.last-updated":["Viimeksi p\xE4ivitetty"],"sort.name":["Nimi (A\u2013\xD6)"],"sort.recently-created":["\xC4skett\xE4in luotu"],"style.alignment":["Tasaus"],"style.background-color":["Taustav\xE4ri"],"style.border-color":["Reunan v\xE4ri"],"style.border-radius":["Reunan py\xF6ristys"],"style.font-family":["Fontti"],"style.font-size":["Fonttikoko"],"style.font-weight":["Fontin paksuus"],"style.letter-spacing":["Kirjainv\xE4li"],"style.line-height":["Rivikorkeus"],"style.padding":["T\xE4yte"],"style.text-color":["Tekstin v\xE4ri"],"toolbar.bold":["Lihavointi"],"toolbar.bold-shortcut":["Lihavointi (Cmd+B)"],"toolbar.italic":["Kursivointi"],"toolbar.italic-shortcut":["Kursivointi (Cmd+I)"],"toolbar.link":["Linkki"],"toolbar.link-shortcut":["Linkki (Cmd+K)"],"tune.copy":["Kopioi lohko"],"tune.delete":["Poista"],"tune.move-down":["Siirr\xE4 alas"],"tune.move-up":["Siirr\xE4 yl\xF6s"]}');
+
+// src/locales/sv/messages.ts
+var messages3 = JSON.parse('{"drawer.library":["Bibliotek"],"drawer.new-sample":["Ny mall"],"drawer.new-template":["Ny e-postmall"],"drawer.no-samples":["Inga exempel tillg\xE4ngliga"],"drawer.no-samples-match":["Inga exempel matchar dina filter"],"drawer.no-templates":["Inga sparade mallar \xE4nnu"],"drawer.no-templates-match":["Inga mallar matchar dina filter"],"drawer.search-samples":["S\xF6k exempel"],"drawer.search-templates":["S\xF6k mallar"],"drawer.sort-by":["Sortera efter"],"drawer.tab.outline":["Struktur"],"drawer.tab.samples":["Exempel"],"drawer.tab.templates":["Mallar"],"drawer.tag.all":["Alla"],"panel.avatar-block":["Avatarblock"],"panel.button-block":["Knappblock"],"panel.columns-block":["Kolumner"],"panel.container-block":["Beh\xE5llarblock"],"panel.divider-block":["Avgr\xE4nsare"],"panel.editor-appearance":["Editorns utseende"],"panel.export":["Exportera"],"panel.global":["Allm\xE4nt"],"panel.heading-block":["Rubrikblock"],"panel.html-block":["HTML-block"],"panel.image-block":["Bildblock"],"panel.signature-block":["Signaturblock"],"panel.spacer-block":["Mellanrumsblock"],"panel.template":["Mall"],"panel.text-block":["Textblock"],"savebar.error-saving":["Fel vid sparande"],"savebar.new":["Ny"],"savebar.new-template-created":["Ny mall skapad"],"savebar.sample-prefix":["Exempel"],"savebar.sample-saved":["Exempel sparat"],"savebar.save":["Spara"],"savebar.save-as":["Spara som\u2026"],"savebar.save-as-new":["Spara som ny\u2026"],"savebar.save-as-new-template":["Spara som en ny mall"],"savebar.save-changes":["Spara \xE4ndringar"],"savebar.save-changes-to-sample":["Spara \xE4ndringar till detta exempel"],"savebar.start-fresh":["Starta en ny mall"],"savebar.template-saved":["Mall sparad"],"sort.last-updated":["Senast uppdaterad"],"sort.name":["Namn (A\u2013\xD6)"],"sort.recently-created":["Nyligen skapad"],"style.alignment":["Justering"],"style.background-color":["Bakgrundsf\xE4rg"],"style.border-color":["Kantf\xE4rg"],"style.border-radius":["Kantradie"],"style.font-family":["Typsnitt"],"style.font-size":["Typsnittsstorlek"],"style.font-weight":["Typsnittsvikt"],"style.letter-spacing":["Teckenavst\xE5nd"],"style.line-height":["Radh\xF6jd"],"style.padding":["Utrymme"],"style.text-color":["Textf\xE4rg"],"toolbar.bold":["Fet"],"toolbar.bold-shortcut":["Fet (Cmd+B)"],"toolbar.italic":["Kursiv"],"toolbar.italic-shortcut":["Kursiv (Cmd+I)"],"toolbar.link":["L\xE4nk"],"toolbar.link-shortcut":["L\xE4nk (Cmd+K)"],"tune.copy":["Kopiera block"],"tune.delete":["Ta bort"],"tune.move-down":["Flytta ner"],"tune.move-up":["Flytta upp"]}');
+var SUPPORTED_LOCALES = ["en", "sv", "fi"];
+var CATALOGS = {
+  en: messages,
+  sv: messages3,
+  fi: messages2
+};
+var loaded = false;
+function activateLocale(locale) {
+  const resolved = SUPPORTED_LOCALES.includes(locale != null ? locale : "") ? locale : "en";
+  if (locale && resolved !== locale) {
+    console.warn(`[email-template-editor] Unsupported locale "${locale}", falling back to "en".`);
+  }
+  if (!loaded) {
+    core.i18n.load({ en: CATALOGS.en, sv: CATALOGS.sv, fi: CATALOGS.fi });
+    loaded = true;
+  }
+  core.i18n.activate(resolved);
+  return resolved;
+}
+function t(id, fallback) {
+  return core.i18n._(id, {}, { message: fallback != null ? fallback : id });
+}
 var EMPTY_DOCUMENT = {
   root: {
     type: "EmailLayout",
@@ -2155,20 +2188,21 @@ function buildSavePayload(doc) {
 }
 
 // src/app/context.tsx
-var EmailEditorContext = React62.createContext(null);
+var EmailEditorContext = React57.createContext(null);
 var EmailEditorProvider = ({
   children,
   initialTemplateId = null,
   initialTemplateName = null,
   onSave
 }) => {
-  const [currentTemplateId, setCurrentTemplateId] = React62.useState(initialTemplateId);
-  const [currentTemplateName, setCurrentTemplateName] = React62.useState(initialTemplateName);
-  const [currentTemplateKind, setCurrentTemplateKind] = React62.useState(null);
-  const saveListenersRef = React62.useRef([]);
-  const onSaveRef = React62.useRef(onSave);
+  const [currentTemplateId, setCurrentTemplateId] = React57.useState(initialTemplateId);
+  const [currentTemplateName, setCurrentTemplateName] = React57.useState(initialTemplateName);
+  const [currentTemplateKind, setCurrentTemplateKind] = React57.useState(null);
+  const [currentTemplateTags, setCurrentTemplateTagsState] = React57.useState([]);
+  const saveListenersRef = React57.useRef([]);
+  const onSaveRef = React57.useRef(onSave);
   onSaveRef.current = onSave;
-  const saveTemplate = React62.useCallback(() => {
+  const saveTemplate = React57.useCallback(() => {
     const currentDoc = getDocument();
     saveListenersRef.current.forEach((listener) => listener(currentDoc));
     if (onSaveRef.current) {
@@ -2176,67 +2210,104 @@ var EmailEditorProvider = ({
     }
     return currentDoc;
   }, []);
-  const loadTemplate = React62.useCallback((newTemplate, templateId, templateName, kind) => {
-    if (templateId !== void 0) {
+  const loadTemplate = React57.useCallback(
+    (_newTemplate, templateId, templateName, kind, tags) => {
+      if (templateId !== void 0) setCurrentTemplateId(templateId);
+      if (templateName !== void 0) setCurrentTemplateName(templateName);
+      if (kind !== void 0) setCurrentTemplateKind(kind);
+      if (tags !== void 0) setCurrentTemplateTagsState(tags != null ? tags : []);
+    },
+    []
+  );
+  const setCurrentTemplate = React57.useCallback(
+    (templateId, templateName, kind, tags) => {
       setCurrentTemplateId(templateId);
-    }
-    if (templateName !== void 0) {
       setCurrentTemplateName(templateName);
-    }
-    if (kind !== void 0) {
-      setCurrentTemplateKind(kind);
-    }
-  }, []);
-  const setCurrentTemplate = React62.useCallback((templateId, templateName, kind) => {
-    setCurrentTemplateId(templateId);
-    setCurrentTemplateName(templateName);
-    if (kind !== void 0) {
-      setCurrentTemplateKind(kind);
-    }
+      if (kind !== void 0) setCurrentTemplateKind(kind);
+      if (tags !== void 0) setCurrentTemplateTagsState(tags != null ? tags : []);
+    },
+    []
+  );
+  const setCurrentTemplateTags = React57.useCallback((tags) => {
+    setCurrentTemplateTagsState(tags);
   }, []);
-  const registerSaveListener = React62.useCallback((callback) => {
+  const registerSaveListener = React57.useCallback((callback) => {
     saveListenersRef.current = [...saveListenersRef.current, callback];
     return () => {
       saveListenersRef.current = saveListenersRef.current.filter((listener) => listener !== callback);
     };
   }, []);
-  const value = React62.useMemo(() => ({
-    currentTemplateId,
-    currentTemplateName,
-    currentTemplateKind,
-    saveTemplate,
-    loadTemplate,
-    registerSaveListener,
-    setCurrentTemplate
-  }), [currentTemplateId, currentTemplateName, currentTemplateKind, saveTemplate, loadTemplate, registerSaveListener, setCurrentTemplate]);
-  return /* @__PURE__ */ React62__default.default.createElement(EmailEditorContext.Provider, { value }, children);
+  const value = React57.useMemo(
+    () => ({
+      currentTemplateId,
+      currentTemplateName,
+      currentTemplateKind,
+      currentTemplateTags,
+      saveTemplate,
+      loadTemplate,
+      registerSaveListener,
+      setCurrentTemplate,
+      setCurrentTemplateTags
+    }),
+    [
+      currentTemplateId,
+      currentTemplateName,
+      currentTemplateKind,
+      currentTemplateTags,
+      saveTemplate,
+      loadTemplate,
+      registerSaveListener,
+      setCurrentTemplate,
+      setCurrentTemplateTags
+    ]
+  );
+  return /* @__PURE__ */ React57__default.default.createElement(EmailEditorContext.Provider, { value }, children);
 };
 var useEmailEditor = () => {
-  const context = React62.useContext(EmailEditorContext);
+  const context = React57.useContext(EmailEditorContext);
   if (!context) {
     throw new Error("useEmailEditor must be used within an EmailEditorProvider");
   }
   return context;
 };
-var ImageCallbacksContext = React62.createContext({});
+var ImageCallbacksContext = React57.createContext({});
 function ImageCallbacksProvider({
   callbacks,
   children
 }) {
-  return /* @__PURE__ */ React62__default.default.createElement(ImageCallbacksContext.Provider, { value: callbacks }, children);
+  return /* @__PURE__ */ React57__default.default.createElement(ImageCallbacksContext.Provider, { value: callbacks }, children);
 }
 function useImageCallbacks() {
-  return React62.useContext(ImageCallbacksContext);
-}
+  return React57.useContext(ImageCallbacksContext);
+}
+var TITLE_KEYS = {
+  "Editor appearance": "panel.editor-appearance",
+  Template: "panel.template",
+  Export: "panel.export",
+  Global: "panel.global",
+  "Text block": "panel.text-block",
+  "Heading block": "panel.heading-block",
+  "Button block": "panel.button-block",
+  "Image block": "panel.image-block",
+  "Avatar block": "panel.avatar-block",
+  "Signature block": "panel.signature-block",
+  "Spacer block": "panel.spacer-block",
+  "Divider block": "panel.divider-block",
+  "Columns block": "panel.columns-block",
+  "Container block": "panel.container-block",
+  "Html block": "panel.html-block"
+};
 function BaseSidebarPanel({ title, children }) {
-  return /* @__PURE__ */ React62__default.default.createElement(material.Box, { p: 2 }, /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "overline", color: "text.secondary", sx: { display: "block", mb: 2 } }, title), /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 5, mb: 3 }, children));
+  const key = TITLE_KEYS[title];
+  const displayTitle = key ? t(key, title) : title;
+  return /* @__PURE__ */ React57__default.default.createElement(material.Box, { p: 2 }, /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "overline", color: "text.secondary", sx: { display: "block", mb: 2 } }, displayTitle), /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 5, mb: 3 }, children));
 }
 function RadioGroupInput({ label, children, defaultValue, onChange }) {
-  const [value, setValue] = React62.useState(defaultValue);
-  React62.useEffect(() => {
+  const [value, setValue] = React57.useState(defaultValue);
+  React57.useEffect(() => {
     setValue(defaultValue);
   }, [defaultValue]);
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { alignItems: "flex-start" }, /* @__PURE__ */ React62__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { alignItems: "flex-start" }, /* @__PURE__ */ React57__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React57__default.default.createElement(
     material.ToggleButtonGroup,
     {
       exclusive: true,
@@ -2256,7 +2327,7 @@ function RadioGroupInput({ label, children, defaultValue, onChange }) {
 }
 function RawSliderInput(_a) {
   var _b = _a, { iconLabel, value, setValue, units } = _b, props = __objRest(_b, ["iconLabel", "value", "setValue", "units"]);
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", alignItems: "center", spacing: 2, justifyContent: "space-between", width: "100%" }, /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { minWidth: 24, lineHeight: 1, flexShrink: 0 } }, iconLabel), /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", alignItems: "center", spacing: 2, justifyContent: "space-between", width: "100%" }, /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { minWidth: 24, lineHeight: 1, flexShrink: 0 } }, iconLabel), /* @__PURE__ */ React57__default.default.createElement(
     material.Slider,
     __spreadProps(__spreadValues({}, props), {
       value,
@@ -2267,14 +2338,14 @@ function RawSliderInput(_a) {
         setValue(value2);
       }
     })
-  ), /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { minWidth: 32, textAlign: "right", flexShrink: 0 } }, /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "body2", color: "text.secondary", sx: { lineHeight: 1 } }, value, units)));
+  ), /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { minWidth: 32, textAlign: "right", flexShrink: 0 } }, /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "body2", color: "text.secondary", sx: { lineHeight: 1 } }, value, units)));
 }
 
 // src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/slider-input.tsx
 function SliderInput(_a) {
   var _b = _a, { label, defaultValue, onChange } = _b, props = __objRest(_b, ["label", "defaultValue", "onChange"]);
-  const [value, setValue] = React62.useState(defaultValue);
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React62__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React62__default.default.createElement(
+  const [value, setValue] = React57.useState(defaultValue);
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React57__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React57__default.default.createElement(
     RawSliderInput,
     __spreadValues({
       value,
@@ -2286,12 +2357,12 @@ function SliderInput(_a) {
   ));
 }
 function TextInput({ helperText, label, placeholder, rows, InputProps: InputProps2, defaultValue, onChange }) {
-  const [value, setValue] = React62.useState(defaultValue);
+  const [value, setValue] = React57.useState(defaultValue);
   const isMultiline = typeof rows === "number" && rows > 1;
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setValue(defaultValue);
   }, [defaultValue]);
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       fullWidth: true,
@@ -2317,7 +2388,7 @@ var TILE_BUTTON = {
 };
 function Swatch({ paletteColors, value, onChange }) {
   const renderButton2 = (colorValue) => {
-    return /* @__PURE__ */ React62__default.default.createElement(
+    return /* @__PURE__ */ React57__default.default.createElement(
       material.Button,
       {
         key: colorValue,
@@ -2336,7 +2407,7 @@ function Swatch({ paletteColors, value, onChange }) {
       }
     );
   };
-  return /* @__PURE__ */ React62__default.default.createElement(material.Box, { width: "100%", sx: { display: "grid", gap: 1, gridTemplateColumns: "1fr 1fr 1fr 1fr 1fr 1fr" } }, paletteColors.map((c) => renderButton2(c)));
+  return /* @__PURE__ */ React57__default.default.createElement(material.Box, { width: "100%", sx: { display: "grid", gap: 1, gridTemplateColumns: "1fr 1fr 1fr 1fr 1fr 1fr" } }, paletteColors.map((c) => renderButton2(c)));
 }
 
 // src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/color-input/picker.tsx
@@ -2403,7 +2474,7 @@ var SX = {
   }
 };
 function Picker({ value, onChange }) {
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 1, sx: SX }, /* @__PURE__ */ React62__default.default.createElement(reactColorful.HexColorPicker, { color: value, onChange }), /* @__PURE__ */ React62__default.default.createElement(Swatch, { paletteColors: DEFAULT_PRESET_COLORS, value, onChange }), /* @__PURE__ */ React62__default.default.createElement(material.Box, { pt: 1 }, /* @__PURE__ */ React62__default.default.createElement(reactColorful.HexColorInput, { prefixed: true, color: value, onChange })));
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 1, sx: SX }, /* @__PURE__ */ React57__default.default.createElement(reactColorful.HexColorPicker, { color: value, onChange }), /* @__PURE__ */ React57__default.default.createElement(Swatch, { paletteColors: DEFAULT_PRESET_COLORS, value, onChange }), /* @__PURE__ */ React57__default.default.createElement(material.Box, { pt: 1 }, /* @__PURE__ */ React57__default.default.createElement(reactColorful.HexColorInput, { prefixed: true, color: value, onChange })));
 }
 
 // src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/color-input/base-color-input.tsx
@@ -2416,8 +2487,8 @@ var BUTTON_SX = {
   bgcolor: "#FFFFFF"
 };
 function ColorInput({ label, defaultValue, onChange, nullable }) {
-  const [anchorEl, setAnchorEl] = React62.useState(null);
-  const [value, setValue] = React62.useState(defaultValue);
+  const [anchorEl, setAnchorEl] = React57.useState(null);
+  const [value, setValue] = React57.useState(defaultValue);
   const handleClickOpen = (event) => {
     setAnchorEl(event.currentTarget);
   };
@@ -2428,7 +2499,7 @@ function ColorInput({ label, defaultValue, onChange, nullable }) {
     if (typeof value !== "string" || value.trim().length === 0) {
       return null;
     }
-    return /* @__PURE__ */ React62__default.default.createElement(
+    return /* @__PURE__ */ React57__default.default.createElement(
       material.ButtonBase,
       {
         onClick: () => {
@@ -2436,16 +2507,16 @@ function ColorInput({ label, defaultValue, onChange, nullable }) {
           onChange(null);
         }
       },
-      /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.CloseOutlined, { fontSize: "small", sx: { color: "grey.600" } })
+      /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.CloseOutlined, { fontSize: "small", sx: { color: "grey.600" } })
     );
   };
   const renderOpenButton = () => {
     if (value) {
-      return /* @__PURE__ */ React62__default.default.createElement(material.ButtonBase, { onClick: handleClickOpen, sx: __spreadProps(__spreadValues({}, BUTTON_SX), { bgcolor: value }) });
+      return /* @__PURE__ */ React57__default.default.createElement(material.ButtonBase, { onClick: handleClickOpen, sx: __spreadProps(__spreadValues({}, BUTTON_SX), { bgcolor: value }) });
     }
-    return /* @__PURE__ */ React62__default.default.createElement(material.ButtonBase, { onClick: handleClickOpen, sx: __spreadValues({}, BUTTON_SX) }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" }));
+    return /* @__PURE__ */ React57__default.default.createElement(material.ButtonBase, { onClick: handleClickOpen, sx: __spreadValues({}, BUTTON_SX) }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" }));
   };
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { alignItems: "flex-start" }, /* @__PURE__ */ React62__default.default.createElement(material.InputLabel, { sx: { mb: 0.5 } }, label), /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 1 }, renderOpenButton(), renderResetButton()), /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { alignItems: "flex-start" }, /* @__PURE__ */ React57__default.default.createElement(material.InputLabel, { sx: { mb: 0.5 } }, label), /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 1 }, renderOpenButton(), renderResetButton()), /* @__PURE__ */ React57__default.default.createElement(
     material.Menu,
     {
       anchorEl,
@@ -2455,7 +2526,7 @@ function ColorInput({ label, defaultValue, onChange, nullable }) {
         sx: { height: "auto", padding: 0 }
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       Picker,
       {
         value: value || "",
@@ -2470,10 +2541,10 @@ function ColorInput({ label, defaultValue, onChange, nullable }) {
 
 // src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/color-input/index.tsx
 function ColorInput2(props) {
-  return /* @__PURE__ */ React62__default.default.createElement(ColorInput, __spreadProps(__spreadValues({}, props), { nullable: false }));
+  return /* @__PURE__ */ React57__default.default.createElement(ColorInput, __spreadProps(__spreadValues({}, props), { nullable: false }));
 }
 function NullableColorInput(props) {
-  return /* @__PURE__ */ React62__default.default.createElement(ColorInput, __spreadProps(__spreadValues({}, props), { nullable: true }));
+  return /* @__PURE__ */ React57__default.default.createElement(ColorInput, __spreadProps(__spreadValues({}, props), { nullable: true }));
 }
 
 // src/editor/blocks/helpers/font-family.ts
@@ -2526,13 +2597,13 @@ var FONT_FAMILIES = [
 ];
 
 // src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/font-family.tsx
-var OPTIONS = FONT_FAMILIES.map((option) => /* @__PURE__ */ React62__default.default.createElement(material.MenuItem, { key: option.key, value: option.key, sx: { fontFamily: option.value } }, option.label));
+var OPTIONS = FONT_FAMILIES.map((option) => /* @__PURE__ */ React57__default.default.createElement(material.MenuItem, { key: option.key, value: option.key, sx: { fontFamily: option.value } }, option.label));
 function NullableFontFamily({ label, onChange, defaultValue }) {
-  const [value, setValue] = React62.useState(defaultValue != null ? defaultValue : "inherit");
-  React62.useEffect(() => {
+  const [value, setValue] = React57.useState(defaultValue != null ? defaultValue : "inherit");
+  React57.useEffect(() => {
     setValue(defaultValue != null ? defaultValue : "inherit");
   }, [defaultValue]);
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       select: true,
@@ -2545,23 +2616,23 @@ function NullableFontFamily({ label, onChange, defaultValue }) {
         onChange(v === null ? null : v);
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.MenuItem, { value: "inherit" }, "Match email settings"),
+    /* @__PURE__ */ React57__default.default.createElement(material.MenuItem, { value: "inherit" }, "Match email settings"),
     OPTIONS
   );
 }
 function FontSizeInput({ label, defaultValue, onChange }) {
-  const [value, setValue] = React62.useState(defaultValue);
-  React62.useEffect(() => {
+  const [value, setValue] = React57.useState(defaultValue);
+  React57.useEffect(() => {
     setValue(defaultValue);
   }, [defaultValue]);
   const handleChange = (value2) => {
     setValue(value2);
     onChange(value2);
   };
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React62__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React57__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React57__default.default.createElement(
     RawSliderInput,
     {
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.TextFieldsOutlined, { sx: { fontSize: 16 } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.TextFieldsOutlined, { sx: { fontSize: 16 } }),
       value,
       setValue: handleChange,
       units: "px",
@@ -2572,11 +2643,11 @@ function FontSizeInput({ label, defaultValue, onChange }) {
   ));
 }
 function FontWeightInput({ label, defaultValue, onChange }) {
-  const [value, setValue] = React62.useState(defaultValue);
-  React62.useEffect(() => {
+  const [value, setValue] = React57.useState(defaultValue);
+  React57.useEffect(() => {
     setValue(defaultValue);
   }, [defaultValue]);
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label,
@@ -2586,23 +2657,23 @@ function FontWeightInput({ label, defaultValue, onChange }) {
         onChange(fontWeight);
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "normal" }, "Regular"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "bold" }, "Bold")
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "normal" }, "Regular"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "bold" }, "Bold")
   );
 }
 function LetterSpacingInput({ label, defaultValue, onChange }) {
-  const [value, setValue] = React62.useState(defaultValue != null ? defaultValue : 0);
-  React62.useEffect(() => {
+  const [value, setValue] = React57.useState(defaultValue != null ? defaultValue : 0);
+  React57.useEffect(() => {
     setValue(defaultValue != null ? defaultValue : 0);
   }, [defaultValue]);
   const handleChange = (v) => {
     setValue(v);
     onChange(v === 0 ? null : v);
   };
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React62__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React57__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React57__default.default.createElement(
     RawSliderInput,
     {
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.SpaceBarOutlined, { sx: { fontSize: 16 } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.SpaceBarOutlined, { sx: { fontSize: 16 } }),
       value,
       setValue: handleChange,
       units: "px",
@@ -2613,18 +2684,18 @@ function LetterSpacingInput({ label, defaultValue, onChange }) {
   ));
 }
 function LineHeightInput({ label, defaultValue, onChange }) {
-  const [value, setValue] = React62.useState(defaultValue != null ? defaultValue : 0);
-  React62.useEffect(() => {
+  const [value, setValue] = React57.useState(defaultValue != null ? defaultValue : 0);
+  React57.useEffect(() => {
     setValue(defaultValue != null ? defaultValue : 0);
   }, [defaultValue]);
   const handleChange = (v) => {
     setValue(v);
     onChange(v === 0 ? null : v);
   };
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React62__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React57__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React57__default.default.createElement(
     RawSliderInput,
     {
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.FormatLineSpacingOutlined, { sx: { fontSize: 16 } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.FormatLineSpacingOutlined, { sx: { fontSize: 16 } }),
       value,
       setValue: handleChange,
       units: "",
@@ -2635,7 +2706,7 @@ function LineHeightInput({ label, defaultValue, onChange }) {
   ));
 }
 function PaddingInput({ label, defaultValue, onChange }) {
-  const [value, setValue] = React62.useState(() => {
+  const [value, setValue] = React57.useState(() => {
     if (defaultValue) {
       return defaultValue;
     }
@@ -2653,10 +2724,10 @@ function PaddingInput({ label, defaultValue, onChange }) {
     setValue(v);
     onChange(v);
   }
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 2, alignItems: "flex-start", pb: 1 }, /* @__PURE__ */ React62__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 2, alignItems: "flex-start", pb: 1 }, /* @__PURE__ */ React57__default.default.createElement(material.InputLabel, { shrink: true }, label), /* @__PURE__ */ React57__default.default.createElement(
     RawSliderInput,
     {
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AlignVerticalTopOutlined, { sx: { fontSize: 16 } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AlignVerticalTopOutlined, { sx: { fontSize: 16 } }),
       value: value.top,
       setValue: (num) => handleChange("top", num),
       units: "px",
@@ -2665,10 +2736,10 @@ function PaddingInput({ label, defaultValue, onChange }) {
       max: 80,
       marks: true
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RawSliderInput,
     {
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AlignVerticalBottomOutlined, { sx: { fontSize: 16 } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AlignVerticalBottomOutlined, { sx: { fontSize: 16 } }),
       value: value.bottom,
       setValue: (num) => handleChange("bottom", num),
       units: "px",
@@ -2677,10 +2748,10 @@ function PaddingInput({ label, defaultValue, onChange }) {
       max: 80,
       marks: true
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RawSliderInput,
     {
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AlignHorizontalLeftOutlined, { sx: { fontSize: 16 } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AlignHorizontalLeftOutlined, { sx: { fontSize: 16 } }),
       value: value.left,
       setValue: (num) => handleChange("left", num),
       units: "px",
@@ -2689,10 +2760,10 @@ function PaddingInput({ label, defaultValue, onChange }) {
       max: 80,
       marks: true
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RawSliderInput,
     {
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AlignHorizontalRightOutlined, { sx: { fontSize: 16 } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AlignHorizontalRightOutlined, { sx: { fontSize: 16 } }),
       value: value.right,
       setValue: (num) => handleChange("right", num),
       units: "px",
@@ -2704,11 +2775,11 @@ function PaddingInput({ label, defaultValue, onChange }) {
   ));
 }
 function TextAlignInput({ label, defaultValue, onChange }) {
-  const [value, setValue] = React62.useState(defaultValue != null ? defaultValue : "left");
-  React62.useEffect(() => {
+  const [value, setValue] = React57.useState(defaultValue != null ? defaultValue : "left");
+  React57.useEffect(() => {
     setValue(defaultValue != null ? defaultValue : "left");
   }, [defaultValue]);
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label,
@@ -2718,9 +2789,9 @@ function TextAlignInput({ label, defaultValue, onChange }) {
         onChange(value2);
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "left" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.FormatAlignLeftOutlined, { fontSize: "small" })),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "center" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.FormatAlignCenterOutlined, { fontSize: "small" })),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "right" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.FormatAlignRightOutlined, { fontSize: "small" }))
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "left" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.FormatAlignLeftOutlined, { fontSize: "small" })),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "center" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.FormatAlignCenterOutlined, { fontSize: "small" })),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "right" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.FormatAlignRightOutlined, { fontSize: "small" }))
   );
 }
 
@@ -2733,52 +2804,52 @@ function SingleStylePropertyPanel({ name, value, onChange }) {
   };
   switch (name) {
     case "backgroundColor":
-      return /* @__PURE__ */ React62__default.default.createElement(NullableColorInput, { label: "Background color", defaultValue, onChange: handleChange });
+      return /* @__PURE__ */ React57__default.default.createElement(NullableColorInput, { label: t("style.background-color", "Background color"), defaultValue, onChange: handleChange });
     case "borderColor":
-      return /* @__PURE__ */ React62__default.default.createElement(NullableColorInput, { label: "Border color", defaultValue, onChange: handleChange });
+      return /* @__PURE__ */ React57__default.default.createElement(NullableColorInput, { label: t("style.border-color", "Border color"), defaultValue, onChange: handleChange });
     case "borderRadius":
-      return /* @__PURE__ */ React62__default.default.createElement(
+      return /* @__PURE__ */ React57__default.default.createElement(
         SliderInput,
         {
-          iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.RoundedCornerOutlined, null),
+          iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.RoundedCornerOutlined, null),
           units: "px",
           step: 4,
           marks: true,
           min: 0,
           max: 48,
-          label: "Border radius",
+          label: t("style.border-radius", "Border radius"),
           defaultValue,
           onChange: handleChange
         }
       );
     case "color":
-      return /* @__PURE__ */ React62__default.default.createElement(NullableColorInput, { label: "Text color", defaultValue, onChange: handleChange });
+      return /* @__PURE__ */ React57__default.default.createElement(NullableColorInput, { label: t("style.text-color", "Text color"), defaultValue, onChange: handleChange });
     case "fontFamily":
-      return /* @__PURE__ */ React62__default.default.createElement(NullableFontFamily, { label: "Font family", defaultValue, onChange: handleChange });
+      return /* @__PURE__ */ React57__default.default.createElement(NullableFontFamily, { label: t("style.font-family", "Font family"), defaultValue, onChange: handleChange });
     case "fontSize":
-      return /* @__PURE__ */ React62__default.default.createElement(FontSizeInput, { label: "Font size", defaultValue, onChange: handleChange });
+      return /* @__PURE__ */ React57__default.default.createElement(FontSizeInput, { label: t("style.font-size", "Font size"), defaultValue, onChange: handleChange });
     case "fontWeight":
-      return /* @__PURE__ */ React62__default.default.createElement(FontWeightInput, { label: "Font weight", defaultValue, onChange: handleChange });
+      return /* @__PURE__ */ React57__default.default.createElement(FontWeightInput, { label: t("style.font-weight", "Font weight"), defaultValue, onChange: handleChange });
     case "lineHeight":
-      return /* @__PURE__ */ React62__default.default.createElement(LineHeightInput, { label: "Line height", defaultValue, onChange: handleChange });
+      return /* @__PURE__ */ React57__default.default.createElement(LineHeightInput, { label: t("style.line-height", "Line height"), defaultValue, onChange: handleChange });
     case "letterSpacing":
-      return /* @__PURE__ */ React62__default.default.createElement(LetterSpacingInput, { label: "Letter spacing", defaultValue, onChange: handleChange });
+      return /* @__PURE__ */ React57__default.default.createElement(LetterSpacingInput, { label: t("style.letter-spacing", "Letter spacing"), defaultValue, onChange: handleChange });
     case "textAlign":
-      return /* @__PURE__ */ React62__default.default.createElement(TextAlignInput, { label: "Alignment", defaultValue, onChange: handleChange });
+      return /* @__PURE__ */ React57__default.default.createElement(TextAlignInput, { label: t("style.alignment", "Alignment"), defaultValue, onChange: handleChange });
     case "padding":
-      return /* @__PURE__ */ React62__default.default.createElement(PaddingInput, { label: "Padding", defaultValue, onChange: handleChange });
+      return /* @__PURE__ */ React57__default.default.createElement(PaddingInput, { label: t("style.padding", "Padding"), defaultValue, onChange: handleChange });
   }
 }
 
 // src/app/inspector-drawer/configuration-panel/input-panels/helpers/style-inputs/multi-style-property-panel.tsx
 function MultiStylePropertyPanel({ names, value, onChange }) {
-  return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, names.map((name) => /* @__PURE__ */ React62__default.default.createElement(SingleStylePropertyPanel, { key: name, name, value: value || {}, onChange })));
+  return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, names.map((name) => /* @__PURE__ */ React57__default.default.createElement(SingleStylePropertyPanel, { key: name, name, value: value || {}, onChange })));
 }
 
 // src/app/inspector-drawer/configuration-panel/input-panels/avatar-sidebar-panel.tsx
 function AvatarSidebarPanel({ data, setData }) {
   var _a, _b, _c, _d, _e, _f, _g, _h;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = AvatarPropsSchema.safeParse(d);
     if (res.success) {
@@ -2792,11 +2863,11 @@ function AvatarSidebarPanel({ data, setData }) {
   const imageUrl = (_d = (_c = data.props) == null ? void 0 : _c.imageUrl) != null ? _d : AvatarPropsDefaults.imageUrl;
   const alt = (_f = (_e = data.props) == null ? void 0 : _e.alt) != null ? _f : AvatarPropsDefaults.alt;
   const shape = (_h = (_g = data.props) == null ? void 0 : _g.shape) != null ? _h : AvatarPropsDefaults.shape;
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Avatar block" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Avatar block" }, /* @__PURE__ */ React57__default.default.createElement(
     SliderInput,
     {
       label: "Size",
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AspectRatioOutlined, { sx: { color: "text.secondary" } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AspectRatioOutlined, { sx: { color: "text.secondary" } }),
       units: "px",
       step: 3,
       min: 32,
@@ -2806,7 +2877,7 @@ function AvatarSidebarPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { size: size2 }) }));
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label: "Shape",
@@ -2815,10 +2886,10 @@ function AvatarSidebarPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { shape: shape2 }) }));
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "circle" }, "Circle"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "square" }, "Square"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "rounded" }, "Rounded")
-  ), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "circle" }, "Circle"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "square" }, "Square"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "rounded" }, "Rounded")
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Image URL",
@@ -2827,7 +2898,7 @@ function AvatarSidebarPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { imageUrl: imageUrl2 }) }));
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Alt text",
@@ -2836,7 +2907,7 @@ function AvatarSidebarPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { alt: alt2 }) }));
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     MultiStylePropertyPanel,
     {
       names: ["textAlign", "padding"],
@@ -2847,7 +2918,7 @@ function AvatarSidebarPanel({ data, setData }) {
 }
 function ButtonSidebarPanel({ data, setData }) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = ButtonPropsSchema.safeParse(d);
     if (res.success) {
@@ -2864,65 +2935,65 @@ function ButtonSidebarPanel({ data, setData }) {
   const buttonStyle = (_j = (_i = data.props) == null ? void 0 : _i.buttonStyle) != null ? _j : ButtonPropsDefaults.buttonStyle;
   const buttonTextColor = (_l = (_k = data.props) == null ? void 0 : _k.buttonTextColor) != null ? _l : ButtonPropsDefaults.buttonTextColor;
   const buttonBackgroundColor = (_n = (_m = data.props) == null ? void 0 : _m.buttonBackgroundColor) != null ? _n : ButtonPropsDefaults.buttonBackgroundColor;
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Button block" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Button block" }, /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Text",
       defaultValue: text,
       onChange: (text2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { text: text2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Url",
       defaultValue: url,
       onChange: (url2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { url: url2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label: "Width",
       defaultValue: fullWidth ? "FULL_WIDTH" : "AUTO",
       onChange: (v) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { fullWidth: v === "FULL_WIDTH" }) }))
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "FULL_WIDTH" }, "Full"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "AUTO" }, "Auto")
-  ), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "FULL_WIDTH" }, "Full"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "AUTO" }, "Auto")
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label: "Size",
       defaultValue: size,
       onChange: (size2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { size: size2 }) }))
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "x-small" }, "Xs"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "small" }, "Sm"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "medium" }, "Md"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "large" }, "Lg")
-  ), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "x-small" }, "Xs"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "small" }, "Sm"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "medium" }, "Md"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "large" }, "Lg")
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label: "Style",
       defaultValue: buttonStyle,
       onChange: (buttonStyle2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { buttonStyle: buttonStyle2 }) }))
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "rectangle" }, "Rectangle"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "rounded" }, "Rounded"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "pill" }, "Pill")
-  ), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "rectangle" }, "Rectangle"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "rounded" }, "Rounded"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "pill" }, "Pill")
+  ), /* @__PURE__ */ React57__default.default.createElement(
     ColorInput2,
     {
       label: "Text color",
       defaultValue: buttonTextColor,
       onChange: (buttonTextColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { buttonTextColor: buttonTextColor2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     ColorInput2,
     {
       label: "Button color",
       defaultValue: buttonBackgroundColor,
       onChange: (buttonBackgroundColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { buttonBackgroundColor: buttonBackgroundColor2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     MultiStylePropertyPanel,
     {
       names: [
@@ -2957,7 +3028,7 @@ function TextDimensionInput({ label, defaultValue, onChange }) {
     const value = parseInt(ev.target.value);
     onChange(isNaN(value) ? null : value);
   };
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       fullWidth: true,
@@ -2968,7 +3039,7 @@ function TextDimensionInput({ label, defaultValue, onChange }) {
       placeholder: "auto",
       size: "small",
       InputProps: {
-        endAdornment: /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "body2", color: "text.secondary" }, "px")
+        endAdornment: /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "body2", color: "text.secondary" }, "px")
       }
     }
   );
@@ -2976,7 +3047,7 @@ function TextDimensionInput({ label, defaultValue, onChange }) {
 
 // src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/column-widths-input.tsx
 function ColumnWidthsInput({ defaultValue, onChange }) {
-  const [currentValue, setCurrentValue] = React62.useState(() => {
+  const [currentValue, setCurrentValue] = React57.useState(() => {
     if (defaultValue) {
       return defaultValue;
     }
@@ -2990,7 +3061,7 @@ function ColumnWidthsInput({ defaultValue, onChange }) {
   };
   let column3 = null;
   {
-    column3 = /* @__PURE__ */ React62__default.default.createElement(
+    column3 = /* @__PURE__ */ React57__default.default.createElement(
       TextDimensionInput,
       {
         label: "Column 3",
@@ -3001,7 +3072,7 @@ function ColumnWidthsInput({ defaultValue, onChange }) {
       }
     );
   }
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 1 }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 1 }, /* @__PURE__ */ React57__default.default.createElement(
     TextDimensionInput,
     {
       label: "Column 1",
@@ -3010,7 +3081,7 @@ function ColumnWidthsInput({ defaultValue, onChange }) {
         setIndexValue(0, v);
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextDimensionInput,
     {
       label: "Column 2",
@@ -3025,7 +3096,7 @@ function ColumnWidthsInput({ defaultValue, onChange }) {
 // src/app/inspector-drawer/configuration-panel/input-panels/columns-container-sidebar-panel.tsx
 function ColumnsContainerPanel({ data, setData }) {
   var _a, _b, _c, _d, _e, _f;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = columns_container_props_schema_default2.safeParse(d);
     if (res.success) {
@@ -3035,7 +3106,7 @@ function ColumnsContainerPanel({ data, setData }) {
       setErrors(res.error);
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Columns block" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Columns block" }, /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label: "Number of columns",
@@ -3044,9 +3115,9 @@ function ColumnsContainerPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { columnsCount: v === "2" ? 2 : 3 }) }));
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "2" }, "2"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "3" }, "3")
-  ), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "2" }, "2"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "3" }, "3")
+  ), /* @__PURE__ */ React57__default.default.createElement(
     ColumnWidthsInput,
     {
       defaultValue: (_b = data.props) == null ? void 0 : _b.fixedWidths,
@@ -3054,11 +3125,11 @@ function ColumnsContainerPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { fixedWidths }) }));
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     SliderInput,
     {
       label: "Columns gap",
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.SpaceBarOutlined, { sx: { color: "text.secondary" } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.SpaceBarOutlined, { sx: { color: "text.secondary" } }),
       units: "px",
       step: 4,
       marks: true,
@@ -3067,7 +3138,7 @@ function ColumnsContainerPanel({ data, setData }) {
       defaultValue: (_d = (_c = data.props) == null ? void 0 : _c.columnsGap) != null ? _d : 0,
       onChange: (columnsGap) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { columnsGap }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label: "Alignment",
@@ -3076,10 +3147,10 @@ function ColumnsContainerPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { contentAlignment }) }));
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "top" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.VerticalAlignTopOutlined, { fontSize: "small" })),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "middle" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.VerticalAlignCenterOutlined, { fontSize: "small" })),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "bottom" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.VerticalAlignBottomOutlined, { fontSize: "small" }))
-  ), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "top" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.VerticalAlignTopOutlined, { fontSize: "small" })),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "middle" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.VerticalAlignCenterOutlined, { fontSize: "small" })),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "bottom" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.VerticalAlignBottomOutlined, { fontSize: "small" }))
+  ), /* @__PURE__ */ React57__default.default.createElement(
     MultiStylePropertyPanel,
     {
       names: ["backgroundColor", "padding"],
@@ -3098,7 +3169,7 @@ var container_props_schema_default = ContainerPropsSchema3;
 
 // src/app/inspector-drawer/configuration-panel/input-panels/container-sidebar-panel.tsx
 function ContainerSidebarPanel({ data, setData }) {
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = container_props_schema_default.safeParse(d);
     if (res.success) {
@@ -3108,7 +3179,7 @@ function ContainerSidebarPanel({ data, setData }) {
       setErrors(res.error);
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Container block" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Container block" }, /* @__PURE__ */ React57__default.default.createElement(
     MultiStylePropertyPanel,
     {
       names: ["backgroundColor", "borderColor", "borderRadius", "padding"],
@@ -3119,7 +3190,7 @@ function ContainerSidebarPanel({ data, setData }) {
 }
 function DividerSidebarPanel({ data, setData }) {
   var _a, _b, _c, _d;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = DividerPropsSchema.safeParse(d);
     if (res.success) {
@@ -3131,18 +3202,18 @@ function DividerSidebarPanel({ data, setData }) {
   };
   const lineColor = (_b = (_a = data.props) == null ? void 0 : _a.lineColor) != null ? _b : DividerPropsDefaults.lineColor;
   const lineHeight = (_d = (_c = data.props) == null ? void 0 : _c.lineHeight) != null ? _d : DividerPropsDefaults.lineHeight;
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Divider block" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Divider block" }, /* @__PURE__ */ React57__default.default.createElement(
     ColorInput2,
     {
       label: "Color",
       defaultValue: lineColor,
       onChange: (lineColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { lineColor: lineColor2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     SliderInput,
     {
       label: "Height",
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.HeightOutlined, { sx: { color: "text.secondary" } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.HeightOutlined, { sx: { color: "text.secondary" } }),
       units: "px",
       step: 1,
       min: 1,
@@ -3150,7 +3221,7 @@ function DividerSidebarPanel({ data, setData }) {
       defaultValue: lineHeight,
       onChange: (lineHeight2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { lineHeight: lineHeight2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     MultiStylePropertyPanel,
     {
       names: ["backgroundColor", "padding"],
@@ -3190,15 +3261,15 @@ var EmailLayoutPropsSchema2 = zod.z.object({
 });
 var email_layout_props_schema_default = EmailLayoutPropsSchema2;
 function BooleanInput({ label, defaultValue, onChange }) {
-  const [value, setValue] = React62.useState(defaultValue);
-  React62.useEffect(() => {
+  const [value, setValue] = React57.useState(defaultValue);
+  React57.useEffect(() => {
     setValue(defaultValue);
   }, [defaultValue]);
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.FormControlLabel,
     {
       label,
-      control: /* @__PURE__ */ React62__default.default.createElement(
+      control: /* @__PURE__ */ React57__default.default.createElement(
         material.Switch,
         {
           checked: value,
@@ -3215,7 +3286,7 @@ function BooleanInput({ label, defaultValue, onChange }) {
 // src/app/inspector-drawer/configuration-panel/input-panels/email-layout-sidebar-panel.tsx
 function EmailLayoutSidebarFields({ data, setData }) {
   var _a, _b, _c, _d, _e, _f;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = email_layout_props_schema_default.safeParse(d);
     if (res.success) {
@@ -3226,38 +3297,38 @@ function EmailLayoutSidebarFields({ data, setData }) {
     }
   };
   const backdropDisabled = (_a = data.backdropDisabled) != null ? _a : false;
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Global" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Global" }, /* @__PURE__ */ React57__default.default.createElement(
     BooleanInput,
     {
       label: "Disable backdrop",
       defaultValue: backdropDisabled,
       onChange: (backdropDisabled2) => updateData(__spreadProps(__spreadValues({}, data), { backdropDisabled: backdropDisabled2 }))
     }
-  ), !backdropDisabled && /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(
+  ), !backdropDisabled && /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(
     ColorInput2,
     {
       label: "Backdrop color",
       defaultValue: (_b = data.backdropColor) != null ? _b : "#F5F5F5",
       onChange: (backdropColor) => updateData(__spreadProps(__spreadValues({}, data), { backdropColor }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     ColorInput2,
     {
       label: "Canvas color",
       defaultValue: (_c = data.canvasColor) != null ? _c : "#FFFFFF",
       onChange: (canvasColor) => updateData(__spreadProps(__spreadValues({}, data), { canvasColor }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     NullableColorInput,
     {
       label: "Canvas border color",
       defaultValue: (_d = data.borderColor) != null ? _d : null,
       onChange: (borderColor) => updateData(__spreadProps(__spreadValues({}, data), { borderColor }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     SliderInput,
     {
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.RoundedCornerOutlined, null),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.RoundedCornerOutlined, null),
       units: "px",
       step: 4,
       marks: true,
@@ -3267,14 +3338,14 @@ function EmailLayoutSidebarFields({ data, setData }) {
       defaultValue: (_e = data.borderRadius) != null ? _e : 0,
       onChange: (borderRadius) => updateData(__spreadProps(__spreadValues({}, data), { borderRadius }))
     }
-  )), /* @__PURE__ */ React62__default.default.createElement(
+  )), /* @__PURE__ */ React57__default.default.createElement(
     NullableFontFamily,
     {
       label: "Font family",
       defaultValue: "MODERN_SANS",
       onChange: (fontFamily) => updateData(__spreadProps(__spreadValues({}, data), { fontFamily }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     ColorInput2,
     {
       label: "Text color",
@@ -3285,7 +3356,7 @@ function EmailLayoutSidebarFields({ data, setData }) {
 }
 function HeadingSidebarPanel({ data, setData }) {
   var _a, _b, _c, _d;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = HeadingPropsSchema.safeParse(d);
     if (res.success) {
@@ -3295,7 +3366,7 @@ function HeadingSidebarPanel({ data, setData }) {
       setErrors(res.error);
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Heading block" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Heading block" }, /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Content",
@@ -3305,7 +3376,7 @@ function HeadingSidebarPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { text }) }));
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label: "Level",
@@ -3314,10 +3385,10 @@ function HeadingSidebarPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { level }) }));
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "h1" }, "H1"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "h2" }, "H2"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "h3" }, "H3")
-  ), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "h1" }, "H1"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "h2" }, "H2"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "h3" }, "H3")
+  ), /* @__PURE__ */ React57__default.default.createElement(
     MultiStylePropertyPanel,
     {
       names: [
@@ -3337,7 +3408,7 @@ function HeadingSidebarPanel({ data, setData }) {
 }
 function HtmlSidebarPanel({ data, setData }) {
   var _a, _b;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = HtmlPropsSchema.safeParse(d);
     if (res.success) {
@@ -3347,7 +3418,7 @@ function HtmlSidebarPanel({ data, setData }) {
       setErrors(res.error);
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Html block" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Html block" }, /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Content",
@@ -3355,7 +3426,7 @@ function HtmlSidebarPanel({ data, setData }) {
       defaultValue: (_b = (_a = data.props) == null ? void 0 : _a.contents) != null ? _b : "",
       onChange: (contents) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { contents }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     MultiStylePropertyPanel,
     {
       names: ["color", "backgroundColor", "fontFamily", "fontSize", "textAlign", "padding"],
@@ -3366,10 +3437,10 @@ function HtmlSidebarPanel({ data, setData }) {
 }
 function ImageLibraryDialog({ open, onClose, onPick }) {
   const { loadImages, deleteImage } = useImageCallbacks();
-  const [images, setImages] = React62.useState(null);
-  const [error, setError] = React62.useState(null);
-  const [query, setQuery] = React62.useState("");
-  const [busy, setBusy] = React62.useState(false);
+  const [images, setImages] = React57.useState(null);
+  const [error, setError] = React57.useState(null);
+  const [query, setQuery] = React57.useState("");
+  const [busy, setBusy] = React57.useState(false);
   const refresh = () => __async(null, null, function* () {
     if (!loadImages) return;
     setBusy(true);
@@ -3383,13 +3454,13 @@ function ImageLibraryDialog({ open, onClose, onPick }) {
       setBusy(false);
     }
   });
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     if (open) {
       setQuery("");
       void refresh();
     }
   }, [open]);
-  const filtered = React62.useMemo(() => {
+  const filtered = React57.useMemo(() => {
     if (!images) return null;
     const q = query.trim().toLowerCase();
     if (!q) return images;
@@ -3412,7 +3483,7 @@ function ImageLibraryDialog({ open, onClose, onPick }) {
       setBusy(false);
     }
   });
-  return /* @__PURE__ */ React62__default.default.createElement(material.Dialog, { open, onClose, maxWidth: "md", fullWidth: true }, /* @__PURE__ */ React62__default.default.createElement(material.DialogTitle, null, "Image library"), /* @__PURE__ */ React62__default.default.createElement(material.DialogContent, { dividers: true }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Dialog, { open, onClose, maxWidth: "md", fullWidth: true }, /* @__PURE__ */ React57__default.default.createElement(material.DialogTitle, null, "Image library"), /* @__PURE__ */ React57__default.default.createElement(material.DialogContent, { dividers: true }, /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       fullWidth: true,
@@ -3422,11 +3493,11 @@ function ImageLibraryDialog({ open, onClose, onPick }) {
       onChange: (e) => setQuery(e.target.value),
       autoFocus: true,
       InputProps: {
-        startAdornment: /* @__PURE__ */ React62__default.default.createElement(material.InputAdornment, { position: "start" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.SearchOutlined, { fontSize: "small" }))
+        startAdornment: /* @__PURE__ */ React57__default.default.createElement(material.InputAdornment, { position: "start" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.SearchOutlined, { fontSize: "small" }))
       },
       sx: { mb: 2 }
     }
-  ), error && /* @__PURE__ */ React62__default.default.createElement(material.Alert, { severity: "error", sx: { mb: 2 } }, error), busy && !images && /* @__PURE__ */ React62__default.default.createElement(material.Stack, { alignItems: "center", sx: { py: 4 } }, /* @__PURE__ */ React62__default.default.createElement(material.CircularProgress, { size: 28 })), filtered && filtered.length === 0 && /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "body2", sx: { color: "text.secondary", textAlign: "center", py: 4 } }, query ? "No images match your search." : "No images in the library yet."), filtered && filtered.length > 0 && /* @__PURE__ */ React62__default.default.createElement(
+  ), error && /* @__PURE__ */ React57__default.default.createElement(material.Alert, { severity: "error", sx: { mb: 2 } }, error), busy && !images && /* @__PURE__ */ React57__default.default.createElement(material.Stack, { alignItems: "center", sx: { py: 4 } }, /* @__PURE__ */ React57__default.default.createElement(material.CircularProgress, { size: 28 })), filtered && filtered.length === 0 && /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "body2", sx: { color: "text.secondary", textAlign: "center", py: 4 } }, query ? "No images match your search." : "No images in the library yet."), filtered && filtered.length > 0 && /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       sx: {
@@ -3435,7 +3506,7 @@ function ImageLibraryDialog({ open, onClose, onPick }) {
         gap: 1.5
       }
     },
-    filtered.map((img) => /* @__PURE__ */ React62__default.default.createElement(
+    filtered.map((img) => /* @__PURE__ */ React57__default.default.createElement(
       ImageTile,
       {
         key: img.url,
@@ -3444,7 +3515,7 @@ function ImageLibraryDialog({ open, onClose, onPick }) {
         onDelete: deleteImage ? () => handleDelete(img.url) : void 0
       }
     ))
-  )), /* @__PURE__ */ React62__default.default.createElement(material.DialogActions, null, /* @__PURE__ */ React62__default.default.createElement(material.Button, { onClick: onClose }, "Close")));
+  )), /* @__PURE__ */ React57__default.default.createElement(material.DialogActions, null, /* @__PURE__ */ React57__default.default.createElement(material.Button, { onClick: onClose }, "Close")));
 }
 function ImageTile({
   image,
@@ -3454,7 +3525,7 @@ function ImageTile({
   var _a, _b;
   const src = (_a = image.thumbnailUrl) != null ? _a : image.url;
   const label = image.alt || image.url.split("/").pop() || "image";
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       sx: {
@@ -3470,7 +3541,7 @@ function ImageTile({
       },
       onClick: onPick
     },
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       material.Box,
       {
         component: "img",
@@ -3479,8 +3550,8 @@ function ImageTile({
         sx: { display: "block", width: "100%", aspectRatio: "1 / 1", objectFit: "cover", backgroundColor: "#f5f5f5" }
       }
     ),
-    /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { p: 0.75, fontSize: 11, color: "text.secondary", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, label),
-    onDelete && /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Delete from library" }, /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { p: 0.75, fontSize: 11, color: "text.secondary", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, label),
+    onDelete && /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Delete from library" }, /* @__PURE__ */ React57__default.default.createElement(
       material.IconButton,
       {
         size: "small",
@@ -3500,7 +3571,7 @@ function ImageTile({
         },
         "aria-label": "Delete image"
       },
-      /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.DeleteOutline, { fontSize: "small" })
+      /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.DeleteOutline, { fontSize: "small" })
     ))
   );
 }
@@ -3512,12 +3583,12 @@ function isHttpUrl(value) {
 }
 function ImageSidebarPanel({ data, setData }) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const { uploadImage, loadImages } = useImageCallbacks();
-  const fileInputRef = React62.useRef(null);
-  const [uploading, setUploading] = React62.useState(false);
-  const [uploadError, setUploadError] = React62.useState(null);
-  const [libraryOpen, setLibraryOpen] = React62.useState(false);
+  const fileInputRef = React57.useRef(null);
+  const [uploading, setUploading] = React57.useState(false);
+  const [uploadError, setUploadError] = React57.useState(null);
+  const [libraryOpen, setLibraryOpen] = React57.useState(false);
   const updateData = (d) => {
     const res = ImagePropsSchema.safeParse(d);
     if (res.success) {
@@ -3553,13 +3624,13 @@ function ImageSidebarPanel({ data, setData }) {
   });
   const url = (_b = (_a = data.props) == null ? void 0 : _a.url) != null ? _b : "";
   const showHttpWarning = isHttpUrl(url);
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Image block" }, (uploadImage || loadImages) && /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 1 }, uploadImage && /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Image block" }, (uploadImage || loadImages) && /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 1 }, uploadImage && /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(
     material.Button,
     {
       fullWidth: true,
       variant: "outlined",
       size: "small",
-      startIcon: uploading ? /* @__PURE__ */ React62__default.default.createElement(material.CircularProgress, { size: 14 }) : /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.CloudUploadOutlined, { fontSize: "small" }),
+      startIcon: uploading ? /* @__PURE__ */ React57__default.default.createElement(material.CircularProgress, { size: 14 }) : /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.CloudUploadOutlined, { fontSize: "small" }),
       disabled: uploading,
       onClick: () => {
         var _a2;
@@ -3567,7 +3638,7 @@ function ImageSidebarPanel({ data, setData }) {
       }
     },
     uploading ? "Uploading\u2026" : "Upload"
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     "input",
     {
       ref: fileInputRef,
@@ -3581,17 +3652,17 @@ function ImageSidebarPanel({ data, setData }) {
         if (file) yield handleFile(file);
       })
     }
-  )), loadImages && /* @__PURE__ */ React62__default.default.createElement(
+  )), loadImages && /* @__PURE__ */ React57__default.default.createElement(
     material.Button,
     {
       fullWidth: true,
       variant: "outlined",
       size: "small",
-      startIcon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.CollectionsOutlined, { fontSize: "small" }),
+      startIcon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.CollectionsOutlined, { fontSize: "small" }),
       onClick: () => setLibraryOpen(true)
     },
     "Library"
-  )), uploadError && /* @__PURE__ */ React62__default.default.createElement(material.Alert, { severity: "error", onClose: () => setUploadError(null), sx: { mt: 1 } }, uploadError), /* @__PURE__ */ React62__default.default.createElement(
+  )), uploadError && /* @__PURE__ */ React57__default.default.createElement(material.Alert, { severity: "error", onClose: () => setUploadError(null), sx: { mt: 1 } }, uploadError), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Source URL",
@@ -3601,14 +3672,14 @@ function ImageSidebarPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { url: next }) }));
       }
     }
-  ), showHttpWarning && /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { mt: -1, mb: 1, display: "flex", alignItems: "flex-start", gap: 0.75 } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ErrorOutlineOutlined, { fontSize: "small", sx: { color: "warning.main", mt: "2px" } }), /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { fontSize: 12, color: "warning.dark" } }, "Non-HTTPS URL: Gmail and other clients strip mixed content. Use https:// for reliable delivery.")), /* @__PURE__ */ React62__default.default.createElement(
+  ), showHttpWarning && /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { mt: -1, mb: 1, display: "flex", alignItems: "flex-start", gap: 0.75 } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ErrorOutlineOutlined, { fontSize: "small", sx: { color: "warning.main", mt: "2px" } }), /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { fontSize: 12, color: "warning.dark" } }, "Non-HTTPS URL: Gmail and other clients strip mixed content. Use https:// for reliable delivery.")), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Alt text",
       defaultValue: (_d = (_c = data.props) == null ? void 0 : _c.alt) != null ? _d : "",
       onChange: (alt) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { alt }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Click through URL",
@@ -3618,38 +3689,38 @@ function ImageSidebarPanel({ data, setData }) {
         updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { linkHref }) }));
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 2 }, /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 2 }, /* @__PURE__ */ React57__default.default.createElement(
     TextDimensionInput,
     {
       label: "Width",
       defaultValue: (_g = data.props) == null ? void 0 : _g.width,
       onChange: (width) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { width }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextDimensionInput,
     {
       label: "Height",
       defaultValue: (_h = data.props) == null ? void 0 : _h.height,
       onChange: (height) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { height }) }))
     }
-  )), /* @__PURE__ */ React62__default.default.createElement(
+  )), /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label: "Alignment",
       defaultValue: (_j = (_i = data.props) == null ? void 0 : _i.contentAlignment) != null ? _j : "middle",
       onChange: (contentAlignment) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { contentAlignment }) }))
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "top" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.VerticalAlignTopOutlined, { fontSize: "small" })),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "middle" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.VerticalAlignCenterOutlined, { fontSize: "small" })),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "bottom" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.VerticalAlignBottomOutlined, { fontSize: "small" }))
-  ), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "top" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.VerticalAlignTopOutlined, { fontSize: "small" })),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "middle" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.VerticalAlignCenterOutlined, { fontSize: "small" })),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "bottom" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.VerticalAlignBottomOutlined, { fontSize: "small" }))
+  ), /* @__PURE__ */ React57__default.default.createElement(
     MultiStylePropertyPanel,
     {
       names: ["backgroundColor", "textAlign", "padding"],
       value: data.style,
       onChange: (style) => updateData(__spreadProps(__spreadValues({}, data), { style }))
     }
-  ), loadImages && /* @__PURE__ */ React62__default.default.createElement(
+  ), loadImages && /* @__PURE__ */ React57__default.default.createElement(
     ImageLibraryDialog,
     {
       open: libraryOpen,
@@ -3663,7 +3734,7 @@ function ImageSidebarPanel({ data, setData }) {
 }
 function SignatureSidebarPanel({ data, setData }) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = SignaturePropsSchema.safeParse(d);
     if (res.success) {
@@ -3688,74 +3759,74 @@ function SignatureSidebarPanel({ data, setData }) {
   const nameColor = (_z = (_y = data.props) == null ? void 0 : _y.nameColor) != null ? _z : SignaturePropsDefaults.nameColor;
   const textColor = (_B = (_A = data.props) == null ? void 0 : _A.textColor) != null ? _B : SignaturePropsDefaults.textColor;
   const linkColor = (_D = (_C = data.props) == null ? void 0 : _C.linkColor) != null ? _D : SignaturePropsDefaults.linkColor;
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Signature block" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Signature block" }, /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Greeting",
       defaultValue: greeting,
       onChange: (greeting2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { greeting: greeting2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Name",
       defaultValue: name,
       onChange: (name2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { name: name2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Title",
       defaultValue: title,
       onChange: (title2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { title: title2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Company",
       defaultValue: company,
       onChange: (company2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { company: company2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Address",
       defaultValue: address,
       onChange: (address2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { address: address2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Email",
       defaultValue: email,
       onChange: (email2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { email: email2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Phone",
       defaultValue: phone,
       onChange: (phone2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { phone: phone2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Website",
       defaultValue: website,
       onChange: (website2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { website: website2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Image URL",
       defaultValue: imageUrl,
       onChange: (imageUrl2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { imageUrl: imageUrl2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     SliderInput,
     {
       label: "Image size",
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AspectRatioOutlined, { sx: { color: "text.secondary" } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AspectRatioOutlined, { sx: { color: "text.secondary" } }),
       units: "px",
       step: 4,
       min: 32,
@@ -3763,47 +3834,47 @@ function SignatureSidebarPanel({ data, setData }) {
       defaultValue: imageSize,
       onChange: (imageSize2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { imageSize: imageSize2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label: "Image shape",
       defaultValue: imageShape,
       onChange: (imageShape2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { imageShape: imageShape2 }) }))
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "circle" }, "Circle"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "square" }, "Square"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "rounded" }, "Rounded")
-  ), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "circle" }, "Circle"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "square" }, "Square"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "rounded" }, "Rounded")
+  ), /* @__PURE__ */ React57__default.default.createElement(
     RadioGroupInput,
     {
       label: "Layout",
       defaultValue: layout,
       onChange: (layout2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { layout: layout2 }) }))
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "horizontal" }, "Horizontal"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "vertical" }, "Vertical")
-  ), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "horizontal" }, "Horizontal"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "vertical" }, "Vertical")
+  ), /* @__PURE__ */ React57__default.default.createElement(
     ColorInput2,
     {
       label: "Name color",
       defaultValue: nameColor,
       onChange: (nameColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { nameColor: nameColor2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     ColorInput2,
     {
       label: "Text color",
       defaultValue: textColor,
       onChange: (textColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { textColor: textColor2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     ColorInput2,
     {
       label: "Link color",
       defaultValue: linkColor,
       onChange: (linkColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { linkColor: linkColor2 }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     MultiStylePropertyPanel,
     {
       names: ["backgroundColor", "fontFamily", "padding"],
@@ -3814,7 +3885,7 @@ function SignatureSidebarPanel({ data, setData }) {
 }
 function SpacerSidebarPanel({ data, setData }) {
   var _a, _b;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = SpacerPropsSchema.safeParse(d);
     if (res.success) {
@@ -3824,11 +3895,11 @@ function SpacerSidebarPanel({ data, setData }) {
       setErrors(res.error);
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Spacer block" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Spacer block" }, /* @__PURE__ */ React57__default.default.createElement(
     SliderInput,
     {
       label: "Height",
-      iconLabel: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.HeightOutlined, { sx: { color: "text.secondary" } }),
+      iconLabel: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.HeightOutlined, { sx: { color: "text.secondary" } }),
       units: "px",
       step: 4,
       min: 4,
@@ -3840,7 +3911,7 @@ function SpacerSidebarPanel({ data, setData }) {
 }
 function TextSidebarPanel({ data, setData }) {
   var _a, _b, _c, _d;
-  const [, setErrors] = React62.useState(null);
+  const [, setErrors] = React57.useState(null);
   const updateData = (d) => {
     const res = TextPropsSchema.safeParse(d);
     if (res.success) {
@@ -3850,7 +3921,7 @@ function TextSidebarPanel({ data, setData }) {
       setErrors(res.error);
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Text block" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Text block" }, /* @__PURE__ */ React57__default.default.createElement(
     TextInput,
     {
       label: "Content",
@@ -3858,14 +3929,14 @@ function TextSidebarPanel({ data, setData }) {
       defaultValue: (_b = (_a = data.props) == null ? void 0 : _a.text) != null ? _b : "",
       onChange: (text) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { text }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     BooleanInput,
     {
       label: "Markdown",
       defaultValue: (_d = (_c = data.props) == null ? void 0 : _c.markdown) != null ? _d : false,
       onChange: (markdown) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { markdown }) }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     MultiStylePropertyPanel,
     {
       names: [
@@ -3887,7 +3958,7 @@ function TextSidebarPanel({ data, setData }) {
 
 // src/app/inspector-drawer/configuration-panel/index.tsx
 function renderMessage(val) {
-  return /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { m: 3, p: 1, border: "1px dashed", borderColor: "divider" } }, /* @__PURE__ */ React62__default.default.createElement(material.Typography, { color: "text.secondary" }, val));
+  return /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { m: 3, p: 1, border: "1px dashed", borderColor: "divider" } }, /* @__PURE__ */ React57__default.default.createElement(material.Typography, { color: "text.secondary" }, val));
 }
 function ConfigurationPanel() {
   const document2 = useDocument();
@@ -3903,55 +3974,55 @@ function ConfigurationPanel() {
   const { data, type } = block;
   switch (type) {
     case "Avatar":
-      return /* @__PURE__ */ React62__default.default.createElement(AvatarSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(AvatarSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "Button":
-      return /* @__PURE__ */ React62__default.default.createElement(ButtonSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(ButtonSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "ColumnsContainer":
-      return /* @__PURE__ */ React62__default.default.createElement(ColumnsContainerPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(ColumnsContainerPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "Container":
-      return /* @__PURE__ */ React62__default.default.createElement(ContainerSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(ContainerSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "Divider":
-      return /* @__PURE__ */ React62__default.default.createElement(DividerSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(DividerSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "Heading":
-      return /* @__PURE__ */ React62__default.default.createElement(HeadingSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(HeadingSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "Html":
-      return /* @__PURE__ */ React62__default.default.createElement(HtmlSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(HtmlSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "Image":
-      return /* @__PURE__ */ React62__default.default.createElement(ImageSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(ImageSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "EmailLayout":
-      return /* @__PURE__ */ React62__default.default.createElement(EmailLayoutSidebarFields, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(EmailLayoutSidebarFields, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "Spacer":
-      return /* @__PURE__ */ React62__default.default.createElement(SpacerSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(SpacerSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "Signature":
-      return /* @__PURE__ */ React62__default.default.createElement(SignatureSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(SignatureSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     case "Text":
-      return /* @__PURE__ */ React62__default.default.createElement(TextSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
+      return /* @__PURE__ */ React57__default.default.createElement(TextSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
     default:
-      return /* @__PURE__ */ React62__default.default.createElement("pre", null, JSON.stringify(block, null, "  "));
+      return /* @__PURE__ */ React57__default.default.createElement("pre", null, JSON.stringify(block, null, "  "));
   }
 }
 function StylesPanel() {
   const block = useDocument().root;
   if (!block) {
-    return /* @__PURE__ */ React62__default.default.createElement("p", null, "Block not found");
+    return /* @__PURE__ */ React57__default.default.createElement("p", null, "Block not found");
   }
   const { data, type } = block;
   if (type !== "EmailLayout") {
     throw new Error('Expected "root" element to be of type EmailLayout');
   }
-  return /* @__PURE__ */ React62__default.default.createElement(EmailLayoutSidebarFields, { key: "root", data, setData: (data2) => setDocument({ root: { type, data: data2 } }) });
+  return /* @__PURE__ */ React57__default.default.createElement(EmailLayoutSidebarFields, { key: "root", data, setData: (data2) => setDocument({ root: { type, data: data2 } }) });
 }
 function TemplateDownloadButton() {
   const doc = useDocument();
-  const href = React62.useMemo(() => {
+  const href = React57.useMemo(() => {
     return `data:text/plain,${encodeURIComponent(JSON.stringify(doc, null, "  "))}`;
   }, [doc]);
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Button,
     {
       variant: "outlined",
       color: "primary",
-      startIcon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.FileDownloadOutlined, null),
+      startIcon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.FileDownloadOutlined, null),
       href,
       download: "emailTemplate.json",
       fullWidth: true
@@ -3961,8 +4032,18 @@ function TemplateDownloadButton() {
 }
 
 // src/app/inspector-drawer/template-panel.tsx
-function TemplatePanel({ deleteTemplate, copyTemplate }) {
-  const { currentTemplateId, currentTemplateName } = useEmailEditor();
+function TemplatePanel({
+  deleteTemplate,
+  copyTemplate,
+  renameTemplate
+}) {
+  const {
+    currentTemplateId,
+    currentTemplateName,
+    currentTemplateTags,
+    setCurrentTemplate,
+    setCurrentTemplateTags
+  } = useEmailEditor();
   const document2 = useDocument();
   const persistenceEnabled = usePersistenceEnabled();
   const workspaceBackground = useWorkspaceBackground();
@@ -3983,7 +4064,7 @@ function TemplatePanel({ deleteTemplate, copyTemplate }) {
       window.alert("Template copied successfully!");
     }
   };
-  const workspaceToggle = /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Editor appearance" }, /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 1 }, /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.secondary" } }, "Workspace background"), /* @__PURE__ */ React62__default.default.createElement(
+  const workspaceToggle = /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Editor appearance" }, /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 1 }, /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.secondary" } }, "Workspace background"), /* @__PURE__ */ React57__default.default.createElement(
     material.ToggleButtonGroup,
     {
       value: workspaceBackground,
@@ -3991,13 +4072,27 @@ function TemplatePanel({ deleteTemplate, copyTemplate }) {
       size: "small",
       onChange: (_, v) => v && setWorkspaceBackground(v)
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "checkerboard", sx: { textTransform: "none", gap: 0.75 } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.GridOnOutlined, { fontSize: "small" }), "Checkerboard"),
-    /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "solid", sx: { textTransform: "none", gap: 0.75 } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.SquareOutlined, { fontSize: "small" }), "Solid")
-  ), /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.disabled" } }, "Editor-only \u2014 never reaches the rendered email.")));
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "checkerboard", sx: { textTransform: "none", gap: 0.75 } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.GridOnOutlined, { fontSize: "small" }), "Checkerboard"),
+    /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "solid", sx: { textTransform: "none", gap: 0.75 } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.SquareOutlined, { fontSize: "small" }), "Solid")
+  ), /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.disabled" } }, "Editor-only \u2014 never reaches the rendered email.")));
   if (!currentTemplateId) {
-    return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Template" }, "No template selected"), workspaceToggle);
+    return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Template" }, "No template selected"), workspaceToggle);
   }
-  return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Template" }, /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 2 }, !persistenceEnabled && /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Details" }, /* @__PURE__ */ React57__default.default.createElement(
+    DetailsEditor,
+    {
+      templateId: currentTemplateId,
+      currentName: currentTemplateName != null ? currentTemplateName : "",
+      currentTags: currentTemplateTags,
+      canEdit: Boolean(renameTemplate),
+      onSave: (name, tags) => __async(null, null, function* () {
+        if (!renameTemplate) return;
+        yield renameTemplate(currentTemplateId, name, { tags });
+        setCurrentTemplate(currentTemplateId, name);
+        setCurrentTemplateTags(tags);
+      })
+    }
+  )), /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Template" }, /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 2 }, !persistenceEnabled && /* @__PURE__ */ React57__default.default.createElement(
     material.Typography,
     {
       variant: "body2",
@@ -4010,29 +4105,127 @@ function TemplatePanel({ deleteTemplate, copyTemplate }) {
       }
     },
     "Save functionality is disabled. To enable saving, provide the necessary callback functions."
-  ), persistenceEnabled && /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(
+  ), persistenceEnabled && /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(
     material.Button,
     {
       variant: "outlined",
       color: "primary",
-      startIcon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ContentCopyOutlined, null),
+      startIcon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ContentCopyOutlined, null),
       onClick: handleCopyToSamples,
       fullWidth: true,
       disabled: !copyTemplate
     },
     "Save as Sample Template"
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     material.Button,
     {
       variant: "outlined",
       color: "error",
-      startIcon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.DeleteOutlined, null),
+      startIcon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.DeleteOutlined, null),
       onClick: handleDelete,
       fullWidth: true,
       disabled: !deleteTemplate
     },
     "Delete Template"
-  )))), persistenceEnabled && /* @__PURE__ */ React62__default.default.createElement(BaseSidebarPanel, { title: "Export" }, /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 2 }, /* @__PURE__ */ React62__default.default.createElement(TemplateDownloadButton, null))), workspaceToggle);
+  )))), persistenceEnabled && /* @__PURE__ */ React57__default.default.createElement(BaseSidebarPanel, { title: "Export" }, /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 2 }, /* @__PURE__ */ React57__default.default.createElement(TemplateDownloadButton, null))), workspaceToggle);
+}
+function DetailsEditor({ templateId, currentName, currentTags, canEdit, onSave }) {
+  const [name, setName] = React57.useState(currentName);
+  const [tags, setTags] = React57.useState(currentTags);
+  const [tagInput, setTagInput] = React57.useState("");
+  const [saving, setSaving] = React57.useState(false);
+  const [justSaved, setJustSaved] = React57.useState(false);
+  React57.useEffect(() => {
+    setName(currentName);
+  }, [templateId, currentName]);
+  React57.useEffect(() => {
+    setTags(currentTags);
+  }, [templateId, currentTags.join("
")]);
+  const addTag = () => {
+    const trimmed = tagInput.trim();
+    if (!trimmed) return;
+    if (tags.some((t2) => t2.toLowerCase() === trimmed.toLowerCase())) {
+      setTagInput("");
+      return;
+    }
+    setTags([...tags, trimmed]);
+    setTagInput("");
+  };
+  const removeTag = (tag) => setTags(tags.filter((t2) => t2 !== tag));
+  const dirty = name !== currentName || tags.length !== currentTags.length || tags.some((t2, i) => t2 !== currentTags[i]);
+  const handleSave = () => __async(null, null, function* () {
+    if (!canEdit || !dirty || !name.trim()) return;
+    setSaving(true);
+    try {
+      yield onSave(name.trim(), tags);
+      setJustSaved(true);
+      window.setTimeout(() => setJustSaved(false), 1600);
+    } finally {
+      setSaving(false);
+    }
+  });
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 1.5 }, /* @__PURE__ */ React57__default.default.createElement(
+    material.TextField,
+    {
+      size: "small",
+      label: "Name",
+      value: name,
+      onChange: (e) => setName(e.target.value),
+      disabled: !canEdit || saving,
+      fullWidth: true
+    }
+  ), /* @__PURE__ */ React57__default.default.createElement(material.Box, null, /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mb: 0.5 } }, "Tags"), tags.length > 0 ? /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 0.5, sx: { flexWrap: "wrap", gap: 0.5, mb: 1 } }, tags.map((tag) => /* @__PURE__ */ React57__default.default.createElement(
+    material.Chip,
+    {
+      key: tag,
+      label: tag,
+      size: "small",
+      onDelete: canEdit && !saving ? () => removeTag(tag) : void 0
+    }
+  ))) : /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.disabled", display: "block", mb: 1 } }, "No tags. Suggested: ", /* @__PURE__ */ React57__default.default.createElement("i", null, "transactional"), ", ", /* @__PURE__ */ React57__default.default.createElement("i", null, "marketing"), "."), /* @__PURE__ */ React57__default.default.createElement(
+    material.TextField,
+    {
+      size: "small",
+      fullWidth: true,
+      placeholder: "Add a tag",
+      value: tagInput,
+      onChange: (e) => setTagInput(e.target.value),
+      disabled: !canEdit || saving,
+      onKeyDown: (e) => {
+        if (e.key === "Enter" || e.key === ",") {
+          e.preventDefault();
+          addTag();
+        } else if (e.key === "Backspace" && !tagInput && tags.length > 0) {
+          e.preventDefault();
+          removeTag(tags[tags.length - 1]);
+        }
+      },
+      InputProps: {
+        endAdornment: /* @__PURE__ */ React57__default.default.createElement(material.InputAdornment, { position: "end" }, /* @__PURE__ */ React57__default.default.createElement(
+          material.Button,
+          {
+            size: "small",
+            onClick: addTag,
+            disabled: !canEdit || saving || !tagInput.trim(),
+            startIcon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" }),
+            sx: { textTransform: "none" }
+          },
+          "Add"
+        ))
+      }
+    }
+  )), /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: canEdit ? "" : "Wire a renameTemplate callback to enable editing from here", placement: "top" }, /* @__PURE__ */ React57__default.default.createElement("span", null, /* @__PURE__ */ React57__default.default.createElement(
+    material.Button,
+    {
+      variant: "contained",
+      size: "small",
+      fullWidth: true,
+      onClick: handleSave,
+      disabled: !canEdit || saving || !dirty || !name.trim(),
+      startIcon: justSaved ? /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.CheckOutlined, { fontSize: "small" }) : null
+    },
+    saving ? "Saving\u2026" : justSaved ? "Saved" : "Save details"
+  ))));
 }
 
 // src/app/variables/variable-utils.ts
@@ -4206,7 +4399,7 @@ function VariablesPanel() {
   const lastFocused = useLastFocusedEditable();
   const root = document2.root;
   if (!root || root.type !== "EmailLayout") {
-    return /* @__PURE__ */ React62__default.default.createElement(material.Box, { p: 2 }, /* @__PURE__ */ React62__default.default.createElement(material.Alert, { severity: "info" }, "Open a template to manage variables."));
+    return /* @__PURE__ */ React57__default.default.createElement(material.Box, { p: 2 }, /* @__PURE__ */ React57__default.default.createElement(material.Alert, { severity: "info" }, "Open a template to manage variables."));
   }
   const data = root.data;
   const variables = ((_a = data.variables) != null ? _a : []).map((v) => {
@@ -4217,9 +4410,9 @@ function VariablesPanel() {
       sampleValue: (_b = v.sampleValue) != null ? _b : ""
     };
   });
-  const usage = React62.useMemo(() => collectTokenUsage(document2), [document2]);
-  const declaredNames = React62.useMemo(() => new Set(variables.map((v) => v.name)), [variables]);
-  const undeclared = React62.useMemo(
+  const usage = React57.useMemo(() => collectTokenUsage(document2), [document2]);
+  const declaredNames = React57.useMemo(() => new Set(variables.map((v) => v.name)), [variables]);
+  const undeclared = React57.useMemo(
     () => [...usage.keys()].filter((n) => n && !declaredNames.has(n)),
     [usage, declaredNames]
   );
@@ -4301,7 +4494,7 @@ function VariablesPanel() {
     } catch (e) {
     }
   });
-  return /* @__PURE__ */ React62__default.default.createElement(material.Box, { p: 2 }, /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", sx: { mb: 1 } }, /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "subtitle1", sx: { fontWeight: 600 } }, "Variables"), /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Add variable" }, /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { size: "small", onClick: add, "aria-label": "Add variable" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" })))), /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mb: 2 } }, "Declared variables travel with the template. Reference them in subject and body as", " ", /* @__PURE__ */ React62__default.default.createElement(material.Box, { component: "code", sx: { fontFamily: "monospace" } }, "{{name}}"), ". In Preview mode, tokens render with the sample values below."), undeclared.length > 0 && /* @__PURE__ */ React62__default.default.createElement(material.Alert, { severity: "warning", sx: { mb: 2 } }, /* @__PURE__ */ React62__default.default.createElement(material.AlertTitle, { sx: { fontSize: 13 } }, "Undeclared in body"), /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 0.5, useFlexGap: true, flexWrap: "wrap" }, undeclared.map((name) => /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Box, { p: 2 }, /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", sx: { mb: 1 } }, /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "subtitle1", sx: { fontWeight: 600 } }, "Variables"), /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Add variable" }, /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { size: "small", onClick: add, "aria-label": "Add variable" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" })))), /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mb: 2 } }, "Declared variables travel with the template. Reference them in subject and body as", " ", /* @__PURE__ */ React57__default.default.createElement(material.Box, { component: "code", sx: { fontFamily: "monospace" } }, "{{name}}"), ". In Preview mode, tokens render with the sample values below."), undeclared.length > 0 && /* @__PURE__ */ React57__default.default.createElement(material.Alert, { severity: "warning", sx: { mb: 2 } }, /* @__PURE__ */ React57__default.default.createElement(material.AlertTitle, { sx: { fontSize: 13 } }, "Undeclared in body"), /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 0.5, useFlexGap: true, flexWrap: "wrap" }, undeclared.map((name) => /* @__PURE__ */ React57__default.default.createElement(
     material.Chip,
     {
       key: name,
@@ -4309,12 +4502,12 @@ function VariablesPanel() {
       label: name,
       onClick: () => addFromToken(name),
       onDelete: () => addFromToken(name),
-      deleteIcon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AddOutlined, null),
+      deleteIcon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AddOutlined, null),
       sx: { fontFamily: "monospace" }
     }
-  ))), /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mt: 0.5 } }, "Click a token to declare it.")), variables.length === 0 ? /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "body2", sx: { color: "text.secondary" } }, "No variables declared. Click + to add one.") : /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 2 }, variables.map((v, i) => {
+  ))), /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mt: 0.5 } }, "Click a token to declare it.")), variables.length === 0 ? /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "body2", sx: { color: "text.secondary" } }, "No variables declared. Click + to add one.") : /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 2 }, variables.map((v, i) => {
     var _a2;
-    return /* @__PURE__ */ React62__default.default.createElement(
+    return /* @__PURE__ */ React57__default.default.createElement(
       VariableRow,
       {
         key: i,
@@ -4347,9 +4540,9 @@ function VariableRow({
   onCopy
 }) {
   var _a, _b;
-  const [draftName, setDraftName] = React62.useState(variable.name);
-  const [isEditing, setIsEditing] = React62.useState(false);
-  React62.useEffect(() => {
+  const [draftName, setDraftName] = React57.useState(variable.name);
+  const [isEditing, setIsEditing] = React57.useState(false);
+  React57.useEffect(() => {
     if (!isEditing) setDraftName(variable.name);
   }, [variable.name, isEditing]);
   const nameError = validateVariableName(draftName, siblings, index);
@@ -4365,7 +4558,7 @@ function VariableRow({
       onCommitRename(draftName.trim());
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 0.75, sx: { pb: 1, borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 0.75, sx: { pb: 1, borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       label: "Name",
@@ -4390,7 +4583,7 @@ function VariableRow({
       error: Boolean(nameError),
       helperText: nameError != null ? nameError : " "
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 0.25, sx: { mt: 0.5 } }, /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Copy {{name}}" }, /* @__PURE__ */ React62__default.default.createElement("span", null, /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 0.25, sx: { mt: 0.5 } }, /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Copy {{name}}" }, /* @__PURE__ */ React57__default.default.createElement("span", null, /* @__PURE__ */ React57__default.default.createElement(
     material.IconButton,
     {
       size: "small",
@@ -4398,8 +4591,8 @@ function VariableRow({
       disabled: !hasName,
       "aria-label": `Copy ${variable.name || "variable"} token`
     },
-    /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ContentCopyOutlined, { fontSize: "small" })
-  ))), /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: canInsert ? "Insert at cursor" : "Focus a text field first" }, /* @__PURE__ */ React62__default.default.createElement("span", null, /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ContentCopyOutlined, { fontSize: "small" })
+  ))), /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: canInsert ? "Insert at cursor" : "Focus a text field first" }, /* @__PURE__ */ React57__default.default.createElement("span", null, /* @__PURE__ */ React57__default.default.createElement(
     material.IconButton,
     {
       size: "small",
@@ -4407,16 +4600,16 @@ function VariableRow({
       disabled: !hasName || !canInsert,
       "aria-label": `Insert ${variable.name || "variable"} at cursor`
     },
-    /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.InputOutlined, { fontSize: "small" })
-  ))), /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Remove" }, /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.InputOutlined, { fontSize: "small" })
+  ))), /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Remove" }, /* @__PURE__ */ React57__default.default.createElement(
     material.IconButton,
     {
       size: "small",
       onClick: onRemove,
       "aria-label": `Remove ${variable.name || "variable"}`
     },
-    /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.DeleteOutline, { fontSize: "small" })
-  )))), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.DeleteOutline, { fontSize: "small" })
+  )))), /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       label: "Description",
@@ -4426,7 +4619,7 @@ function VariableRow({
       onChange: (e) => onChangeDescription(e.target.value),
       placeholder: "Optional"
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       label: "Sample value",
@@ -4436,7 +4629,7 @@ function VariableRow({
       onChange: (e) => onChangeSampleValue(e.target.value),
       placeholder: "Shown in Preview mode",
       InputProps: {
-        startAdornment: /* @__PURE__ */ React62__default.default.createElement(
+        startAdornment: /* @__PURE__ */ React57__default.default.createElement(
           iconsMaterial.DataObjectOutlined,
           {
             fontSize: "small",
@@ -4445,7 +4638,7 @@ function VariableRow({
         )
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 0.5, sx: { pt: 0.25 } }, hasName && (unused ? /* @__PURE__ */ React62__default.default.createElement(material.Chip, { size: "small", color: "warning", variant: "outlined", label: "Unused in body" }) : /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 0.5, sx: { pt: 0.25 } }, hasName && (unused ? /* @__PURE__ */ React57__default.default.createElement(material.Chip, { size: "small", color: "warning", variant: "outlined", label: "Unused in body" }) : /* @__PURE__ */ React57__default.default.createElement(
     material.Chip,
     {
       size: "small",
@@ -4462,6 +4655,7 @@ function InspectorDrawer({
   exitDuration = 225,
   deleteTemplate,
   copyTemplate,
+  renameTemplate,
   savingEnabled = true
 } = {}) {
   const selectedSidebarTab = useSelectedSidebarTab();
@@ -4469,22 +4663,23 @@ function InspectorDrawer({
   const renderCurrentSidebarPanel = () => {
     switch (selectedSidebarTab) {
       case "block-configuration":
-        return /* @__PURE__ */ React62__default.default.createElement(ConfigurationPanel, null);
+        return /* @__PURE__ */ React57__default.default.createElement(ConfigurationPanel, null);
       case "styles":
-        return /* @__PURE__ */ React62__default.default.createElement(StylesPanel, null);
+        return /* @__PURE__ */ React57__default.default.createElement(StylesPanel, null);
       case "variables":
-        return /* @__PURE__ */ React62__default.default.createElement(VariablesPanel, null);
+        return /* @__PURE__ */ React57__default.default.createElement(VariablesPanel, null);
       case "template-settings":
-        return /* @__PURE__ */ React62__default.default.createElement(
+        return /* @__PURE__ */ React57__default.default.createElement(
           TemplatePanel,
           {
             deleteTemplate,
-            copyTemplate
+            copyTemplate,
+            renameTemplate
           }
         );
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Drawer,
     {
       variant: "persistent",
@@ -4506,7 +4701,7 @@ function InspectorDrawer({
         width: inspectorDrawerOpen ? INSPECTOR_DRAWER_WIDTH : 0
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { width: INSPECTOR_DRAWER_WIDTH, height: 49, borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React62__default.default.createElement(material.Box, { px: 1 }, /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { width: INSPECTOR_DRAWER_WIDTH, height: 49, borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React57__default.default.createElement(material.Box, { px: 1 }, /* @__PURE__ */ React57__default.default.createElement(
       material.Tabs,
       {
         value: selectedSidebarTab,
@@ -4514,25 +4709,25 @@ function InspectorDrawer({
         variant: "fullWidth",
         sx: { "& .MuiTab-root": { minWidth: 0, px: 1, fontSize: 13 } }
       },
-      /* @__PURE__ */ React62__default.default.createElement(material.Tab, { value: "styles", label: "Styles" }),
-      /* @__PURE__ */ React62__default.default.createElement(material.Tab, { value: "block-configuration", label: "Inspect" }),
-      /* @__PURE__ */ React62__default.default.createElement(material.Tab, { value: "variables", label: "Variables" }),
-      /* @__PURE__ */ React62__default.default.createElement(material.Tab, { value: "template-settings", label: "Settings" })
+      /* @__PURE__ */ React57__default.default.createElement(material.Tab, { value: "styles", label: "Styles" }),
+      /* @__PURE__ */ React57__default.default.createElement(material.Tab, { value: "block-configuration", label: "Inspect" }),
+      /* @__PURE__ */ React57__default.default.createElement(material.Tab, { value: "variables", label: "Variables" }),
+      /* @__PURE__ */ React57__default.default.createElement(material.Tab, { value: "template-settings", label: "Settings" })
     ))),
-    /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { width: INSPECTOR_DRAWER_WIDTH, height: "calc(100% - 49px)", overflow: "auto" } }, renderCurrentSidebarPanel())
+    /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { width: INSPECTOR_DRAWER_WIDTH, height: "calc(100% - 49px)", overflow: "auto" } }, renderCurrentSidebarPanel())
   );
 }
-var SnackbarContext = React62.createContext(null);
+var SnackbarContext = React57.createContext(null);
 function useSnackbar() {
-  const context = React62.useContext(SnackbarContext);
+  const context = React57.useContext(SnackbarContext);
   if (!context) {
     throw new Error("useSnackbar must be used within a SnackbarProvider");
   }
   return context;
 }
 function SnackbarProvider({ children }) {
-  const [message, setMessage] = React62.useState(null);
-  const [duration, setDuration] = React62.useState(3e3);
+  const [message, setMessage] = React57.useState(null);
+  const [duration, setDuration] = React57.useState(3e3);
   const showMessage = (text, customDuration = 3e3) => {
     setMessage(text);
     setDuration(customDuration);
@@ -4540,7 +4735,7 @@ function SnackbarProvider({ children }) {
   const handleClose = () => {
     setMessage(null);
   };
-  return /* @__PURE__ */ React62__default.default.createElement(SnackbarContext.Provider, { value: { showMessage } }, children, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(SnackbarContext.Provider, { value: { showMessage } }, children, /* @__PURE__ */ React57__default.default.createElement(
     material.Snackbar,
     {
       anchorOrigin: { vertical: "top", horizontal: "center" },
@@ -4587,8 +4782,8 @@ function TemplateRow({
   onDuplicateAsTemplate
 }) {
   const { setCurrentTemplate } = useEmailEditor();
-  const [hover, setHover] = React62.useState(false);
-  const [menuAnchor, setMenuAnchor] = React62.useState(null);
+  const [hover, setHover] = React57.useState(false);
+  const [menuAnchor, setMenuAnchor] = React57.useState(null);
   const closeMenu = () => setMenuAnchor(null);
   const openMenu = (e) => {
     e.stopPropagation();
@@ -4599,11 +4794,12 @@ function TemplateRow({
     fn == null ? void 0 : fn();
   };
   const handleClick = () => __async(null, null, function* () {
+    var _a;
     try {
       const content = yield templateLoader();
       if (content) {
         resetDocument(content);
-        setCurrentTemplate(template.id, template.slug, template.kind);
+        setCurrentTemplate(template.id, template.slug, template.kind, (_a = template.tags) != null ? _a : []);
       }
     } catch (error) {
       console.error("Error loading template:", error);
@@ -4616,7 +4812,7 @@ function TemplateRow({
   const hasActions = Boolean(
     onDuplicate || onRename || onDelete || onPromote || onDemote || onDuplicateAsTemplate
   );
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       role: "button",
@@ -4642,7 +4838,7 @@ function TemplateRow({
         "&:focus-visible": { outline: "2px solid", outlineColor: "primary.main" }
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", alignItems: "flex-start", spacing: 1 }, /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { flexGrow: 1, minWidth: 0, pr: hasActions ? 3 : 0 } }, /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", alignItems: "baseline", spacing: 1, sx: { minWidth: 0 } }, /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", alignItems: "flex-start", spacing: 1 }, /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { flexGrow: 1, minWidth: 0, pr: hasActions ? 3 : 0 } }, /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", alignItems: "baseline", spacing: 1, sx: { minWidth: 0 } }, /* @__PURE__ */ React57__default.default.createElement(
       material.Typography,
       {
         variant: "body2",
@@ -4656,14 +4852,14 @@ function TemplateRow({
         title: template.slug
       },
       template.slug
-    ), updated && !hasActions && /* @__PURE__ */ React62__default.default.createElement(
+    ), updated && !hasActions && /* @__PURE__ */ React57__default.default.createElement(
       material.Typography,
       {
         variant: "caption",
         sx: { color: "text.secondary", flexShrink: 0, fontSize: "0.7rem" }
       },
       updated
-    )), template.description && /* @__PURE__ */ React62__default.default.createElement(
+    )), template.description && /* @__PURE__ */ React57__default.default.createElement(
       material.Typography,
       {
         variant: "caption",
@@ -4677,7 +4873,7 @@ function TemplateRow({
         }
       },
       template.description
-    ), template.tags && template.tags.length > 0 && /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 0.5, sx: { mt: 0.5, flexWrap: "wrap", gap: 0.5 } }, template.tags.map((tag) => /* @__PURE__ */ React62__default.default.createElement(
+    ), template.tags && template.tags.length > 0 && /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 0.5, sx: { mt: 0.5, flexWrap: "wrap", gap: 0.5 } }, template.tags.map((tag) => /* @__PURE__ */ React57__default.default.createElement(
       material.Chip,
       {
         key: tag,
@@ -4686,7 +4882,7 @@ function TemplateRow({
         sx: { height: 18, fontSize: "0.65rem", "& .MuiChip-label": { px: 0.75 } }
       }
     ))))),
-    hasActions && /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "More" }, /* @__PURE__ */ React62__default.default.createElement(
+    hasActions && /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "More" }, /* @__PURE__ */ React57__default.default.createElement(
       material.IconButton,
       {
         size: "small",
@@ -4702,8 +4898,8 @@ function TemplateRow({
           transition: "opacity 120ms"
         }
       },
-      /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.MoreVertOutlined, { fontSize: "small" })
-    )), /* @__PURE__ */ React62__default.default.createElement(
+      /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.MoreVertOutlined, { fontSize: "small" })
+    )), /* @__PURE__ */ React57__default.default.createElement(
       material.Menu,
       {
         anchorEl: menuAnchor,
@@ -4714,14 +4910,14 @@ function TemplateRow({
         transformOrigin: { vertical: "top", horizontal: "right" },
         slotProps: { paper: { sx: { minWidth: 200 } } }
       },
-      onRename && /* @__PURE__ */ React62__default.default.createElement(material.MenuItem, { onClick: runAction(onRename) }, /* @__PURE__ */ React62__default.default.createElement(material.ListItemIcon, null, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.DriveFileRenameOutlineOutlined, { fontSize: "small" })), /* @__PURE__ */ React62__default.default.createElement(material.ListItemText, null, "Edit name & tags\u2026")),
-      onDuplicate && /* @__PURE__ */ React62__default.default.createElement(material.MenuItem, { onClick: runAction(onDuplicate) }, /* @__PURE__ */ React62__default.default.createElement(material.ListItemIcon, null, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ContentCopyOutlined, { fontSize: "small" })), /* @__PURE__ */ React62__default.default.createElement(material.ListItemText, null, "Duplicate")),
-      onDuplicateAsTemplate && /* @__PURE__ */ React62__default.default.createElement(material.MenuItem, { onClick: runAction(onDuplicateAsTemplate) }, /* @__PURE__ */ React62__default.default.createElement(material.ListItemIcon, null, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.LibraryAddOutlined, { fontSize: "small" })), /* @__PURE__ */ React62__default.default.createElement(material.ListItemText, null, "Duplicate as template")),
-      onPromote && /* @__PURE__ */ React62__default.default.createElement(material.MenuItem, { onClick: runAction(onPromote) }, /* @__PURE__ */ React62__default.default.createElement(material.ListItemIcon, null, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.FileUploadOutlined, { fontSize: "small" })), /* @__PURE__ */ React62__default.default.createElement(material.ListItemText, null, "Promote to sample")),
-      onDemote && /* @__PURE__ */ React62__default.default.createElement(material.MenuItem, { onClick: runAction(onDemote) }, /* @__PURE__ */ React62__default.default.createElement(material.ListItemIcon, null, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.FileDownloadOutlined, { fontSize: "small" })), /* @__PURE__ */ React62__default.default.createElement(material.ListItemText, null, "Demote to template")),
+      onRename && /* @__PURE__ */ React57__default.default.createElement(material.MenuItem, { onClick: runAction(onRename) }, /* @__PURE__ */ React57__default.default.createElement(material.ListItemIcon, null, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.DriveFileRenameOutlineOutlined, { fontSize: "small" })), /* @__PURE__ */ React57__default.default.createElement(material.ListItemText, null, "Edit name & tags\u2026")),
+      onDuplicate && /* @__PURE__ */ React57__default.default.createElement(material.MenuItem, { onClick: runAction(onDuplicate) }, /* @__PURE__ */ React57__default.default.createElement(material.ListItemIcon, null, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ContentCopyOutlined, { fontSize: "small" })), /* @__PURE__ */ React57__default.default.createElement(material.ListItemText, null, "Duplicate")),
+      onDuplicateAsTemplate && /* @__PURE__ */ React57__default.default.createElement(material.MenuItem, { onClick: runAction(onDuplicateAsTemplate) }, /* @__PURE__ */ React57__default.default.createElement(material.ListItemIcon, null, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.LibraryAddOutlined, { fontSize: "small" })), /* @__PURE__ */ React57__default.default.createElement(material.ListItemText, null, "Duplicate as template")),
+      onPromote && /* @__PURE__ */ React57__default.default.createElement(material.MenuItem, { onClick: runAction(onPromote) }, /* @__PURE__ */ React57__default.default.createElement(material.ListItemIcon, null, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.FileUploadOutlined, { fontSize: "small" })), /* @__PURE__ */ React57__default.default.createElement(material.ListItemText, null, "Promote to sample")),
+      onDemote && /* @__PURE__ */ React57__default.default.createElement(material.MenuItem, { onClick: runAction(onDemote) }, /* @__PURE__ */ React57__default.default.createElement(material.ListItemIcon, null, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.FileDownloadOutlined, { fontSize: "small" })), /* @__PURE__ */ React57__default.default.createElement(material.ListItemText, null, "Demote to template")),
       onDelete && [
-        /* @__PURE__ */ React62__default.default.createElement(material.Divider, { key: "divider" }),
-        /* @__PURE__ */ React62__default.default.createElement(material.MenuItem, { key: "delete", onClick: runAction(onDelete), sx: { color: "error.main" } }, /* @__PURE__ */ React62__default.default.createElement(material.ListItemIcon, { sx: { color: "error.main" } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.DeleteOutlined, { fontSize: "small" })), /* @__PURE__ */ React62__default.default.createElement(material.ListItemText, null, "Delete"))
+        /* @__PURE__ */ React57__default.default.createElement(material.Divider, { key: "divider" }),
+        /* @__PURE__ */ React57__default.default.createElement(material.MenuItem, { key: "delete", onClick: runAction(onDelete), sx: { color: "error.main" } }, /* @__PURE__ */ React57__default.default.createElement(material.ListItemIcon, { sx: { color: "error.main" } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.DeleteOutlined, { fontSize: "small" })), /* @__PURE__ */ React57__default.default.createElement(material.ListItemText, null, "Delete"))
       ]
     ))
   );
@@ -4836,31 +5032,31 @@ var PREVIEW_MAX = 36;
 function iconForType(type) {
   switch (type) {
     case "EmailLayout":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.DashboardOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.DashboardOutlined, { fontSize: "small" });
     case "Heading":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.HMobiledataOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.HMobiledataOutlined, { fontSize: "small" });
     case "Text":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.NotesOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.NotesOutlined, { fontSize: "small" });
     case "Button":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.SmartButtonOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.SmartButtonOutlined, { fontSize: "small" });
     case "Image":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ImageOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ImageOutlined, { fontSize: "small" });
     case "Avatar":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AccountCircleOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AccountCircleOutlined, { fontSize: "small" });
     case "Signature":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ContactMailOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ContactMailOutlined, { fontSize: "small" });
     case "Divider":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.HorizontalRuleOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.HorizontalRuleOutlined, { fontSize: "small" });
     case "Spacer":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.Crop32Outlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.Crop32Outlined, { fontSize: "small" });
     case "Html":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.HtmlOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.HtmlOutlined, { fontSize: "small" });
     case "Container":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.LibraryAddOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.LibraryAddOutlined, { fontSize: "small" });
     case "ColumnsContainer":
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ViewColumnOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ViewColumnOutlined, { fontSize: "small" });
     default:
-      return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.BusinessOutlined, { fontSize: "small" });
+      return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.BusinessOutlined, { fontSize: "small" });
   }
 }
 function previewText(text) {
@@ -4938,7 +5134,7 @@ function buildNode(id, doc, ctx) {
           id: `${id}::col${colIdx}`,
           label: `Column ${colIdx + 1}`,
           preview: colChildren.length === 1 ? "1 child" : `${colChildren.length} children`,
-          icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ViewColumnSharp, { fontSize: "small", sx: { opacity: 0.6 } }),
+          icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ViewColumnSharp, { fontSize: "small", sx: { opacity: 0.6 } }),
           children: colChildren,
           containerChildrenRef: parentForCol
         });
@@ -4985,7 +5181,7 @@ var DRAG_MIME = "application/x-email-editor-block";
 function OutlinePanel() {
   const document2 = useDocument();
   const selectedBlockId = useSelectedBlockId();
-  const [dragging, setDragging] = React62.useState(null);
+  const [dragging, setDragging] = React57.useState(null);
   const tree = buildNode(ROOT_BLOCK_ID2, document2);
   const performMove = (payload, targetParent, targetIndex) => {
     const patch = buildMovePatch(
@@ -5000,7 +5196,7 @@ function OutlinePanel() {
       setSelectedBlockId(payload.sourceId);
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(material.Box, null, /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "subtitle2", component: "h2", sx: { fontWeight: "bold", mb: 0.5, px: 0.5 } }, "Outline"), /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "caption", sx: { display: "block", color: "text.secondary", px: 0.5, mb: 1 } }, "Click a row to select. Drag a row to reorder or move it into a container."), tree ? /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Box, null, /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "subtitle2", component: "h2", sx: { fontWeight: "bold", mb: 0.5, px: 0.5 } }, "Outline"), /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "caption", sx: { display: "block", color: "text.secondary", px: 0.5, mb: 1 } }, "Click a row to select. Drag a row to reorder or move it into a container."), tree ? /* @__PURE__ */ React57__default.default.createElement(
     OutlineRow,
     {
       node: tree,
@@ -5011,7 +5207,7 @@ function OutlinePanel() {
       setDragging,
       performMove
     }
-  ) : /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "body2", sx: { color: "text.secondary", px: 0.5 } }, "Nothing to outline."));
+  ) : /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "body2", sx: { color: "text.secondary", px: 0.5 } }, "Nothing to outline."));
 }
 function OutlineRow({
   node,
@@ -5022,8 +5218,8 @@ function OutlineRow({
   setDragging,
   performMove
 }) {
-  const [expanded, setExpanded] = React62.useState(true);
-  const [dropPos, setDropPos] = React62.useState(null);
+  const [expanded, setExpanded] = React57.useState(true);
+  const [dropPos, setDropPos] = React57.useState(null);
   const hasChildren = Boolean(node.children && node.children.length > 0);
   const isSelectable = !node.id.includes("::");
   const isSelected = isSelectable && selectedBlockId === node.id;
@@ -5097,7 +5293,7 @@ function OutlineRow({
     const patch = buildMovePatch(document2, node.id, node.parent, node.parent, nextIndex + (delta > 0 ? 1 : 0));
     if (patch) setDocument(patch);
   };
-  return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { position: "relative" } }, dropPos === "before" && /* @__PURE__ */ React62__default.default.createElement(DropLine, { depth }), /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { position: "relative" } }, dropPos === "before" && /* @__PURE__ */ React57__default.default.createElement(DropLine, { depth }), /* @__PURE__ */ React57__default.default.createElement(
     material.Stack,
     {
       direction: "row",
@@ -5130,7 +5326,7 @@ function OutlineRow({
         userSelect: "none"
       }
     },
-    hasChildren ? /* @__PURE__ */ React62__default.default.createElement(
+    hasChildren ? /* @__PURE__ */ React57__default.default.createElement(
       material.Box,
       {
         role: "button",
@@ -5141,9 +5337,9 @@ function OutlineRow({
         },
         sx: { display: "flex", alignItems: "center", cursor: "pointer" }
       },
-      expanded ? /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ExpandMore, { fontSize: "small" }) : /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ChevronRight, { fontSize: "small" })
-    ) : /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { width: 20 } }),
-    /* @__PURE__ */ React62__default.default.createElement(
+      expanded ? /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ExpandMore, { fontSize: "small" }) : /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ChevronRight, { fontSize: "small" })
+    ) : /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { width: 20 } }),
+    /* @__PURE__ */ React57__default.default.createElement(
       material.Box,
       {
         sx: {
@@ -5155,7 +5351,7 @@ function OutlineRow({
       },
       node.icon
     ),
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       material.Typography,
       {
         variant: "body2",
@@ -5167,7 +5363,7 @@ function OutlineRow({
       },
       node.label
     ),
-    node.preview && /* @__PURE__ */ React62__default.default.createElement(
+    node.preview && /* @__PURE__ */ React57__default.default.createElement(
       material.Typography,
       {
         variant: "body2",
@@ -5183,7 +5379,7 @@ function OutlineRow({
       "\u2014 ",
       node.preview
     ),
-    canMove && /* @__PURE__ */ React62__default.default.createElement(
+    canMove && /* @__PURE__ */ React57__default.default.createElement(
       material.Box,
       {
         className: "outline-move-btns",
@@ -5194,7 +5390,7 @@ function OutlineRow({
           transition: "opacity 120ms"
         }
       },
-      /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Move up" }, /* @__PURE__ */ React62__default.default.createElement("span", null, /* @__PURE__ */ React62__default.default.createElement(
+      /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Move up" }, /* @__PURE__ */ React57__default.default.createElement("span", null, /* @__PURE__ */ React57__default.default.createElement(
         material.IconButton,
         {
           size: "small",
@@ -5206,9 +5402,9 @@ function OutlineRow({
           "aria-label": `Move ${node.label} up`,
           sx: { p: 0.25 }
         },
-        /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.KeyboardArrowUp, { fontSize: "small" })
+        /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.KeyboardArrowUp, { fontSize: "small" })
       ))),
-      /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Move down" }, /* @__PURE__ */ React62__default.default.createElement("span", null, /* @__PURE__ */ React62__default.default.createElement(
+      /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Move down" }, /* @__PURE__ */ React57__default.default.createElement("span", null, /* @__PURE__ */ React57__default.default.createElement(
         material.IconButton,
         {
           size: "small",
@@ -5220,10 +5416,10 @@ function OutlineRow({
           "aria-label": `Move ${node.label} down`,
           sx: { p: 0.25 }
         },
-        /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.KeyboardArrowDown, { fontSize: "small" })
+        /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.KeyboardArrowDown, { fontSize: "small" })
       )))
     )
-  ), dropPos === "after" && /* @__PURE__ */ React62__default.default.createElement(DropLine, { depth })), hasChildren && expanded && /* @__PURE__ */ React62__default.default.createElement(material.Box, null, node.children.map((child) => /* @__PURE__ */ React62__default.default.createElement(
+  ), dropPos === "after" && /* @__PURE__ */ React57__default.default.createElement(DropLine, { depth })), hasChildren && expanded && /* @__PURE__ */ React57__default.default.createElement(material.Box, null, node.children.map((child) => /* @__PURE__ */ React57__default.default.createElement(
     OutlineRow,
     {
       key: child.id,
@@ -5238,7 +5434,7 @@ function OutlineRow({
   ))));
 }
 function DropLine({ depth }) {
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       sx: {
@@ -5246,7 +5442,7 @@ function DropLine({ depth }) {
         height: 0
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       material.Box,
       {
         sx: {
@@ -5272,11 +5468,11 @@ function NewTemplatePickerDialog({
   onClose,
   onCreate
 }) {
-  const [name, setName] = React62.useState("");
-  const [selectedStarter, setSelectedStarter] = React62.useState(null);
-  const [error, setError] = React62.useState(null);
-  const [busy, setBusy] = React62.useState(false);
-  React62.useEffect(() => {
+  const [name, setName] = React57.useState("");
+  const [selectedStarter, setSelectedStarter] = React57.useState(null);
+  const [error, setError] = React57.useState(null);
+  const [busy, setBusy] = React57.useState(false);
+  React57.useEffect(() => {
     if (open) {
       setName(defaultName != null ? defaultName : kind === "sample" ? "New sample" : "New template");
       setSelectedStarter(null);
@@ -5307,7 +5503,7 @@ function NewTemplatePickerDialog({
     }
   });
   const pickable = samples.filter((s) => s.id !== "empty-email");
-  return /* @__PURE__ */ React62__default.default.createElement(material.Dialog, { open, onClose: busy ? void 0 : onClose, maxWidth: "sm", fullWidth: true }, /* @__PURE__ */ React62__default.default.createElement(material.DialogTitle, null, kind === "sample" ? "New sample" : "New template"), /* @__PURE__ */ React62__default.default.createElement(material.DialogContent, { dividers: true }, /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "subtitle2", sx: { mb: 1 } }, "Start from"), /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Dialog, { open, onClose: busy ? void 0 : onClose, maxWidth: "sm", fullWidth: true }, /* @__PURE__ */ React57__default.default.createElement(material.DialogTitle, null, kind === "sample" ? "New sample" : "New template"), /* @__PURE__ */ React57__default.default.createElement(material.DialogContent, { dividers: true }, /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "subtitle2", sx: { mb: 1 } }, "Start from"), /* @__PURE__ */ React57__default.default.createElement(
     material.List,
     {
       dense: true,
@@ -5321,24 +5517,24 @@ function NewTemplatePickerDialog({
         overflowY: "auto"
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       material.ListItemButton,
       {
         selected: selectedStarter === null,
         onClick: () => setSelectedStarter(null)
       },
-      /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { display: "flex", alignItems: "center", gap: 1.5, flex: 1 } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.InsertDriveFileOutlined, { fontSize: "small", sx: { color: "text.secondary" } }), /* @__PURE__ */ React62__default.default.createElement(material.ListItemText, { primary: "Blank", secondary: "Start from an empty email" }))
+      /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { display: "flex", alignItems: "center", gap: 1.5, flex: 1 } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.InsertDriveFileOutlined, { fontSize: "small", sx: { color: "text.secondary" } }), /* @__PURE__ */ React57__default.default.createElement(material.ListItemText, { primary: "Blank", secondary: "Start from an empty email" }))
     ),
-    pickable.map((s) => /* @__PURE__ */ React62__default.default.createElement(
+    pickable.map((s) => /* @__PURE__ */ React57__default.default.createElement(
       material.ListItemButton,
       {
         key: s.id,
         selected: selectedStarter === s.id,
         onClick: () => setSelectedStarter(s.id)
       },
-      /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { display: "flex", alignItems: "center", gap: 1.5, flex: 1 } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.DescriptionOutlined, { fontSize: "small", sx: { color: "text.secondary" } }), /* @__PURE__ */ React62__default.default.createElement(material.ListItemText, { primary: s.slug, secondary: s.description }))
+      /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { display: "flex", alignItems: "center", gap: 1.5, flex: 1 } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.DescriptionOutlined, { fontSize: "small", sx: { color: "text.secondary" } }), /* @__PURE__ */ React57__default.default.createElement(material.ListItemText, { primary: s.slug, secondary: s.description }))
     ))
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       autoFocus: true,
@@ -5357,7 +5553,7 @@ function NewTemplatePickerDialog({
       helperText: error != null ? error : " ",
       disabled: busy
     }
-  )), /* @__PURE__ */ React62__default.default.createElement(material.DialogActions, null, /* @__PURE__ */ React62__default.default.createElement(material.Button, { onClick: onClose, disabled: busy }, "Cancel"), /* @__PURE__ */ React62__default.default.createElement(material.Button, { variant: "contained", onClick: handleCreate, disabled: busy }, busy ? "Creating\u2026" : `Create ${kind}`)));
+  )), /* @__PURE__ */ React57__default.default.createElement(material.DialogActions, null, /* @__PURE__ */ React57__default.default.createElement(material.Button, { onClick: onClose, disabled: busy }, "Cancel"), /* @__PURE__ */ React57__default.default.createElement(material.Button, { variant: "contained", onClick: handleCreate, disabled: busy }, busy ? "Creating\u2026" : `Create ${kind}`)));
 }
 function RenameDialog({
   open,
@@ -5367,12 +5563,12 @@ function RenameDialog({
   onClose,
   onSubmit
 }) {
-  const [slug, setSlug] = React62.useState(currentSlug);
-  const [tags, setTags] = React62.useState(currentTags);
-  const [tagInput, setTagInput] = React62.useState("");
-  const [error, setError] = React62.useState(null);
-  const [submitting, setSubmitting] = React62.useState(false);
-  React62.useEffect(() => {
+  const [slug, setSlug] = React57.useState(currentSlug);
+  const [tags, setTags] = React57.useState(currentTags);
+  const [tagInput, setTagInput] = React57.useState("");
+  const [error, setError] = React57.useState(null);
+  const [submitting, setSubmitting] = React57.useState(false);
+  React57.useEffect(() => {
     if (open) {
       setSlug(currentSlug);
       setTags(currentTags);
@@ -5384,15 +5580,15 @@ function RenameDialog({
   const addTag = () => {
     const trimmed = tagInput.trim();
     if (!trimmed) return;
-    if (tags.some((t) => t.toLowerCase() === trimmed.toLowerCase())) {
+    if (tags.some((t2) => t2.toLowerCase() === trimmed.toLowerCase())) {
       setTagInput("");
       return;
     }
     setTags([...tags, trimmed]);
     setTagInput("");
   };
-  const removeTag = (tag) => setTags(tags.filter((t) => t !== tag));
-  const tagsUnchanged = tags.length === currentTags.length && tags.every((t, i) => t === currentTags[i]);
+  const removeTag = (tag) => setTags(tags.filter((t2) => t2 !== tag));
+  const tagsUnchanged = tags.length === currentTags.length && tags.every((t2, i) => t2 === currentTags[i]);
   const handleSubmit = () => __async(null, null, function* () {
     const trimmedSlug = slug.trim();
     if (!trimmedSlug) {
@@ -5419,7 +5615,7 @@ function RenameDialog({
       setSubmitting(false);
     }
   });
-  return /* @__PURE__ */ React62__default.default.createElement(material.Dialog, { open, onClose: submitting ? void 0 : onClose, maxWidth: "sm", fullWidth: true }, /* @__PURE__ */ React62__default.default.createElement(material.DialogTitle, null, "Edit details"), /* @__PURE__ */ React62__default.default.createElement(material.DialogContent, null, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Dialog, { open, onClose: submitting ? void 0 : onClose, maxWidth: "sm", fullWidth: true }, /* @__PURE__ */ React57__default.default.createElement(material.DialogTitle, null, "Edit details"), /* @__PURE__ */ React57__default.default.createElement(material.DialogContent, null, /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       autoFocus: true,
@@ -5439,7 +5635,7 @@ function RenameDialog({
         if (e.key === "Enter" && !submitting) handleSubmit();
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mt: 1, mb: 0.5 } }, "Tags"), tags.length > 0 ? /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 0.5, sx: { flexWrap: "wrap", gap: 0.5, mb: 1 } }, tags.map((tag) => /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mt: 1, mb: 0.5 } }, "Tags"), tags.length > 0 ? /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 0.5, sx: { flexWrap: "wrap", gap: 0.5, mb: 1 } }, tags.map((tag) => /* @__PURE__ */ React57__default.default.createElement(
     material.Chip,
     {
       key: tag,
@@ -5447,7 +5643,7 @@ function RenameDialog({
       size: "small",
       onDelete: submitting ? void 0 : () => removeTag(tag)
     }
-  ))) : /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.disabled", display: "block", mb: 1 } }, "No tags yet. Suggested: ", /* @__PURE__ */ React62__default.default.createElement("i", null, "transactional"), ", ", /* @__PURE__ */ React62__default.default.createElement("i", null, "marketing"), "."), /* @__PURE__ */ React62__default.default.createElement(
+  ))) : /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "caption", sx: { color: "text.disabled", display: "block", mb: 1 } }, "No tags yet. Suggested: ", /* @__PURE__ */ React57__default.default.createElement("i", null, "transactional"), ", ", /* @__PURE__ */ React57__default.default.createElement("i", null, "marketing"), "."), /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       size: "small",
@@ -5466,20 +5662,20 @@ function RenameDialog({
         }
       },
       InputProps: {
-        endAdornment: /* @__PURE__ */ React62__default.default.createElement(material.InputAdornment, { position: "end" }, /* @__PURE__ */ React62__default.default.createElement(
+        endAdornment: /* @__PURE__ */ React57__default.default.createElement(material.InputAdornment, { position: "end" }, /* @__PURE__ */ React57__default.default.createElement(
           material.Button,
           {
             size: "small",
             onClick: addTag,
             disabled: !tagInput.trim() || submitting,
-            startIcon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" }),
+            startIcon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" }),
             sx: { textTransform: "none" }
           },
           "Add"
         ))
       }
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { minHeight: 8 } })), /* @__PURE__ */ React62__default.default.createElement(material.DialogActions, null, /* @__PURE__ */ React62__default.default.createElement(material.Button, { onClick: onClose, disabled: submitting }, "Cancel"), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { minHeight: 8 } })), /* @__PURE__ */ React57__default.default.createElement(material.DialogActions, null, /* @__PURE__ */ React57__default.default.createElement(material.Button, { onClick: onClose, disabled: submitting }, "Cancel"), /* @__PURE__ */ React57__default.default.createElement(
     material.Button,
     {
       onClick: handleSubmit,
@@ -5497,10 +5693,10 @@ function SaveTemplateDialog({
   defaultName = "",
   error: externalError = null
 }) {
-  const [templateName, setTemplateName] = React62.useState(defaultName);
-  const [internalError, setInternalError] = React62.useState("");
-  const [isSubmitting, setIsSubmitting] = React62.useState(false);
-  React62.useEffect(() => {
+  const [templateName, setTemplateName] = React57.useState(defaultName);
+  const [internalError, setInternalError] = React57.useState("");
+  const [isSubmitting, setIsSubmitting] = React57.useState(false);
+  React57.useEffect(() => {
     if (open) {
       setTemplateName(defaultName);
       setInternalError("");
@@ -5548,7 +5744,7 @@ function SaveTemplateDialog({
     setInternalError("");
     onClose();
   };
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Dialog,
     {
       open,
@@ -5556,8 +5752,8 @@ function SaveTemplateDialog({
       maxWidth: "sm",
       fullWidth: true
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.DialogTitle, null, "Save Email Template"),
-    /* @__PURE__ */ React62__default.default.createElement(material.DialogContent, null, /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { pt: 1 } }, /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.DialogTitle, null, "Save Email Template"),
+    /* @__PURE__ */ React57__default.default.createElement(material.DialogContent, null, /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { pt: 1 } }, /* @__PURE__ */ React57__default.default.createElement(
       material.TextField,
       {
         autoFocus: true,
@@ -5579,7 +5775,7 @@ function SaveTemplateDialog({
         disabled: isSubmitting
       }
     ))),
-    /* @__PURE__ */ React62__default.default.createElement(material.DialogActions, null, /* @__PURE__ */ React62__default.default.createElement(material.Button, { onClick: handleCancel, disabled: isSubmitting }, "Cancel"), /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.DialogActions, null, /* @__PURE__ */ React57__default.default.createElement(material.Button, { onClick: handleCancel, disabled: isSubmitting }, "Cancel"), /* @__PURE__ */ React57__default.default.createElement(
       material.Button,
       {
         onClick: handleSave,
@@ -5616,9 +5812,9 @@ var EMPTY_TEMPLATE = {
   description: "A blank email template to start from scratch"
 };
 var SORT_OPTIONS = [
-  { value: "updatedAt", label: "Last updated" },
-  { value: "createdAt", label: "Recently created" },
-  { value: "slug", label: "Name (A\u2013Z)" }
+  { value: "updatedAt", labelKey: "sort.last-updated", fallback: "Last updated" },
+  { value: "createdAt", labelKey: "sort.recently-created", fallback: "Recently created" },
+  { value: "slug", labelKey: "sort.name", fallback: "Name (A\u2013Z)" }
 ];
 function compareTemplates(a, b, key) {
   if (key === "slug") {
@@ -5649,19 +5845,19 @@ function SamplesDrawer({
   const samplesDrawerOpen = useSamplesDrawerOpen();
   const { setCurrentTemplate, loadTemplate: ctxLoadTemplate } = useEmailEditor();
   const { showMessage } = useSnackbar();
-  const [samples, setSamples] = React62.useState([EMPTY_TEMPLATE]);
-  const [templates, setTemplates] = React62.useState([]);
-  const [loadingSamples, setLoadingSamples] = React62.useState(false);
-  const [loadingTemplates, setLoadingTemplates] = React62.useState(false);
-  const [templatesError, setTemplatesError] = React62.useState(null);
-  const [activeLeftTab, setActiveLeftTab] = React62.useState("templates");
-  const [search, setSearch] = React62.useState("");
-  const [sortKey, setSortKey] = React62.useState("updatedAt");
-  const [activeTags, setActiveTags] = React62.useState([]);
-  const [renameTarget, setRenameTarget] = React62.useState(null);
-  const [pendingSaveAs, setPendingSaveAs] = React62.useState(null);
-  const [newError, setNewError] = React62.useState(null);
-  const [pickerKind, setPickerKind] = React62.useState(null);
+  const [samples, setSamples] = React57.useState([EMPTY_TEMPLATE]);
+  const [templates, setTemplates] = React57.useState([]);
+  const [loadingSamples, setLoadingSamples] = React57.useState(false);
+  const [loadingTemplates, setLoadingTemplates] = React57.useState(false);
+  const [templatesError, setTemplatesError] = React57.useState(null);
+  const [activeLeftTab, setActiveLeftTab] = React57.useState("templates");
+  const [search, setSearch] = React57.useState("");
+  const [sortKey, setSortKey] = React57.useState("updatedAt");
+  const [activeTags, setActiveTags] = React57.useState([]);
+  const [renameTarget, setRenameTarget] = React57.useState(null);
+  const [pendingSaveAs, setPendingSaveAs] = React57.useState(null);
+  const [newError, setNewError] = React57.useState(null);
+  const [pickerKind, setPickerKind] = React57.useState(null);
   const handleLoadTemplate = (templateId) => __async(null, null, function* () {
     if (templateId === "empty-email") {
       return empty_email_message_default;
@@ -5672,7 +5868,7 @@ function SamplesDrawer({
     return null;
   });
   const withKind = (items, fallback) => items.map((item) => item.kind ? item : __spreadProps(__spreadValues({}, item), { kind: fallback }));
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     if (!enabled || !samplesDrawerOpen || !loadSamples) return;
     setLoadingSamples(true);
     loadSamples().then((results) => {
@@ -5702,16 +5898,16 @@ function SamplesDrawer({
     const now = (/* @__PURE__ */ new Date()).toISOString();
     const row = { id, slug, kind, tags, createdAt: now, updatedAt: now };
     if (kind === "sample") {
-      setSamples((prev) => prev.some((t) => t.id === id) ? prev : [...prev, row]);
+      setSamples((prev) => prev.some((t2) => t2.id === id) ? prev : [...prev, row]);
     } else {
-      setTemplates((prev) => prev.some((t) => t.id === id) ? prev : [...prev, row]);
+      setTemplates((prev) => prev.some((t2) => t2.id === id) ? prev : [...prev, row]);
     }
   };
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     if (!enabled || !loadTemplates) return;
     refreshTemplates();
   }, [enabled, loadTemplates]);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     const handler = (e) => {
       const detail = e.detail;
       if (Array.isArray(detail)) setTemplates(withKind(detail, "template"));
@@ -5719,47 +5915,47 @@ function SamplesDrawer({
     window.addEventListener("templateListUpdated", handler);
     return () => window.removeEventListener("templateListUpdated", handler);
   }, []);
-  const { templateRows, sampleRows } = React62.useMemo(() => {
+  const { templateRows, sampleRows } = React57.useMemo(() => {
     const byId = /* @__PURE__ */ new Map();
     for (const s of samples) byId.set(s.id, s);
-    for (const t of templates) byId.set(t.id, t);
+    for (const t2 of templates) byId.set(t2.id, t2);
     const all = Array.from(byId.values());
     return {
-      templateRows: all.filter((t) => t.kind === "template"),
-      sampleRows: all.filter((t) => t.kind === "sample")
+      templateRows: all.filter((t2) => t2.kind === "template"),
+      sampleRows: all.filter((t2) => t2.kind === "sample")
     };
   }, [samples, templates]);
-  const allTags = React62.useMemo(() => {
+  const allTags = React57.useMemo(() => {
     var _a2, _b2;
     const set = /* @__PURE__ */ new Set();
-    for (const t of templateRows) (_a2 = t.tags) == null ? void 0 : _a2.forEach((tag) => set.add(tag));
+    for (const t2 of templateRows) (_a2 = t2.tags) == null ? void 0 : _a2.forEach((tag) => set.add(tag));
     for (const s of sampleRows) (_b2 = s.tags) == null ? void 0 : _b2.forEach((tag) => set.add(tag));
     return Array.from(set).sort();
   }, [templateRows, sampleRows]);
-  const matchesSearchAndTags = React62.useMemo(() => {
+  const matchesSearchAndTags = React57.useMemo(() => {
     const term = search.trim().toLowerCase();
-    return (t) => {
+    return (t2) => {
       if (term) {
-        const haystack = [t.slug, t.description, t.subject].filter(Boolean).join(" ").toLowerCase();
+        const haystack = [t2.slug, t2.description, t2.subject].filter(Boolean).join(" ").toLowerCase();
         if (!haystack.includes(term)) return false;
       }
       if (activeTags.length > 0) {
-        if (!t.tags || t.tags.length === 0) return false;
-        if (!activeTags.every((tag) => t.tags.includes(tag))) return false;
+        if (!t2.tags || t2.tags.length === 0) return false;
+        if (!activeTags.every((tag) => t2.tags.includes(tag))) return false;
       }
       return true;
     };
   }, [search, activeTags]);
-  const filteredTemplates = React62.useMemo(
+  const filteredTemplates = React57.useMemo(
     () => templateRows.filter(matchesSearchAndTags).slice().sort((a, b) => compareTemplates(a, b, sortKey)),
     [templateRows, matchesSearchAndTags, sortKey]
   );
-  const filteredSamples = React62.useMemo(
+  const filteredSamples = React57.useMemo(
     () => sampleRows.filter(matchesSearchAndTags).slice().sort((a, b) => compareTemplates(a, b, sortKey)),
     [sampleRows, matchesSearchAndTags, sortKey]
   );
   const toggleTag = (tag) => {
-    setActiveTags((prev) => prev.includes(tag) ? prev.filter((t) => t !== tag) : [...prev, tag]);
+    setActiveTags((prev) => prev.includes(tag) ? prev.filter((t2) => t2 !== tag) : [...prev, tag]);
   };
   const handleDuplicate = (template) => {
     if (!copyTemplate) return;
@@ -5785,22 +5981,21 @@ function SamplesDrawer({
     showMessage("Template deleted");
   };
   const handleRenameSubmit = (newSlug, opts) => __async(null, null, function* () {
+    var _a2, _b2;
     if (!renameTarget || !renameTemplate) return;
     yield renameTemplate(renameTarget.id, newSlug, opts);
-    const patch = (t) => {
-      var _a2;
-      return t.id === renameTarget.id ? __spreadProps(__spreadValues({}, t), { slug: newSlug, tags: (_a2 = opts == null ? void 0 : opts.tags) != null ? _a2 : t.tags }) : t;
-    };
+    const newTags = (_b2 = (_a2 = opts == null ? void 0 : opts.tags) != null ? _a2 : renameTarget.tags) != null ? _b2 : [];
+    const patch = (t2) => t2.id === renameTarget.id ? __spreadProps(__spreadValues({}, t2), { slug: newSlug, tags: newTags }) : t2;
     setTemplates((prev) => prev.map(patch));
     setSamples((prev) => prev.map(patch));
     if (currentTemplateId === renameTarget.id) {
-      setCurrentTemplate(renameTarget.id, newSlug);
+      setCurrentTemplate(renameTarget.id, newSlug, void 0, newTags);
     }
     showMessage("Details saved");
   });
   const flipKindLocally = (id, kind) => {
-    setTemplates((prev) => prev.map((t) => t.id === id ? __spreadProps(__spreadValues({}, t), { kind }) : t));
-    setSamples((prev) => prev.map((t) => t.id === id ? __spreadProps(__spreadValues({}, t), { kind }) : t));
+    setTemplates((prev) => prev.map((t2) => t2.id === id ? __spreadProps(__spreadValues({}, t2), { kind }) : t2));
+    setSamples((prev) => prev.map((t2) => t2.id === id ? __spreadProps(__spreadValues({}, t2), { kind }) : t2));
   };
   const handleSetKind = (template, kind) => {
     if (!setTemplateKind) return;
@@ -5837,7 +6032,7 @@ function SamplesDrawer({
   };
   const handleSaveAsSubmit = (templateName) => __async(null, null, function* () {
     if (!saveAs || !pendingSaveAs) return false;
-    const taken = templateRows.some((t) => t.slug.toLowerCase() === templateName.toLowerCase());
+    const taken = templateRows.some((t2) => t2.slug.toLowerCase() === templateName.toLowerCase());
     if (taken) {
       setNewError("A template with this name already exists");
       return false;
@@ -5900,8 +6095,8 @@ function SamplesDrawer({
   if (!enabled) {
     return null;
   }
-  const existingSlugs = templates.map((t) => t.slug);
-  return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(
+  const existingSlugs = templates.map((t2) => t2.slug);
+  return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(
     material.Drawer,
     {
       variant: "persistent",
@@ -5916,7 +6111,7 @@ function SamplesDrawer({
       transitionDuration: { enter: enterDuration, exit: exitDuration },
       sx: { width: samplesDrawerOpen ? SAMPLES_DRAWER_WIDTH : 0 }
     },
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       material.Stack,
       {
         py: 1,
@@ -5926,16 +6121,16 @@ function SamplesDrawer({
         spacing: 1.5,
         sx: { overflowY: "auto" }
       },
-      /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", sx: { pt: 1 } }, /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "h6", component: "h1" }, "Library"), saveAs && (activeLeftTab === "templates" || activeLeftTab === "samples") && /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: activeLeftTab === "samples" ? "New sample" : "New template" }, /* @__PURE__ */ React62__default.default.createElement(
+      /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", sx: { pt: 1 } }, /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "h6", component: "h1" }, /* @__PURE__ */ React57__default.default.createElement(react.Trans, { id: "drawer.library" }, "Library")), saveAs && (activeLeftTab === "templates" || activeLeftTab === "samples") && /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: activeLeftTab === "samples" ? t("drawer.new-sample", "New sample") : t("drawer.new-template", "New template") }, /* @__PURE__ */ React57__default.default.createElement(
         material.IconButton,
         {
           size: "small",
           onClick: () => openNewPicker(activeLeftTab === "samples" ? "sample" : "template"),
-          "aria-label": activeLeftTab === "samples" ? "New sample" : "New template"
+          "aria-label": activeLeftTab === "samples" ? t("drawer.new-sample", "New sample") : t("drawer.new-template", "New template")
         },
-        /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" })
+        /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" })
       ))),
-      /* @__PURE__ */ React62__default.default.createElement(
+      /* @__PURE__ */ React57__default.default.createElement(
         material.Tabs,
         {
           value: activeLeftTab,
@@ -5943,42 +6138,42 @@ function SamplesDrawer({
           variant: "fullWidth",
           sx: { minHeight: 36, "& .MuiTab-root": { minHeight: 36, minWidth: 0, px: 1, fontSize: 13 } }
         },
-        /* @__PURE__ */ React62__default.default.createElement(material.Tab, { value: "templates", label: "Templates", disabled: !loadTemplates }),
-        /* @__PURE__ */ React62__default.default.createElement(material.Tab, { value: "samples", label: "Samples" }),
-        /* @__PURE__ */ React62__default.default.createElement(material.Tab, { value: "outline", label: "Outline" })
+        /* @__PURE__ */ React57__default.default.createElement(material.Tab, { value: "templates", label: t("drawer.tab.templates", "Templates"), disabled: !loadTemplates }),
+        /* @__PURE__ */ React57__default.default.createElement(material.Tab, { value: "samples", label: t("drawer.tab.samples", "Samples") }),
+        /* @__PURE__ */ React57__default.default.createElement(material.Tab, { value: "outline", label: t("drawer.tab.outline", "Outline") })
       ),
-      activeLeftTab === "outline" ? /* @__PURE__ */ React62__default.default.createElement(OutlinePanel, null) : /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(
+      activeLeftTab === "outline" ? /* @__PURE__ */ React57__default.default.createElement(OutlinePanel, null) : /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(
         material.TextField,
         {
           size: "small",
-          placeholder: activeLeftTab === "templates" ? "Search templates" : "Search samples",
+          placeholder: activeLeftTab === "templates" ? t("drawer.search-templates", "Search templates") : t("drawer.search-samples", "Search samples"),
           value: search,
           onChange: (e) => setSearch(e.target.value),
           InputProps: {
-            startAdornment: /* @__PURE__ */ React62__default.default.createElement(material.InputAdornment, { position: "start" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.SearchOutlined, { fontSize: "small" }))
+            startAdornment: /* @__PURE__ */ React57__default.default.createElement(material.InputAdornment, { position: "start" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.SearchOutlined, { fontSize: "small" }))
           }
         }
-      ), /* @__PURE__ */ React62__default.default.createElement(
+      ), /* @__PURE__ */ React57__default.default.createElement(
         material.TextField,
         {
           select: true,
           size: "small",
-          label: "Sort by",
+          label: t("drawer.sort-by", "Sort by"),
           value: sortKey,
           onChange: (e) => setSortKey(e.target.value)
         },
-        SORT_OPTIONS.map((opt) => /* @__PURE__ */ React62__default.default.createElement(material.MenuItem, { key: opt.value, value: opt.value }, opt.label))
-      ), allTags.length > 0 && /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", sx: { flexWrap: "wrap", gap: 0.5 } }, /* @__PURE__ */ React62__default.default.createElement(
+        SORT_OPTIONS.map((opt) => /* @__PURE__ */ React57__default.default.createElement(material.MenuItem, { key: opt.value, value: opt.value }, t(opt.labelKey, opt.fallback)))
+      ), allTags.length > 0 && /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", sx: { flexWrap: "wrap", gap: 0.5 } }, /* @__PURE__ */ React57__default.default.createElement(
         material.Chip,
         {
-          label: "All",
+          label: t("drawer.tag.all", "All"),
           size: "small",
           clickable: true,
           color: activeTags.length === 0 ? "primary" : "default",
           variant: activeTags.length === 0 ? "filled" : "outlined",
           onClick: () => setActiveTags([])
         }
-      ), allTags.map((tag) => /* @__PURE__ */ React62__default.default.createElement(
+      ), allTags.map((tag) => /* @__PURE__ */ React57__default.default.createElement(
         material.Chip,
         {
           key: tag,
@@ -5989,7 +6184,7 @@ function SamplesDrawer({
           variant: activeTags.includes(tag) ? "filled" : "outlined",
           onClick: () => toggleTag(tag)
         }
-      ))), activeLeftTab === "templates" ? /* @__PURE__ */ React62__default.default.createElement(material.Box, null, loadingTemplates ? /* @__PURE__ */ React62__default.default.createElement(material.Stack, { alignItems: "center", width: "100%", py: 2 }, /* @__PURE__ */ React62__default.default.createElement(material.CircularProgress, { size: 24 })) : templatesError ? /* @__PURE__ */ React62__default.default.createElement(material.Alert, { severity: "error", sx: { my: 1 } }, templatesError) : filteredTemplates.length > 0 ? /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 0.25, sx: { width: "100%" } }, filteredTemplates.map((template) => /* @__PURE__ */ React62__default.default.createElement(
+      ))), activeLeftTab === "templates" ? /* @__PURE__ */ React57__default.default.createElement(material.Box, null, loadingTemplates ? /* @__PURE__ */ React57__default.default.createElement(material.Stack, { alignItems: "center", width: "100%", py: 2 }, /* @__PURE__ */ React57__default.default.createElement(material.CircularProgress, { size: 24 })) : templatesError ? /* @__PURE__ */ React57__default.default.createElement(material.Alert, { severity: "error", sx: { my: 1 } }, templatesError) : filteredTemplates.length > 0 ? /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 0.25, sx: { width: "100%" } }, filteredTemplates.map((template) => /* @__PURE__ */ React57__default.default.createElement(
         TemplateRow,
         {
           key: template.id,
@@ -6001,7 +6196,7 @@ function SamplesDrawer({
           onDelete: deleteTemplate ? () => handleDelete(template) : void 0,
           onPromote: setTemplateKind ? () => handleSetKind(template, "sample") : void 0
         }
-      ))) : /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "body2", sx: { color: "text.secondary", py: 1 } }, templateRows.length === 0 ? "No saved templates yet" : "No templates match your filters")) : /* @__PURE__ */ React62__default.default.createElement(material.Box, null, loadingSamples ? /* @__PURE__ */ React62__default.default.createElement(material.Stack, { alignItems: "center", width: "100%", py: 2 }, /* @__PURE__ */ React62__default.default.createElement(material.CircularProgress, { size: 24 })) : filteredSamples.length > 0 ? /* @__PURE__ */ React62__default.default.createElement(material.Stack, { spacing: 0.25, sx: { width: "100%" } }, filteredSamples.map((sample) => /* @__PURE__ */ React62__default.default.createElement(
+      ))) : /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "body2", sx: { color: "text.secondary", py: 1 } }, templateRows.length === 0 ? t("drawer.no-templates", "No saved templates yet") : t("drawer.no-templates-match", "No templates match your filters"))) : /* @__PURE__ */ React57__default.default.createElement(material.Box, null, loadingSamples ? /* @__PURE__ */ React57__default.default.createElement(material.Stack, { alignItems: "center", width: "100%", py: 2 }, /* @__PURE__ */ React57__default.default.createElement(material.CircularProgress, { size: 24 })) : filteredSamples.length > 0 ? /* @__PURE__ */ React57__default.default.createElement(material.Stack, { spacing: 0.25, sx: { width: "100%" } }, filteredSamples.map((sample) => /* @__PURE__ */ React57__default.default.createElement(
         TemplateRow,
         {
           key: sample.id,
@@ -6013,9 +6208,9 @@ function SamplesDrawer({
           onDelete: deleteTemplate ? () => handleDelete(sample) : void 0,
           onDemote: setTemplateKind ? () => handleSetKind(sample, "template") : void 0
         }
-      ))) : /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "body2", sx: { color: "text.secondary", py: 1 } }, sampleRows.length === 0 ? "No samples available" : "No samples match your filters")))
+      ))) : /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "body2", sx: { color: "text.secondary", py: 1 } }, sampleRows.length === 0 ? t("drawer.no-samples", "No samples available") : t("drawer.no-samples-match", "No samples match your filters"))))
     )
-  ), renameTarget && /* @__PURE__ */ React62__default.default.createElement(
+  ), renameTarget && /* @__PURE__ */ React57__default.default.createElement(
     RenameDialog,
     {
       open: !!renameTarget,
@@ -6025,7 +6220,7 @@ function SamplesDrawer({
       onClose: () => setRenameTarget(null),
       onSubmit: handleRenameSubmit
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     SaveTemplateDialog,
     {
       open: !!pendingSaveAs,
@@ -6038,13 +6233,13 @@ function SamplesDrawer({
       defaultName: (_b = pendingSaveAs == null ? void 0 : pendingSaveAs.defaultName) != null ? _b : "New Template",
       error: newError
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     NewTemplatePickerDialog,
     {
       open: pickerKind !== null,
       kind: pickerKind != null ? pickerKind : "template",
       samples: sampleRows,
-      existingSlugs: pickerKind === "sample" ? sampleRows.map((s) => s.slug) : templateRows.map((t) => t.slug),
+      existingSlugs: pickerKind === "sample" ? sampleRows.map((s) => s.slug) : templateRows.map((t2) => t2.slug),
       onClose: () => setPickerKind(null),
       onCreate: handleCreateFromPicker
     }
@@ -6062,7 +6257,7 @@ var ICON_SX = {
   borderColor: "cadet.300"
 };
 function BlockTypeButton({ label, icon, onClick }) {
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Button,
     {
       sx: BUTTON_SX2,
@@ -6071,14 +6266,14 @@ function BlockTypeButton({ label, icon, onClick }) {
         onClick();
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: ICON_SX }, icon),
-    /* @__PURE__ */ React62__default.default.createElement(material.Typography, { variant: "body2" }, label)
+    /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: ICON_SX }, icon),
+    /* @__PURE__ */ React57__default.default.createElement(material.Typography, { variant: "body2" }, label)
   );
 }
 var BUTTONS = [
   {
     label: "Heading",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.HMobiledataOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.HMobiledataOutlined, null),
     block: () => ({
       type: "Heading",
       data: {
@@ -6091,7 +6286,7 @@ var BUTTONS = [
   },
   {
     label: "Text",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.NotesOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.NotesOutlined, null),
     block: () => ({
       type: "Text",
       data: {
@@ -6105,7 +6300,7 @@ var BUTTONS = [
   },
   {
     label: "Button",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.SmartButtonOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.SmartButtonOutlined, null),
     block: () => ({
       type: "Button",
       data: {
@@ -6119,7 +6314,7 @@ var BUTTONS = [
   },
   {
     label: "Image",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ImageOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ImageOutlined, null),
     block: () => ({
       type: "Image",
       data: {
@@ -6135,7 +6330,7 @@ var BUTTONS = [
   },
   {
     label: "Avatar",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AccountCircleOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AccountCircleOutlined, null),
     block: () => ({
       type: "Avatar",
       data: {
@@ -6149,7 +6344,7 @@ var BUTTONS = [
   },
   {
     label: "Personal Signature",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ContactMailOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ContactMailOutlined, null),
     block: () => ({
       type: "Signature",
       data: {
@@ -6171,7 +6366,7 @@ var BUTTONS = [
   },
   {
     label: "Company Signature",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.BusinessOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.BusinessOutlined, null),
     block: () => ({
       type: "Signature",
       data: {
@@ -6191,7 +6386,7 @@ var BUTTONS = [
   },
   {
     label: "Divider",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.HorizontalRuleOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.HorizontalRuleOutlined, null),
     block: () => ({
       type: "Divider",
       data: {
@@ -6204,7 +6399,7 @@ var BUTTONS = [
   },
   {
     label: "Spacer",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.Crop32Outlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.Crop32Outlined, null),
     block: () => ({
       type: "Spacer",
       data: {}
@@ -6212,7 +6407,7 @@ var BUTTONS = [
   },
   {
     label: "Html",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.HtmlOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.HtmlOutlined, null),
     block: () => ({
       type: "Html",
       data: {
@@ -6227,7 +6422,7 @@ var BUTTONS = [
   },
   {
     label: "Columns",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ViewColumnOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ViewColumnOutlined, null),
     block: () => ({
       type: "ColumnsContainer",
       data: {
@@ -6242,7 +6437,7 @@ var BUTTONS = [
   },
   {
     label: "Container",
-    icon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.LibraryAddOutlined, null),
+    icon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.LibraryAddOutlined, null),
     block: () => ({
       type: "Container",
       data: {
@@ -6266,7 +6461,7 @@ function BlocksMenu({ anchorEl, setAnchorEl, onSelect }) {
   if (anchorEl === null) {
     return null;
   }
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Menu,
     {
       open: true,
@@ -6275,12 +6470,12 @@ function BlocksMenu({ anchorEl, setAnchorEl, onSelect }) {
       anchorOrigin: { vertical: "bottom", horizontal: "center" },
       transformOrigin: { vertical: "top", horizontal: "center" }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { p: 1, display: "grid", gridTemplateColumns: "1fr 1fr 1fr 1fr" } }, BUTTONS.map((k, i) => /* @__PURE__ */ React62__default.default.createElement(BlockTypeButton, { key: i, label: k.label, icon: k.icon, onClick: () => onClick(k.block()) })))
+    /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { p: 1, display: "grid", gridTemplateColumns: "1fr 1fr 1fr 1fr" } }, BUTTONS.map((k, i) => /* @__PURE__ */ React57__default.default.createElement(BlockTypeButton, { key: i, label: k.label, icon: k.icon, onClick: () => onClick(k.block()) })))
   );
 }
 function DividerButton({ buttonElement, onClick }) {
-  const [visible, setVisible] = React62.useState(false);
-  React62.useEffect(() => {
+  const [visible, setVisible] = React57.useState(false);
+  React57.useEffect(() => {
     function listener({ clientX, clientY }) {
       if (!buttonElement) {
         return;
@@ -6302,7 +6497,7 @@ function DividerButton({ buttonElement, onClick }) {
       window.removeEventListener("mousemove", listener);
     };
   }, [buttonElement, setVisible]);
-  return /* @__PURE__ */ React62__default.default.createElement(material.Fade, { in: visible }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Fade, { in: visible }, /* @__PURE__ */ React57__default.default.createElement(
     material.IconButton,
     {
       size: "small",
@@ -6325,11 +6520,11 @@ function DividerButton({ buttonElement, onClick }) {
         onClick();
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" })
+    /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AddOutlined, { fontSize: "small" })
   ));
 }
 function PlaceholderButton({ onClick }) {
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.ButtonBase,
     {
       onClick: (ev) => {
@@ -6345,7 +6540,7 @@ function PlaceholderButton({ onClick }) {
         bgcolor: "rgba(0,0,0, 0.05)"
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       iconsMaterial.AddOutlined,
       {
         sx: {
@@ -6362,29 +6557,29 @@ function PlaceholderButton({ onClick }) {
 
 // src/editor/blocks/helpers/editor-children-ids/add-block-menu/index.tsx
 function AddBlockButton({ onSelect, placeholder }) {
-  const [menuAnchorEl, setMenuAnchorEl] = React62.useState(null);
-  const [buttonElement, setButtonElement] = React62.useState(null);
+  const [menuAnchorEl, setMenuAnchorEl] = React57.useState(null);
+  const [buttonElement, setButtonElement] = React57.useState(null);
   const handleButtonClick = () => {
     setMenuAnchorEl(buttonElement);
   };
   const renderButton2 = () => {
     if (placeholder) {
-      return /* @__PURE__ */ React62__default.default.createElement(PlaceholderButton, { onClick: handleButtonClick });
+      return /* @__PURE__ */ React57__default.default.createElement(PlaceholderButton, { onClick: handleButtonClick });
     } else {
-      return /* @__PURE__ */ React62__default.default.createElement(DividerButton, { buttonElement, onClick: handleButtonClick });
+      return /* @__PURE__ */ React57__default.default.createElement(DividerButton, { buttonElement, onClick: handleButtonClick });
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement("div", { ref: setButtonElement, style: { position: "relative" } }, renderButton2()), /* @__PURE__ */ React62__default.default.createElement(BlocksMenu, { anchorEl: menuAnchorEl, setAnchorEl: setMenuAnchorEl, onSelect }));
+  return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement("div", { ref: setButtonElement, style: { position: "relative" } }, renderButton2()), /* @__PURE__ */ React57__default.default.createElement(BlocksMenu, { anchorEl: menuAnchorEl, setAnchorEl: setMenuAnchorEl, onSelect }));
 }
-var BlockParentContext = React62.createContext(null);
+var BlockParentContext = React57.createContext(null);
 function BlockParentProvider({
   info,
   children
 }) {
-  return /* @__PURE__ */ React62__default.default.createElement(BlockParentContext.Provider, { value: info }, children);
+  return /* @__PURE__ */ React57__default.default.createElement(BlockParentContext.Provider, { value: info }, children);
 }
 function useBlockParent() {
-  return React62.useContext(BlockParentContext);
+  return React57.useContext(BlockParentContext);
 }
 
 // src/editor/blocks/helpers/editor-children-ids/index.tsx
@@ -6411,9 +6606,9 @@ function EditorChildrenIds({ childrenIds, onChange, parentRef }) {
     });
   };
   if (!childrenIds || childrenIds.length === 0) {
-    return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(AddBlockButton, { placeholder: true, onSelect: appendBlock }), parentRef && /* @__PURE__ */ React62__default.default.createElement(CanvasDropZone, { parentRef, targetIndex: 0, placeholder: true }));
+    return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(AddBlockButton, { placeholder: true, onSelect: appendBlock }), parentRef && /* @__PURE__ */ React57__default.default.createElement(CanvasDropZone, { parentRef, targetIndex: 0, placeholder: true }));
   }
-  return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, childrenIds.map((childId, i) => /* @__PURE__ */ React62__default.default.createElement(React62.Fragment, { key: childId }, /* @__PURE__ */ React62__default.default.createElement(AddBlockButton, { onSelect: (block) => insertBlock(block, i) }), parentRef && /* @__PURE__ */ React62__default.default.createElement(CanvasDropZone, { parentRef, targetIndex: i }), parentRef ? /* @__PURE__ */ React62__default.default.createElement(BlockParentProvider, { info: { parent: parentRef, indexInParent: i } }, /* @__PURE__ */ React62__default.default.createElement(EditorBlock, { id: childId })) : /* @__PURE__ */ React62__default.default.createElement(EditorBlock, { id: childId }))), /* @__PURE__ */ React62__default.default.createElement(AddBlockButton, { onSelect: appendBlock }), parentRef && /* @__PURE__ */ React62__default.default.createElement(CanvasDropZone, { parentRef, targetIndex: childrenIds.length }));
+  return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, childrenIds.map((childId, i) => /* @__PURE__ */ React57__default.default.createElement(React57.Fragment, { key: childId }, /* @__PURE__ */ React57__default.default.createElement(AddBlockButton, { onSelect: (block) => insertBlock(block, i) }), parentRef && /* @__PURE__ */ React57__default.default.createElement(CanvasDropZone, { parentRef, targetIndex: i }), parentRef ? /* @__PURE__ */ React57__default.default.createElement(BlockParentProvider, { info: { parent: parentRef, indexInParent: i } }, /* @__PURE__ */ React57__default.default.createElement(EditorBlock, { id: childId })) : /* @__PURE__ */ React57__default.default.createElement(EditorBlock, { id: childId }))), /* @__PURE__ */ React57__default.default.createElement(AddBlockButton, { onSelect: appendBlock }), parentRef && /* @__PURE__ */ React57__default.default.createElement(CanvasDropZone, { parentRef, targetIndex: childrenIds.length }));
 }
 function CanvasDropZone({
   parentRef,
@@ -6422,7 +6617,7 @@ function CanvasDropZone({
 }) {
   const document2 = useDocument();
   const dragging = useDraggingBlock();
-  const [over, setOver] = React62.useState(false);
+  const [over, setOver] = React57.useState(false);
   if (!dragging) return null;
   if (isDescendant(document2, dragging.sourceId, parentRef.parentId)) return null;
   const handleDragOver = (e) => {
@@ -6450,7 +6645,7 @@ function CanvasDropZone({
     }
     setDraggingBlock(null);
   };
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       onDragOver: handleDragOver,
@@ -6493,13 +6688,13 @@ function ColumnsContainerEditor({ style, props }) {
     });
     setSelectedBlockId(blockId);
   };
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     columns_container_default,
     {
       props: restProps,
       style,
       columns: [
-        /* @__PURE__ */ React62__default.default.createElement(
+        /* @__PURE__ */ React57__default.default.createElement(
           EditorChildrenIds,
           {
             childrenIds: (_b = columns == null ? void 0 : columns[0]) == null ? void 0 : _b.childrenIds,
@@ -6507,7 +6702,7 @@ function ColumnsContainerEditor({ style, props }) {
             onChange: (change) => updateColumn(0, change)
           }
         ),
-        /* @__PURE__ */ React62__default.default.createElement(
+        /* @__PURE__ */ React57__default.default.createElement(
           EditorChildrenIds,
           {
             childrenIds: (_c = columns == null ? void 0 : columns[1]) == null ? void 0 : _c.childrenIds,
@@ -6515,7 +6710,7 @@ function ColumnsContainerEditor({ style, props }) {
             onChange: (change) => updateColumn(1, change)
           }
         ),
-        /* @__PURE__ */ React62__default.default.createElement(
+        /* @__PURE__ */ React57__default.default.createElement(
           EditorChildrenIds,
           {
             childrenIds: (_d = columns == null ? void 0 : columns[2]) == null ? void 0 : _d.childrenIds,
@@ -6532,7 +6727,7 @@ function ContainerEditor({ style, props }) {
   const childrenIds = (_a = props == null ? void 0 : props.childrenIds) != null ? _a : [];
   const document2 = useDocument();
   const currentBlockId = useCurrentBlockId();
-  return /* @__PURE__ */ React62__default.default.createElement(container_default, { style }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(container_default, { style }, /* @__PURE__ */ React57__default.default.createElement(
     EditorChildrenIds,
     {
       childrenIds,
@@ -6639,7 +6834,7 @@ function EmailLayoutEditor(props) {
   const document2 = useDocument();
   const currentBlockId = useCurrentBlockId();
   const selectedBlockId = useSelectedBlockId();
-  const handleDelete = React62.useCallback((e) => {
+  const handleDelete = React57.useCallback((e) => {
     var _a2, _b2, _c2;
     if (e.key !== "Delete" && e.key !== "Backspace") return;
     if (!selectedBlockId) return;
@@ -6670,7 +6865,7 @@ function EmailLayoutEditor(props) {
     delete nDocument[selectedBlockId];
     resetDocument(nDocument);
   }, [selectedBlockId, document2]);
-  const handleCopy = React62.useCallback((e) => {
+  const handleCopy = React57.useCallback((e) => {
     if (!(e.metaKey || e.ctrlKey) || e.key !== "c") return;
     if (!selectedBlockId) return;
     const target = e.target;
@@ -6683,7 +6878,7 @@ function EmailLayoutEditor(props) {
     const payload = JSON.stringify({ __emailEditorBlocks: true, rootBlockId: selectedBlockId, blocks });
     navigator.clipboard.writeText(payload);
   }, [selectedBlockId, document2]);
-  const handlePaste = React62.useCallback((e) => __async(null, null, function* () {
+  const handlePaste = React57.useCallback((e) => __async(null, null, function* () {
     var _a2;
     const target = e.target;
     if (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.isContentEditable) {
@@ -6714,7 +6909,7 @@ function EmailLayoutEditor(props) {
     resetDocument(doc);
     setSelectedBlockId(newRootId);
   }), [document2, childrenIds, selectedBlockId, currentBlockId]);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     window.addEventListener("keydown", handleDelete);
     window.addEventListener("keydown", handleCopy);
     window.addEventListener("paste", handlePaste);
@@ -6733,7 +6928,7 @@ function EmailLayoutEditor(props) {
     lineHeight: "1.5",
     margin: "0"
   };
-  const editorChildren = /* @__PURE__ */ React62__default.default.createElement(
+  const editorChildren = /* @__PURE__ */ React57__default.default.createElement(
     EditorChildrenIds,
     {
       childrenIds,
@@ -6761,7 +6956,7 @@ function EmailLayoutEditor(props) {
     boxShadow: "0 1px 2px rgba(33, 36, 67, 0.05), 0 8px 24px rgba(33, 36, 67, 0.08)"
   };
   if (props.backdropDisabled) {
-    return /* @__PURE__ */ React62__default.default.createElement(
+    return /* @__PURE__ */ React57__default.default.createElement(
       "div",
       {
         onClick: () => {
@@ -6774,7 +6969,7 @@ function EmailLayoutEditor(props) {
           minHeight: "100%"
         })
       },
-      /* @__PURE__ */ React62__default.default.createElement(
+      /* @__PURE__ */ React57__default.default.createElement(
         "div",
         {
           style: __spreadProps(__spreadValues({}, cardStyle), {
@@ -6782,11 +6977,11 @@ function EmailLayoutEditor(props) {
             padding: "32px"
           })
         },
-        /* @__PURE__ */ React62__default.default.createElement("div", { style: { maxWidth: "600px", margin: "0 auto" } }, editorChildren)
+        /* @__PURE__ */ React57__default.default.createElement("div", { style: { maxWidth: "600px", margin: "0 auto" } }, editorChildren)
       )
     );
   }
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     "div",
     {
       onClick: () => {
@@ -6799,7 +6994,7 @@ function EmailLayoutEditor(props) {
         minHeight: "100%"
       })
     },
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       "div",
       {
         style: __spreadProps(__spreadValues({}, cardStyle), {
@@ -6807,7 +7002,7 @@ function EmailLayoutEditor(props) {
           padding: "32px 0"
         })
       },
-      /* @__PURE__ */ React62__default.default.createElement(
+      /* @__PURE__ */ React57__default.default.createElement(
         "table",
         {
           align: "center",
@@ -6831,7 +7026,7 @@ function EmailLayoutEditor(props) {
           cellPadding: "0",
           border: 0
         },
-        /* @__PURE__ */ React62__default.default.createElement("tbody", null, /* @__PURE__ */ React62__default.default.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ React62__default.default.createElement("td", null, editorChildren)))
+        /* @__PURE__ */ React57__default.default.createElement("tbody", null, /* @__PURE__ */ React57__default.default.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ React57__default.default.createElement("td", null, editorChildren)))
       )
     )
   );
@@ -6991,7 +7186,7 @@ function TuneMenu({ blockId }) {
     resetDocument(nDocument);
     setSelectedBlockId(blockId);
   };
-  return /* @__PURE__ */ React62__default.default.createElement(material.Paper, { sx, onClick: (ev) => ev.stopPropagation() }, /* @__PURE__ */ React62__default.default.createElement(material.Stack, null, /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Move up", placement: "left-start" }, /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { onClick: () => handleMoveClick("up"), sx: { color: "text.primary" } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ArrowUpwardOutlined, { fontSize: "small" }))), /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Move down", placement: "left-start" }, /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { onClick: () => handleMoveClick("down"), sx: { color: "text.primary" } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ArrowDownwardOutlined, { fontSize: "small" }))), /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Copy block", placement: "left-start" }, /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { onClick: handleCopyClick, sx: { color: "text.primary" } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.ContentCopyOutlined, { fontSize: "small" }))), /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Delete", placement: "left-start" }, /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { onClick: handleDeleteClick, sx: { color: "text.primary" } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.DeleteOutlined, { fontSize: "small" })))));
+  return /* @__PURE__ */ React57__default.default.createElement(material.Paper, { sx, onClick: (ev) => ev.stopPropagation() }, /* @__PURE__ */ React57__default.default.createElement(material.Stack, null, /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: t("tune.move-up", "Move up"), placement: "left-start" }, /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { "aria-label": t("tune.move-up", "Move up"), onClick: () => handleMoveClick("up"), sx: { color: "text.primary" } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ArrowUpwardOutlined, { fontSize: "small" }))), /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: t("tune.move-down", "Move down"), placement: "left-start" }, /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { "aria-label": t("tune.move-down", "Move down"), onClick: () => handleMoveClick("down"), sx: { color: "text.primary" } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ArrowDownwardOutlined, { fontSize: "small" }))), /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: t("tune.copy", "Copy block"), placement: "left-start" }, /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { "aria-label": t("tune.copy", "Copy block"), onClick: handleCopyClick, sx: { color: "text.primary" } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.ContentCopyOutlined, { fontSize: "small" }))), /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: t("tune.delete", "Delete"), placement: "left-start" }, /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { "aria-label": t("tune.delete", "Delete"), onClick: handleDeleteClick, sx: { color: "text.primary" } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.DeleteOutlined, { fontSize: "small" })))));
 }
 
 // src/editor/blocks/helpers/block-wrappers/editor-block-wrapper.tsx
@@ -7000,7 +7195,7 @@ function EditorBlockWrapper({ children }) {
   const hoveredBlockId = useHoveredBlockId();
   const draggingBlock = useDraggingBlock();
   const blockParent = useBlockParent();
-  const [mouseInside, setMouseInside] = React62.useState(false);
+  const [mouseInside, setMouseInside] = React57.useState(false);
   const blockId = useCurrentBlockId();
   const isBeingDragged = (draggingBlock == null ? void 0 : draggingBlock.sourceId) === blockId;
   let outline;
@@ -7013,7 +7208,7 @@ function EditorBlockWrapper({ children }) {
     if (selectedBlockId !== blockId) {
       return null;
     }
-    return /* @__PURE__ */ React62__default.default.createElement(TuneMenu, { blockId });
+    return /* @__PURE__ */ React57__default.default.createElement(TuneMenu, { blockId });
   };
   const draggable = Boolean(blockParent) && selectedBlockId !== blockId;
   const handleDragStart = (e) => {
@@ -7026,7 +7221,7 @@ function EditorBlockWrapper({ children }) {
   const handleDragEnd = () => {
     setDraggingBlock(null);
   };
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       draggable,
@@ -7117,8 +7312,8 @@ function ButtonEditor({ style, props }) {
   const fullWidth = (_b = props == null ? void 0 : props.fullWidth) != null ? _b : ButtonPropsDefaults.fullWidth;
   const buttonTextColor = (_c = props == null ? void 0 : props.buttonTextColor) != null ? _c : ButtonPropsDefaults.buttonTextColor;
   const buttonBackgroundColor = (_d = props == null ? void 0 : props.buttonBackgroundColor) != null ? _d : ButtonPropsDefaults.buttonBackgroundColor;
-  const [localText, setLocalText] = React62.useState(text);
-  React62.useEffect(() => {
+  const [localText, setLocalText] = React57.useState(text);
+  React57.useEffect(() => {
     setLocalText(text);
   }, [text]);
   const padding = getButtonSizePadding2(props);
@@ -7171,7 +7366,7 @@ function ButtonEditor({ style, props }) {
         selectionEnd: (_b2 = el.selectionEnd) != null ? _b2 : el.value.length
       });
     };
-    return /* @__PURE__ */ React62__default.default.createElement("div", { style: wrapperStyle }, /* @__PURE__ */ React62__default.default.createElement(
+    return /* @__PURE__ */ React57__default.default.createElement("div", { style: wrapperStyle }, /* @__PURE__ */ React57__default.default.createElement(
       "input",
       {
         type: "text",
@@ -7188,18 +7383,18 @@ function ButtonEditor({ style, props }) {
       }
     ));
   }
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: wrapperStyle }, /* @__PURE__ */ React62__default.default.createElement("span", { style: linkStyle }, /* @__PURE__ */ React62__default.default.createElement("span", null, text)));
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: wrapperStyle }, /* @__PURE__ */ React57__default.default.createElement("span", { style: linkStyle }, /* @__PURE__ */ React57__default.default.createElement("span", null, text)));
 }
 function useMarkdownToolbar({ text, isSelected, commitText, trackSelection }) {
-  const textareaRef = React62.useRef(null);
-  const [selection, setSelection] = React62.useState({ start: 0, end: 0 });
-  const [linkPrompt, setLinkPrompt] = React62.useState(false);
-  const pendingSelectionRef = React62.useRef(null);
-  const textRef = React62.useRef(text);
-  React62.useEffect(() => {
+  const textareaRef = React57.useRef(null);
+  const [selection, setSelection] = React57.useState({ start: 0, end: 0 });
+  const [linkPrompt, setLinkPrompt] = React57.useState(false);
+  const pendingSelectionRef = React57.useRef(null);
+  const textRef = React57.useRef(text);
+  React57.useEffect(() => {
     textRef.current = text;
   }, [text]);
-  const syncSelection = React62.useCallback(
+  const syncSelection = React57.useCallback(
     (start, end) => {
       const next = { start, end };
       setSelection(next);
@@ -7207,7 +7402,7 @@ function useMarkdownToolbar({ text, isSelected, commitText, trackSelection }) {
     },
     [trackSelection]
   );
-  const trackFocus = React62.useCallback(
+  const trackFocus = React57.useCallback(
     (e) => {
       var _a, _b;
       const el = e.currentTarget;
@@ -7217,7 +7412,7 @@ function useMarkdownToolbar({ text, isSelected, commitText, trackSelection }) {
     },
     [syncSelection]
   );
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     const target = pendingSelectionRef.current;
     if (!target) return;
     const ta = textareaRef.current;
@@ -7227,7 +7422,7 @@ function useMarkdownToolbar({ text, isSelected, commitText, trackSelection }) {
     syncSelection(target.start, target.end);
     pendingSelectionRef.current = null;
   }, [text, syncSelection]);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     if (!isSelected || selection.start === selection.end) {
       setLinkPrompt(false);
     }
@@ -7320,9 +7515,9 @@ function InlineFormattingToolbar({
   onLinkSubmit,
   onLinkCancel
 }) {
-  const [url, setUrl] = React62.useState("");
-  const inputRef = React62.useRef(null);
-  React62.useEffect(() => {
+  const [url, setUrl] = React57.useState("");
+  const inputRef = React57.useRef(null);
+  React57.useEffect(() => {
     if (linkPrompt) {
       setUrl("");
       setTimeout(() => {
@@ -7332,7 +7527,7 @@ function InlineFormattingToolbar({
     }
   }, [linkPrompt]);
   const preventBlur = (e) => e.preventDefault();
-  return /* @__PURE__ */ React62__default.default.createElement(material.Popper, { open: visible, anchorEl, placement: "top-start", style: { zIndex: 1300 } }, /* @__PURE__ */ React62__default.default.createElement(material.Paper, { elevation: 4, sx: { px: 0.5, py: 0.25, mb: 0.5 }, onMouseDown: preventBlur }, linkPrompt ? /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", alignItems: "center", spacing: 0.5, sx: { px: 0.5 } }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Popper, { open: visible, anchorEl, placement: "top-start", style: { zIndex: 1300 } }, /* @__PURE__ */ React57__default.default.createElement(material.Paper, { elevation: 4, sx: { px: 0.5, py: 0.25, mb: 0.5 }, onMouseDown: preventBlur }, linkPrompt ? /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", alignItems: "center", spacing: 0.5, sx: { px: 0.5 } }, /* @__PURE__ */ React57__default.default.createElement(
     material.TextField,
     {
       inputRef,
@@ -7354,7 +7549,7 @@ function InlineFormattingToolbar({
       },
       sx: { width: 220 }
     }
-  )) : /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 0.25 }, /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { size: "small", onClick: onBold, title: "Bold (Cmd+B)", "aria-label": "Bold" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.FormatBoldOutlined, { fontSize: "small" })), /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { size: "small", onClick: onItalic, title: "Italic (Cmd+I)", "aria-label": "Italic" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.FormatItalicOutlined, { fontSize: "small" })), /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { size: "small", onClick: onLinkRequest, title: "Link (Cmd+K)", "aria-label": "Link" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.LinkOutlined, { fontSize: "small" })))));
+  )) : /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 0.25 }, /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { size: "small", onClick: onBold, title: t("toolbar.bold-shortcut", "Bold (Cmd+B)"), "aria-label": t("toolbar.bold", "Bold") }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.FormatBoldOutlined, { fontSize: "small" })), /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { size: "small", onClick: onItalic, title: t("toolbar.italic-shortcut", "Italic (Cmd+I)"), "aria-label": t("toolbar.italic", "Italic") }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.FormatItalicOutlined, { fontSize: "small" })), /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { size: "small", onClick: onLinkRequest, title: t("toolbar.link-shortcut", "Link (Cmd+K)"), "aria-label": t("toolbar.link", "Link") }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.LinkOutlined, { fontSize: "small" })))));
 }
 
 // src/editor/blocks/heading/heading-editor.tsx
@@ -7427,11 +7622,11 @@ function HeadingEditor({ style, props }) {
   const isSelected = selectedBlockId === blockId;
   const level = (_a = props == null ? void 0 : props.level) != null ? _a : HeadingPropsDefaults.level;
   const textContent = (_b = props == null ? void 0 : props.text) != null ? _b : HeadingPropsDefaults.text;
-  const [localText, setLocalText] = React62.useState(textContent);
+  const [localText, setLocalText] = React57.useState(textContent);
   const isMarkdown = (_c = props == null ? void 0 : props.markdown) != null ? _c : false;
   const rootBlock = document2.root;
   const rootFontFamily = rootBlock && rootBlock.type === "EmailLayout" ? getFontFamily9(rootBlock.data.fontFamily) : '"Helvetica Neue", Arial, sans-serif';
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setLocalText(textContent);
   }, [textContent]);
   const fontFamily = getFontFamily9(style == null ? void 0 : style.fontFamily) || rootFontFamily;
@@ -7477,9 +7672,9 @@ function HeadingEditor({ style, props }) {
   const handleTextChange = (e) => {
     commitText(e.target.value);
   };
-  const displayRef = React62.useRef(null);
-  const lastDisplayHeightRef = React62.useRef(0);
-  React62.useLayoutEffect(() => {
+  const displayRef = React57.useRef(null);
+  const lastDisplayHeightRef = React57.useRef(0);
+  React57.useLayoutEffect(() => {
     if (!isSelected && displayRef.current) {
       const h = displayRef.current.offsetHeight;
       if (h > 0) lastDisplayHeightRef.current = h;
@@ -7505,11 +7700,11 @@ function HeadingEditor({ style, props }) {
       });
     }
   });
-  React62.useLayoutEffect(() => {
+  React57.useLayoutEffect(() => {
     if (textareaRef.current) adjustTextareaHeight(textareaRef.current);
   }, [localText, isSelected]);
   if (isSelected) {
-    return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(
+    return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(
       "textarea",
       {
         ref: textareaRef,
@@ -7527,7 +7722,7 @@ function HeadingEditor({ style, props }) {
         rows: 1,
         onInput: (e) => adjustTextareaHeight(e.target)
       }
-    ), /* @__PURE__ */ React62__default.default.createElement(InlineFormattingToolbar, __spreadValues({ anchorEl: textareaRef.current }, toolbarProps)));
+    ), /* @__PURE__ */ React57__default.default.createElement(InlineFormattingToolbar, __spreadValues({ anchorEl: textareaRef.current }, toolbarProps)));
   }
   const headingProps = isMarkdown ? {
     ref: displayRef,
@@ -7536,11 +7731,11 @@ function HeadingEditor({ style, props }) {
   } : { ref: displayRef, style: hStyle, children: textContent };
   switch (level) {
     case "h1":
-      return /* @__PURE__ */ React62__default.default.createElement("h1", __spreadValues({}, headingProps));
+      return /* @__PURE__ */ React57__default.default.createElement("h1", __spreadValues({}, headingProps));
     case "h2":
-      return /* @__PURE__ */ React62__default.default.createElement("h2", __spreadValues({}, headingProps));
+      return /* @__PURE__ */ React57__default.default.createElement("h2", __spreadValues({}, headingProps));
     case "h3":
-      return /* @__PURE__ */ React62__default.default.createElement("h3", __spreadValues({}, headingProps));
+      return /* @__PURE__ */ React57__default.default.createElement("h3", __spreadValues({}, headingProps));
   }
 }
 function HtmlEditor({ style, props }) {
@@ -7549,8 +7744,8 @@ function HtmlEditor({ style, props }) {
   const selectedBlockId = useSelectedBlockId();
   const isSelected = selectedBlockId === blockId;
   const contents = (_a = props == null ? void 0 : props.contents) != null ? _a : "";
-  const [localContents, setLocalContents] = React62.useState(contents);
-  React62.useEffect(() => {
+  const [localContents, setLocalContents] = React57.useState(contents);
+  React57.useEffect(() => {
     setLocalContents(contents);
   }, [contents]);
   const cssStyle = {
@@ -7605,7 +7800,7 @@ function HtmlEditor({ style, props }) {
         selectionEnd: (_b2 = el.selectionEnd) != null ? _b2 : el.value.length
       });
     };
-    return /* @__PURE__ */ React62__default.default.createElement("div", { style: cssStyle }, /* @__PURE__ */ React62__default.default.createElement(
+    return /* @__PURE__ */ React57__default.default.createElement("div", { style: cssStyle }, /* @__PURE__ */ React57__default.default.createElement(
       "textarea",
       {
         value: localContents,
@@ -7625,9 +7820,9 @@ function HtmlEditor({ style, props }) {
     ));
   }
   if (!contents) {
-    return /* @__PURE__ */ React62__default.default.createElement("div", { style: cssStyle });
+    return /* @__PURE__ */ React57__default.default.createElement("div", { style: cssStyle });
   }
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: cssStyle, dangerouslySetInnerHTML: { __html: contents } });
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: cssStyle, dangerouslySetInnerHTML: { __html: contents } });
 }
 function getImageBorderRadius2(shape, size) {
   switch (shape) {
@@ -7660,36 +7855,36 @@ function SignatureEditor({ style, props }) {
   const nameColor = (_m = props == null ? void 0 : props.nameColor) != null ? _m : SignaturePropsDefaults.nameColor;
   const textColor = (_n = props == null ? void 0 : props.textColor) != null ? _n : SignaturePropsDefaults.textColor;
   const linkColor = (_o = props == null ? void 0 : props.linkColor) != null ? _o : SignaturePropsDefaults.linkColor;
-  const [localGreeting, setLocalGreeting] = React62.useState(greeting);
-  const [localName, setLocalName] = React62.useState(name);
-  const [localTitle, setLocalTitle] = React62.useState(title);
-  const [localCompany, setLocalCompany] = React62.useState(company);
-  const [localAddress, setLocalAddress] = React62.useState(address);
-  const [localEmail, setLocalEmail] = React62.useState(email);
-  const [localPhone, setLocalPhone] = React62.useState(phone);
-  const [localWebsite, setLocalWebsite] = React62.useState(website);
-  React62.useEffect(() => {
+  const [localGreeting, setLocalGreeting] = React57.useState(greeting);
+  const [localName, setLocalName] = React57.useState(name);
+  const [localTitle, setLocalTitle] = React57.useState(title);
+  const [localCompany, setLocalCompany] = React57.useState(company);
+  const [localAddress, setLocalAddress] = React57.useState(address);
+  const [localEmail, setLocalEmail] = React57.useState(email);
+  const [localPhone, setLocalPhone] = React57.useState(phone);
+  const [localWebsite, setLocalWebsite] = React57.useState(website);
+  React57.useEffect(() => {
     setLocalGreeting(greeting);
   }, [greeting]);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setLocalName(name);
   }, [name]);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setLocalTitle(title);
   }, [title]);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setLocalCompany(company);
   }, [company]);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setLocalAddress(address);
   }, [address]);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setLocalEmail(email);
   }, [email]);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setLocalPhone(phone);
   }, [phone]);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setLocalWebsite(website);
   }, [website]);
   const updateProps = (updates) => {
@@ -7742,7 +7937,7 @@ function SignatureEditor({ style, props }) {
     backgroundColor: (_p = style == null ? void 0 : style.backgroundColor) != null ? _p : void 0,
     padding: (style == null ? void 0 : style.padding) ? `${style.padding.top}px ${style.padding.right}px ${style.padding.bottom}px ${style.padding.left}px` : void 0
   };
-  const imageElement = imageUrl ? /* @__PURE__ */ React62__default.default.createElement(
+  const imageElement = imageUrl ? /* @__PURE__ */ React57__default.default.createElement(
     "img",
     {
       src: imageUrl,
@@ -7760,7 +7955,7 @@ function SignatureEditor({ style, props }) {
       }
     }
   ) : null;
-  const greetingElement = isSelected ? /* @__PURE__ */ React62__default.default.createElement("div", { onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React62__default.default.createElement(
+  const greetingElement = isSelected ? /* @__PURE__ */ React57__default.default.createElement("div", { onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React57__default.default.createElement(
     "input",
     {
       value: localGreeting,
@@ -7771,8 +7966,8 @@ function SignatureEditor({ style, props }) {
       placeholder: "Greeting (e.g. Best regards,)",
       style: __spreadValues(__spreadValues({}, inputBase), greetingStyle)
     }
-  )) : greeting ? /* @__PURE__ */ React62__default.default.createElement("p", { style: greetingStyle }, greeting) : null;
-  const textContent = isSelected ? /* @__PURE__ */ React62__default.default.createElement("div", { onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React62__default.default.createElement(
+  )) : greeting ? /* @__PURE__ */ React57__default.default.createElement("p", { style: greetingStyle }, greeting) : null;
+  const textContent = isSelected ? /* @__PURE__ */ React57__default.default.createElement("div", { onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React57__default.default.createElement(
     "input",
     {
       value: localName,
@@ -7783,7 +7978,7 @@ function SignatureEditor({ style, props }) {
       placeholder: "Name",
       style: __spreadValues(__spreadValues({}, inputBase), nameStyle)
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     "input",
     {
       value: localTitle,
@@ -7794,7 +7989,7 @@ function SignatureEditor({ style, props }) {
       placeholder: "Title",
       style: __spreadValues(__spreadValues({}, inputBase), detailStyle)
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     "input",
     {
       value: localCompany,
@@ -7805,7 +8000,7 @@ function SignatureEditor({ style, props }) {
       placeholder: "Company",
       style: __spreadValues(__spreadValues({}, inputBase), detailStyle)
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     "input",
     {
       value: localAddress,
@@ -7816,7 +8011,7 @@ function SignatureEditor({ style, props }) {
       placeholder: "Address",
       style: __spreadValues(__spreadValues({}, inputBase), detailStyle)
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     "input",
     {
       value: localEmail,
@@ -7827,7 +8022,7 @@ function SignatureEditor({ style, props }) {
       placeholder: "Email",
       style: __spreadProps(__spreadValues(__spreadValues({}, inputBase), linkStyle), { marginTop: 4, display: "block" })
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     "input",
     {
       value: localPhone,
@@ -7838,7 +8033,7 @@ function SignatureEditor({ style, props }) {
       placeholder: "Phone",
       style: __spreadProps(__spreadValues(__spreadValues({}, inputBase), linkStyle), { display: "block" })
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     "input",
     {
       value: localWebsite,
@@ -7849,11 +8044,11 @@ function SignatureEditor({ style, props }) {
       placeholder: "Website",
       style: __spreadProps(__spreadValues(__spreadValues({}, inputBase), linkStyle), { display: "block" })
     }
-  )) : /* @__PURE__ */ React62__default.default.createElement("div", null, name && /* @__PURE__ */ React62__default.default.createElement("p", { style: nameStyle }, name), title && /* @__PURE__ */ React62__default.default.createElement("p", { style: detailStyle }, title), company && /* @__PURE__ */ React62__default.default.createElement("p", { style: detailStyle }, company), address && /* @__PURE__ */ React62__default.default.createElement("p", { style: detailStyle }, address), (email || phone || website) && /* @__PURE__ */ React62__default.default.createElement("p", { style: __spreadProps(__spreadValues({}, detailStyle), { marginTop: 4 }) }, email && /* @__PURE__ */ React62__default.default.createElement("span", { style: linkStyle }, email), email && (phone || website) && /* @__PURE__ */ React62__default.default.createElement("span", { style: detailStyle }, " \xB7 "), phone && /* @__PURE__ */ React62__default.default.createElement("span", { style: linkStyle }, phone), phone && website && /* @__PURE__ */ React62__default.default.createElement("span", { style: detailStyle }, " \xB7 "), website && /* @__PURE__ */ React62__default.default.createElement("span", { style: linkStyle }, website)), !name && !title && !company && !email && !phone && !website && /* @__PURE__ */ React62__default.default.createElement("p", { style: detailStyle }, "Click to edit signature"));
+  )) : /* @__PURE__ */ React57__default.default.createElement("div", null, name && /* @__PURE__ */ React57__default.default.createElement("p", { style: nameStyle }, name), title && /* @__PURE__ */ React57__default.default.createElement("p", { style: detailStyle }, title), company && /* @__PURE__ */ React57__default.default.createElement("p", { style: detailStyle }, company), address && /* @__PURE__ */ React57__default.default.createElement("p", { style: detailStyle }, address), (email || phone || website) && /* @__PURE__ */ React57__default.default.createElement("p", { style: __spreadProps(__spreadValues({}, detailStyle), { marginTop: 4 }) }, email && /* @__PURE__ */ React57__default.default.createElement("span", { style: linkStyle }, email), email && (phone || website) && /* @__PURE__ */ React57__default.default.createElement("span", { style: detailStyle }, " \xB7 "), phone && /* @__PURE__ */ React57__default.default.createElement("span", { style: linkStyle }, phone), phone && website && /* @__PURE__ */ React57__default.default.createElement("span", { style: detailStyle }, " \xB7 "), website && /* @__PURE__ */ React57__default.default.createElement("span", { style: linkStyle }, website)), !name && !title && !company && !email && !phone && !website && /* @__PURE__ */ React57__default.default.createElement("p", { style: detailStyle }, "Click to edit signature"));
   if (layout === "vertical") {
-    return /* @__PURE__ */ React62__default.default.createElement("div", { style: wrapperStyle }, greetingElement, imageElement && /* @__PURE__ */ React62__default.default.createElement("div", { style: { marginBottom: 12 } }, imageElement), textContent);
+    return /* @__PURE__ */ React57__default.default.createElement("div", { style: wrapperStyle }, greetingElement, imageElement && /* @__PURE__ */ React57__default.default.createElement("div", { style: { marginBottom: 12 } }, imageElement), textContent);
   }
-  return /* @__PURE__ */ React62__default.default.createElement("div", { style: wrapperStyle }, greetingElement, /* @__PURE__ */ React62__default.default.createElement("table", { cellPadding: "0", cellSpacing: "0", border: 0, role: "presentation" }, /* @__PURE__ */ React62__default.default.createElement("tbody", null, /* @__PURE__ */ React62__default.default.createElement("tr", null, imageElement && /* @__PURE__ */ React62__default.default.createElement("td", { style: { verticalAlign: "middle", paddingRight: 16 } }, imageElement), /* @__PURE__ */ React62__default.default.createElement("td", { style: { verticalAlign: "middle" } }, textContent)))));
+  return /* @__PURE__ */ React57__default.default.createElement("div", { style: wrapperStyle }, greetingElement, /* @__PURE__ */ React57__default.default.createElement("table", { cellPadding: "0", cellSpacing: "0", border: 0, role: "presentation" }, /* @__PURE__ */ React57__default.default.createElement("tbody", null, /* @__PURE__ */ React57__default.default.createElement("tr", null, imageElement && /* @__PURE__ */ React57__default.default.createElement("td", { style: { verticalAlign: "middle", paddingRight: 16 } }, imageElement), /* @__PURE__ */ React57__default.default.createElement("td", { style: { verticalAlign: "middle" } }, textContent)))));
 }
 function getFontFamily10(fontFamily) {
   switch (fontFamily) {
@@ -7913,11 +8108,11 @@ function TextEditor({ style, props }) {
   const document2 = useDocument();
   const isSelected = selectedBlockId === blockId;
   const textContent = (_a = props == null ? void 0 : props.text) != null ? _a : TextPropsDefaults.text;
-  const [localText, setLocalText] = React62.useState(textContent);
+  const [localText, setLocalText] = React57.useState(textContent);
   const isMarkdown = (_b = props == null ? void 0 : props.markdown) != null ? _b : false;
   const rootBlock = document2.root;
   const rootFontFamily = rootBlock && rootBlock.type === "EmailLayout" ? getFontFamily10(rootBlock.data.fontFamily) : '"Helvetica Neue", Arial, sans-serif';
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setLocalText(textContent);
   }, [textContent]);
   const fontFamily = getFontFamily10(style == null ? void 0 : style.fontFamily) || rootFontFamily;
@@ -7965,9 +8160,9 @@ function TextEditor({ style, props }) {
   const handleTextChange = (e) => {
     commitText(e.target.value);
   };
-  const displayRef = React62.useRef(null);
-  const lastDisplayHeightRef = React62.useRef(0);
-  React62.useLayoutEffect(() => {
+  const displayRef = React57.useRef(null);
+  const lastDisplayHeightRef = React57.useRef(0);
+  React57.useLayoutEffect(() => {
     if (!isSelected && displayRef.current) {
       const h = displayRef.current.offsetHeight;
       if (h > 0) lastDisplayHeightRef.current = h;
@@ -7993,11 +8188,11 @@ function TextEditor({ style, props }) {
       });
     }
   });
-  React62.useLayoutEffect(() => {
+  React57.useLayoutEffect(() => {
     if (textareaRef.current) adjustTextareaHeight(textareaRef.current);
   }, [localText, isSelected]);
   if (isSelected) {
-    return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(
+    return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(
       "textarea",
       {
         ref: textareaRef,
@@ -8015,10 +8210,10 @@ function TextEditor({ style, props }) {
         rows: 1,
         onInput: (e) => adjustTextareaHeight(e.target)
       }
-    ), /* @__PURE__ */ React62__default.default.createElement(InlineFormattingToolbar, __spreadValues({ anchorEl: textareaRef.current }, toolbarProps)));
+    ), /* @__PURE__ */ React57__default.default.createElement(InlineFormattingToolbar, __spreadValues({ anchorEl: textareaRef.current }, toolbarProps)));
   }
   if (isMarkdown) {
-    return /* @__PURE__ */ React62__default.default.createElement(
+    return /* @__PURE__ */ React57__default.default.createElement(
       "div",
       {
         ref: displayRef,
@@ -8027,34 +8222,34 @@ function TextEditor({ style, props }) {
       }
     );
   }
-  return /* @__PURE__ */ React62__default.default.createElement("div", { ref: displayRef, style: wStyle }, textContent);
+  return /* @__PURE__ */ React57__default.default.createElement("div", { ref: displayRef, style: wStyle }, textContent);
 }
 
 // src/editor/core.tsx
 var EDITOR_DICTIONARY = buildBlockConfigurationDictionary({
   Avatar: {
     schema: AvatarPropsSchema,
-    Component: (props) => /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(avatar_default, __spreadValues({}, props)))
+    Component: (props) => /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(avatar_default, __spreadValues({}, props)))
   },
   Button: {
     schema: ButtonPropsSchema,
-    Component: (props) => /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(ButtonEditor, __spreadValues({}, props)))
+    Component: (props) => /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(ButtonEditor, __spreadValues({}, props)))
   },
   Container: {
     schema: container_props_schema_default,
-    Component: (props) => /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(ContainerEditor, __spreadValues({}, props)))
+    Component: (props) => /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(ContainerEditor, __spreadValues({}, props)))
   },
   ColumnsContainer: {
     schema: columns_container_props_schema_default2,
-    Component: (props) => /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(ColumnsContainerEditor, __spreadValues({}, props)))
+    Component: (props) => /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(ColumnsContainerEditor, __spreadValues({}, props)))
   },
   Heading: {
     schema: HeadingPropsSchema,
-    Component: (props) => /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(HeadingEditor, __spreadValues({}, props)))
+    Component: (props) => /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(HeadingEditor, __spreadValues({}, props)))
   },
   Html: {
     schema: HtmlPropsSchema,
-    Component: (props) => /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(HtmlEditor, __spreadValues({}, props)))
+    Component: (props) => /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(HtmlEditor, __spreadValues({}, props)))
   },
   Image: {
     schema: ImagePropsSchema,
@@ -8066,28 +8261,28 @@ var EDITOR_DICTIONARY = buildBlockConfigurationDictionary({
           linkHref: null
         })
       });
-      return /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(image_default, __spreadValues({}, props)));
+      return /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(image_default, __spreadValues({}, props)));
     }
   },
   Text: {
     schema: TextPropsSchema,
-    Component: (props) => /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(TextEditor, __spreadValues({}, props)))
+    Component: (props) => /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(TextEditor, __spreadValues({}, props)))
   },
   EmailLayout: {
     schema: email_layout_props_schema_default,
-    Component: (p) => /* @__PURE__ */ React62__default.default.createElement(EmailLayoutEditor, __spreadValues({}, p))
+    Component: (p) => /* @__PURE__ */ React57__default.default.createElement(EmailLayoutEditor, __spreadValues({}, p))
   },
   Spacer: {
     schema: SpacerPropsSchema,
-    Component: (props) => /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(spacer_default, __spreadValues({}, props)))
+    Component: (props) => /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(spacer_default, __spreadValues({}, props)))
   },
   Divider: {
     schema: DividerPropsSchema,
-    Component: (props) => /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(divider_default, __spreadValues({}, props)))
+    Component: (props) => /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(divider_default, __spreadValues({}, props)))
   },
   Signature: {
     schema: SignaturePropsSchema,
-    Component: (props) => /* @__PURE__ */ React62__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62__default.default.createElement(SignatureEditor, __spreadValues({}, props)))
+    Component: (props) => /* @__PURE__ */ React57__default.default.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React57__default.default.createElement(SignatureEditor, __spreadValues({}, props)))
   }
 });
 var EditorBlock2 = buildBlockComponent(EDITOR_DICTIONARY);
@@ -8095,15 +8290,15 @@ var EditorBlockSchema = buildBlockConfigurationSchema(EDITOR_DICTIONARY);
 zod.z.record(zod.z.string(), EditorBlockSchema);
 
 // src/editor/editor-block.tsx
-var EditorBlockContext = React62.createContext(null);
-var useCurrentBlockId = () => React62.useContext(EditorBlockContext);
+var EditorBlockContext = React57.createContext(null);
+var useCurrentBlockId = () => React57.useContext(EditorBlockContext);
 function EditorBlock({ id }) {
   const document2 = useDocument();
   const block = document2[id];
   if (!block) {
     throw new Error("Could not find block");
   }
-  return /* @__PURE__ */ React62__default.default.createElement(EditorBlockContext.Provider, { value: id }, /* @__PURE__ */ React62__default.default.createElement(EditorBlock2, __spreadValues({}, block)));
+  return /* @__PURE__ */ React57__default.default.createElement(EditorBlockContext.Provider, { value: id }, /* @__PURE__ */ React57__default.default.createElement(EditorBlock2, __spreadValues({}, block)));
 }
 function ToggleInspectorPanelButton() {
   const inspectorDrawerOpen = useInspectorDrawerOpen();
@@ -8111,20 +8306,20 @@ function ToggleInspectorPanelButton() {
     toggleInspectorDrawerOpen();
   };
   if (inspectorDrawerOpen) {
-    return /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { onClick: handleClick }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.LastPageOutlined, { fontSize: "small" }));
+    return /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { onClick: handleClick }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.LastPageOutlined, { fontSize: "small" }));
   }
-  return /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { onClick: handleClick }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AppRegistrationOutlined, { fontSize: "small" }));
+  return /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { onClick: handleClick }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AppRegistrationOutlined, { fontSize: "small" }));
 }
 function useIcon() {
   const samplesDrawerOpen = useSamplesDrawerOpen();
   if (samplesDrawerOpen) {
-    return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.FirstPageOutlined, { fontSize: "small" });
+    return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.FirstPageOutlined, { fontSize: "small" });
   }
-  return /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.MenuOutlined, { fontSize: "small" });
+  return /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.MenuOutlined, { fontSize: "small" });
 }
 function ToggleSamplesPanelButton() {
   const icon = useIcon();
-  return /* @__PURE__ */ React62__default.default.createElement(material.IconButton, { onClick: toggleSamplesDrawerOpen }, icon);
+  return /* @__PURE__ */ React57__default.default.createElement(material.IconButton, { onClick: toggleSamplesDrawerOpen }, icon);
 }
 function formatHtml(html2, spaces = 2) {
   try {
@@ -8172,8 +8367,8 @@ function json(value) {
 
 // src/app/email-canvas/helper/highlighted-code-panel.tsx
 function HighlightedCodePanel({ type, value }) {
-  const [code, setCode] = React62.useState(null);
-  React62.useEffect(() => {
+  const [code, setCode] = React57.useState(null);
+  React57.useEffect(() => {
     switch (type) {
       case "html":
         html(value).then(setCode);
@@ -8186,7 +8381,7 @@ function HighlightedCodePanel({ type, value }) {
   if (code === null) {
     return null;
   }
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     "pre",
     {
       style: {
@@ -8211,18 +8406,18 @@ function HighlightedCodePanel({ type, value }) {
 // src/app/email-canvas/html-panel.tsx
 function HtmlPanel() {
   const document2 = useDocument();
-  const code = React62.useMemo(() => renderToStaticMarkup(document2, { rootBlockId: "root" }), [document2]);
-  return /* @__PURE__ */ React62__default.default.createElement(HighlightedCodePanel, { type: "html", value: code });
+  const code = React57.useMemo(() => renderToStaticMarkup(document2, { rootBlockId: "root" }), [document2]);
+  return /* @__PURE__ */ React57__default.default.createElement(HighlightedCodePanel, { type: "html", value: code });
 }
 function JsonPanel() {
   const document2 = useDocument();
-  const code = React62.useMemo(() => JSON.stringify(document2, null, "  "), [document2]);
-  return /* @__PURE__ */ React62__default.default.createElement(HighlightedCodePanel, { type: "json", value: code });
+  const code = React57.useMemo(() => JSON.stringify(document2, null, "  "), [document2]);
+  return /* @__PURE__ */ React57__default.default.createElement(HighlightedCodePanel, { type: "json", value: code });
 }
 function TextPanel() {
   const document2 = useDocument();
-  const text = React62.useMemo(() => renderToText(document2, { rootBlockId: "root" }), [document2]);
-  return /* @__PURE__ */ React62__default.default.createElement(
+  const text = React57.useMemo(() => renderToText(document2, { rootBlockId: "root" }), [document2]);
+  return /* @__PURE__ */ React57__default.default.createElement(
     "pre",
     {
       style: {
@@ -8258,35 +8453,35 @@ function MainTabsGroup() {
         setSelectedMainTab("editor");
     }
   };
-  return /* @__PURE__ */ React62__default.default.createElement(material.Tabs, { value: selectedMainTab, onChange: handleChange }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Tabs, { value: selectedMainTab, onChange: handleChange }, /* @__PURE__ */ React57__default.default.createElement(
     material.Tab,
     {
       value: "editor",
-      label: /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Edit" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.EditOutlined, { fontSize: "small" }))
+      label: /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Edit" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.EditOutlined, { fontSize: "small" }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     material.Tab,
     {
       value: "preview",
-      label: /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Preview" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.PreviewOutlined, { fontSize: "small" }))
+      label: /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Preview" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.PreviewOutlined, { fontSize: "small" }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     material.Tab,
     {
       value: "html",
-      label: /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "HTML output" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.CodeOutlined, { fontSize: "small" }))
+      label: /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "HTML output" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.CodeOutlined, { fontSize: "small" }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     material.Tab,
     {
       value: "text",
-      label: /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Plain text output" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.SubjectOutlined, { fontSize: "small" }))
+      label: /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Plain text output" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.SubjectOutlined, { fontSize: "small" }))
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     material.Tab,
     {
       value: "json",
-      label: /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "JSON output" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.DataObjectOutlined, { fontSize: "small" }))
+      label: /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "JSON output" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.DataObjectOutlined, { fontSize: "small" }))
     }
   ));
 }
@@ -8301,11 +8496,11 @@ function SaveBar({ loadTemplates, saveAs }) {
   } = useEmailEditor();
   const { showMessage } = useSnackbar();
   const document2 = useDocument();
-  const [dialogMode, setDialogMode] = React62.useState(null);
-  const [nameError, setNameError] = React62.useState(null);
+  const [dialogMode, setDialogMode] = React57.useState(null);
+  const [nameError, setNameError] = React57.useState(null);
   const hasOpenRow = Boolean(currentTemplateId);
   const isSample = currentTemplateKind === "sample";
-  const primaryLabel = hasOpenRow ? "Save" : "Save as new\u2026";
+  const primaryLabel = hasOpenRow ? t("savebar.save", "Save") : t("savebar.save-as-new", "Save as new\u2026");
   const handlePrimary = () => __async(null, null, function* () {
     try {
       if (!hasOpenRow) {
@@ -8314,11 +8509,11 @@ function SaveBar({ loadTemplates, saveAs }) {
         return;
       }
       saveTemplate();
-      showMessage(isSample ? "Sample saved" : "Template saved");
+      showMessage(isSample ? t("savebar.sample-saved", "Sample saved") : t("savebar.template-saved", "Template saved"));
       if (loadTemplates) yield loadTemplates();
     } catch (e) {
       console.error("Error saving:", e);
-      showMessage("Error saving");
+      showMessage(t("savebar.error-saving", "Error saving"));
     }
   });
   const handleSaveAs = (name) => __async(null, null, function* () {
@@ -8330,16 +8525,18 @@ function SaveBar({ loadTemplates, saveAs }) {
       setCurrentTemplate(id, slug, "template");
       ctxLoadTemplate(starterContent, id, slug, "template");
       if (loadTemplates) yield loadTemplates();
-      showMessage(dialogMode === "new-blank" ? "New template created" : "Template saved");
+      showMessage(
+        dialogMode === "new-blank" ? t("savebar.new-template-created", "New template created") : t("savebar.template-saved", "Template saved")
+      );
       window.location.hash = `#template/${id}`;
       return true;
     } catch (e) {
       console.error("Error in saveAs:", e);
-      showMessage("Error saving");
+      showMessage(t("savebar.error-saving", "Error saving"));
       return false;
     }
   });
-  return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       sx: {
@@ -8352,7 +8549,7 @@ function SaveBar({ loadTemplates, saveAs }) {
         pb: 3
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       material.Box,
       {
         sx: {
@@ -8367,7 +8564,7 @@ function SaveBar({ loadTemplates, saveAs }) {
           boxShadow: "0 2px 6px rgba(33, 36, 67, 0.06), 0 16px 40px rgba(33, 36, 67, 0.14)"
         }
       },
-      hasOpenRow && currentTemplateName && /* @__PURE__ */ React62__default.default.createElement(
+      hasOpenRow && currentTemplateName && /* @__PURE__ */ React57__default.default.createElement(
         material.Box,
         {
           sx: {
@@ -8382,50 +8579,50 @@ function SaveBar({ loadTemplates, saveAs }) {
           },
           title: currentTemplateName
         },
-        isSample ? "Sample \xB7 " : "",
-        /* @__PURE__ */ React62__default.default.createElement(material.Box, { component: "span", sx: { color: "text.primary", fontWeight: 600 } }, currentTemplateName)
+        isSample ? `${t("savebar.sample-prefix", "Sample")} \xB7 ` : "",
+        /* @__PURE__ */ React57__default.default.createElement(material.Box, { component: "span", sx: { color: "text.primary", fontWeight: 600 } }, currentTemplateName)
       ),
-      /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: hasOpenRow ? `Save changes${isSample ? " to this sample" : ""}` : "Save as a new template" }, /* @__PURE__ */ React62__default.default.createElement(
+      /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: hasOpenRow ? isSample ? t("savebar.save-changes-to-sample", "Save changes to this sample") : t("savebar.save-changes", "Save changes") : t("savebar.save-as-new-template", "Save as a new template") }, /* @__PURE__ */ React57__default.default.createElement(
         material.Button,
         {
           variant: "contained",
           size: "large",
-          startIcon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.SaveOutlined, null),
+          startIcon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.SaveOutlined, null),
           onClick: handlePrimary,
           sx: { borderRadius: 999, textTransform: "none", px: 2.5, fontSize: 15, fontWeight: 600 }
         },
         primaryLabel
       )),
-      hasOpenRow && saveAs && /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Save as a new template" }, /* @__PURE__ */ React62__default.default.createElement(
+      hasOpenRow && saveAs && /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: t("savebar.save-as-new-template", "Save as a new template") }, /* @__PURE__ */ React57__default.default.createElement(
         material.Button,
         {
           variant: "outlined",
           size: "large",
-          startIcon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.SaveAsOutlined, null),
+          startIcon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.SaveAsOutlined, null),
           onClick: () => {
             setNameError(null);
             setDialogMode("save-as");
           },
           sx: { borderRadius: 999, textTransform: "none", px: 2, fontSize: 14 }
         },
-        "Save as\u2026"
+        t("savebar.save-as", "Save as\u2026")
       )),
-      saveAs && /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Start a fresh template" }, /* @__PURE__ */ React62__default.default.createElement(
+      saveAs && /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: t("savebar.start-fresh", "Start a fresh template") }, /* @__PURE__ */ React57__default.default.createElement(
         material.Button,
         {
           variant: "text",
           size: "large",
-          startIcon: /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.AddOutlined, null),
+          startIcon: /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.AddOutlined, null),
           onClick: () => {
             setNameError(null);
             setDialogMode("new-blank");
           },
           sx: { borderRadius: 999, textTransform: "none", px: 2, fontSize: 14, color: "text.secondary" }
         },
-        "New"
+        t("savebar.new", "New")
       ))
     )
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     SaveTemplateDialog,
     {
       open: dialogMode !== null,
@@ -8463,7 +8660,7 @@ function SubjectInput() {
       selectionEnd: (_b = target.selectionEnd) != null ? _b : target.value.length
     });
   };
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       sx: {
@@ -8480,8 +8677,8 @@ function SubjectInput() {
         gap: 1.5
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { color: "text.secondary", fontSize: 13, fontWeight: 600, minWidth: 56 } }, "Subject"),
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { color: "text.secondary", fontSize: 13, fontWeight: 600, minWidth: 56 } }, "Subject"),
+    /* @__PURE__ */ React57__default.default.createElement(
       material.InputBase,
       {
         fullWidth: true,
@@ -8507,7 +8704,7 @@ function SubjectPreview() {
   if (!subject) return null;
   const samples = buildSampleValueMap((_b = data.variables) != null ? _b : []);
   const rendered = substituteSampleValues(subject, samples);
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       sx: {
@@ -8524,8 +8721,8 @@ function SubjectPreview() {
         gap: 1.5
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { color: "text.secondary", fontSize: 13, fontWeight: 600, minWidth: 56 } }, "Subject"),
-    /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { fontSize: 14 } }, rendered)
+    /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { color: "text.secondary", fontSize: 13, fontWeight: 600, minWidth: 56 } }, "Subject"),
+    /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { fontSize: 14 } }, rendered)
   );
 }
 function generateId3() {
@@ -8572,12 +8769,12 @@ function findImageFile(items) {
 }
 function ImageDropPasteHandler({ enabled, children }) {
   const { uploadImage } = useImageCallbacks();
-  const wrapperRef = React62.useRef(null);
-  const dragDepth = React62.useRef(0);
-  const [dragging, setDragging] = React62.useState(false);
-  const [uploading, setUploading] = React62.useState(false);
+  const wrapperRef = React57.useRef(null);
+  const dragDepth = React57.useRef(0);
+  const [dragging, setDragging] = React57.useState(false);
+  const [uploading, setUploading] = React57.useState(false);
   const active = enabled && Boolean(uploadImage);
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     if (!active || !uploadImage) return;
     const handlePaste = (e) => __async(null, null, function* () {
       var _a;
@@ -8598,7 +8795,7 @@ function ImageDropPasteHandler({ enabled, children }) {
     window.addEventListener("paste", handlePaste);
     return () => window.removeEventListener("paste", handlePaste);
   }, [active, uploadImage]);
-  if (!active) return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, children);
+  if (!active) return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, children);
   const onDragEnter = (e) => {
     var _a, _b;
     if (!Array.from((_b = (_a = e.dataTransfer) == null ? void 0 : _a.items) != null ? _b : []).some((i) => i.kind === "file")) return;
@@ -8631,7 +8828,7 @@ function ImageDropPasteHandler({ enabled, children }) {
       setUploading(false);
     }
   });
-  return /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       ref: wrapperRef,
@@ -8642,7 +8839,7 @@ function ImageDropPasteHandler({ enabled, children }) {
       sx: { position: "relative" }
     },
     children,
-    (dragging || uploading) && /* @__PURE__ */ React62__default.default.createElement(
+    (dragging || uploading) && /* @__PURE__ */ React57__default.default.createElement(
       material.Box,
       {
         sx: {
@@ -8661,7 +8858,7 @@ function ImageDropPasteHandler({ enabled, children }) {
           zIndex: 10
         }
       },
-      /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { display: "flex", alignItems: "center", gap: 1, fontWeight: 600, fontSize: 14 } }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.CloudUploadOutlined, null), uploading ? "Uploading\u2026" : "Drop image to insert")
+      /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { display: "flex", alignItems: "center", gap: 1, fontWeight: 600, fontSize: 14 } }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.CloudUploadOutlined, null), uploading ? "Uploading\u2026" : "Drop image to insert")
     )
   );
 }
@@ -8701,7 +8898,7 @@ function TemplatePanel2({ loadTemplates, saveAs, samplesDrawerEnabled = true })
     var _a;
     switch (selectedMainTab) {
       case "editor":
-        return /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: mainBoxSx }, /* @__PURE__ */ React62__default.default.createElement(EditorBlock, { id: "root" }));
+        return /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: mainBoxSx }, /* @__PURE__ */ React57__default.default.createElement(EditorBlock, { id: "root" }));
       case "preview": {
         const rootBlock = document2.root;
         const layoutData = rootBlock && rootBlock.type === "EmailLayout" ? rootBlock.data : void 0;
@@ -8709,18 +8906,18 @@ function TemplatePanel2({ loadTemplates, saveAs, samplesDrawerEnabled = true })
           (_a = layoutData == null ? void 0 : layoutData.variables) != null ? _a : []
         );
         const previewDoc = applySampleValuesToDocument(document2, samples);
-        return /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: mainBoxSx }, /* @__PURE__ */ React62__default.default.createElement(Reader, { document: previewDoc, rootBlockId: "root" }));
+        return /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: mainBoxSx }, /* @__PURE__ */ React57__default.default.createElement(Reader, { document: previewDoc, rootBlockId: "root" }));
       }
       case "html":
-        return /* @__PURE__ */ React62__default.default.createElement(HtmlPanel, null);
+        return /* @__PURE__ */ React57__default.default.createElement(HtmlPanel, null);
       case "text":
-        return /* @__PURE__ */ React62__default.default.createElement(TextPanel, null);
+        return /* @__PURE__ */ React57__default.default.createElement(TextPanel, null);
       case "json":
-        return /* @__PURE__ */ React62__default.default.createElement(JsonPanel, null);
+        return /* @__PURE__ */ React57__default.default.createElement(JsonPanel, null);
     }
   };
   const showSaveButtons = persistenceEnabled;
-  return /* @__PURE__ */ React62__default.default.createElement(React62__default.default.Fragment, null, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(React57__default.default.Fragment, null, /* @__PURE__ */ React57__default.default.createElement(
     material.Stack,
     {
       sx: {
@@ -8737,10 +8934,10 @@ function TemplatePanel2({ loadTemplates, saveAs, samplesDrawerEnabled = true })
       justifyContent: "space-between",
       alignItems: "center"
     },
-    samplesDrawerEnabled && /* @__PURE__ */ React62__default.default.createElement(ToggleSamplesPanelButton, null),
-    /* @__PURE__ */ React62__default.default.createElement(material.Stack, { px: 2, direction: "row", gap: 2, width: "100%", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 2 }, /* @__PURE__ */ React62__default.default.createElement(MainTabsGroup, null)), /* @__PURE__ */ React62__default.default.createElement(material.Stack, { direction: "row", spacing: 2 }, /* @__PURE__ */ React62__default.default.createElement(material.ToggleButtonGroup, { value: selectedScreenSize, exclusive: true, size: "small", onChange: handleScreenSizeChange }, /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "desktop" }, /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Desktop view" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.MonitorOutlined, { fontSize: "small" }))), /* @__PURE__ */ React62__default.default.createElement(material.ToggleButton, { value: "mobile" }, /* @__PURE__ */ React62__default.default.createElement(material.Tooltip, { title: "Mobile view" }, /* @__PURE__ */ React62__default.default.createElement(iconsMaterial.PhoneIphoneOutlined, { fontSize: "small" })))))),
-    /* @__PURE__ */ React62__default.default.createElement(ToggleInspectorPanelButton, null)
-  ), selectedMainTab === "editor" && /* @__PURE__ */ React62__default.default.createElement(SubjectInput, null), selectedMainTab === "preview" && /* @__PURE__ */ React62__default.default.createElement(SubjectPreview, null), /* @__PURE__ */ React62__default.default.createElement(ImageDropPasteHandler, { enabled: selectedMainTab === "editor" }, /* @__PURE__ */ React62__default.default.createElement(
+    samplesDrawerEnabled && /* @__PURE__ */ React57__default.default.createElement(ToggleSamplesPanelButton, null),
+    /* @__PURE__ */ React57__default.default.createElement(material.Stack, { px: 2, direction: "row", gap: 2, width: "100%", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 2 }, /* @__PURE__ */ React57__default.default.createElement(MainTabsGroup, null)), /* @__PURE__ */ React57__default.default.createElement(material.Stack, { direction: "row", spacing: 2 }, /* @__PURE__ */ React57__default.default.createElement(material.ToggleButtonGroup, { value: selectedScreenSize, exclusive: true, size: "small", onChange: handleScreenSizeChange }, /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "desktop" }, /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Desktop view" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.MonitorOutlined, { fontSize: "small" }))), /* @__PURE__ */ React57__default.default.createElement(material.ToggleButton, { value: "mobile" }, /* @__PURE__ */ React57__default.default.createElement(material.Tooltip, { title: "Mobile view" }, /* @__PURE__ */ React57__default.default.createElement(iconsMaterial.PhoneIphoneOutlined, { fontSize: "small" })))))),
+    /* @__PURE__ */ React57__default.default.createElement(ToggleInspectorPanelButton, null)
+  ), selectedMainTab === "editor" && /* @__PURE__ */ React57__default.default.createElement(SubjectInput, null), selectedMainTab === "preview" && /* @__PURE__ */ React57__default.default.createElement(SubjectPreview, null), /* @__PURE__ */ React57__default.default.createElement(ImageDropPasteHandler, { enabled: selectedMainTab === "editor" }, /* @__PURE__ */ React57__default.default.createElement(
     material.Box,
     {
       sx: {
@@ -8756,8 +8953,8 @@ function TemplatePanel2({ loadTemplates, saveAs, samplesDrawerEnabled = true })
         background: selectedMainTab === "editor" ? workspaceBackground === "checkerboard" ? WORKSPACE_CHECKERBOARD : WORKSPACE_SOLID : void 0
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(material.Box, { sx: { flexGrow: 1 } }, renderMainPanel()),
-    showSaveButtons && selectedMainTab === "editor" && /* @__PURE__ */ React62__default.default.createElement(SaveBar, { loadTemplates, saveAs })
+    /* @__PURE__ */ React57__default.default.createElement(material.Box, { sx: { flexGrow: 1 } }, renderMainPanel()),
+    showSaveButtons && selectedMainTab === "editor" && /* @__PURE__ */ React57__default.default.createElement(SaveBar, { loadTemplates, saveAs })
   )));
 }
 
@@ -8794,7 +8991,7 @@ function useDrawerTransition(cssProperty, open) {
     duration: !open ? transitions.duration.leavingScreen : transitions.duration.enteringScreen
   });
 }
-var EmailEditorInternal = React62.forwardRef((props, ref) => {
+var EmailEditorInternal = React57.forwardRef((props, ref) => {
   const {
     drawerEnterDuration = 225,
     drawerExitDuration = 225,
@@ -8816,10 +9013,10 @@ var EmailEditorInternal = React62.forwardRef((props, ref) => {
   const samplesDrawerOpen = useSamplesDrawerOpen();
   const marginLeftTransition = useDrawerTransition("margin-left", samplesDrawerOpen);
   const marginRightTransition = useDrawerTransition("margin-right", inspectorDrawerOpen);
-  const onChangeRef = React62.useRef(onChange);
+  const onChangeRef = React57.useRef(onChange);
   onChangeRef.current = onChange;
-  const prevDocJsonRef = React62.useRef("");
-  React62.useEffect(() => {
+  const prevDocJsonRef = React57.useRef("");
+  React57.useEffect(() => {
     var _a;
     const docJson = JSON.stringify(currentDocument);
     if (docJson !== prevDocJsonRef.current) {
@@ -8827,7 +9024,7 @@ var EmailEditorInternal = React62.forwardRef((props, ref) => {
       (_a = onChangeRef.current) == null ? void 0 : _a.call(onChangeRef, currentDocument);
     }
   }, [currentDocument]);
-  React62.useImperativeHandle(ref, () => ({
+  React57.useImperativeHandle(ref, () => ({
     saveTemplate: () => {
       return saveTemplate();
     },
@@ -8839,15 +9036,16 @@ var EmailEditorInternal = React62.forwardRef((props, ref) => {
       return getDocument();
     }
   }));
-  return /* @__PURE__ */ React62__default.default.createElement(material.Stack, { position: "relative", id: "drawer-container", sx: { minHeight } }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(material.Stack, { position: "relative", id: "drawer-container", sx: { minHeight } }, /* @__PURE__ */ React57__default.default.createElement(
     InspectorDrawer,
     {
       enterDuration: drawerEnterDuration,
       exitDuration: drawerExitDuration,
       deleteTemplate,
-      copyTemplate
+      copyTemplate,
+      renameTemplate
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     SamplesDrawer,
     {
       enterDuration: drawerEnterDuration,
@@ -8863,7 +9061,7 @@ var EmailEditorInternal = React62.forwardRef((props, ref) => {
       setTemplateKind,
       saveAs
     }
-  ), /* @__PURE__ */ React62__default.default.createElement(
+  ), /* @__PURE__ */ React57__default.default.createElement(
     material.Stack,
     {
       sx: {
@@ -8872,10 +9070,10 @@ var EmailEditorInternal = React62.forwardRef((props, ref) => {
         transition: [marginLeftTransition, marginRightTransition].join(", ")
       }
     },
-    /* @__PURE__ */ React62__default.default.createElement(TemplatePanel2, { loadTemplates, saveAs, samplesDrawerEnabled })
+    /* @__PURE__ */ React57__default.default.createElement(TemplatePanel2, { loadTemplates, saveAs, samplesDrawerEnabled })
   ));
 });
-var EmailEditor = React62.forwardRef((props, ref) => {
+var EmailEditor = React57.forwardRef((props, ref) => {
   const {
     initialTemplate: initialTemplateProp,
     initialTemplateId,
@@ -8898,25 +9096,27 @@ var EmailEditor = React62.forwardRef((props, ref) => {
     uploadImage,
     loadImages,
     deleteImage,
-    theme
+    theme,
+    locale
   } = props;
-  const resolvedTemplate = React62.useMemo(
+  activateLocale(locale);
+  const resolvedTemplate = React57.useMemo(
     () => typeof initialTemplateProp === "string" ? htmlToEditorConfig(initialTemplateProp) : initialTemplateProp,
     [initialTemplateProp]
   );
-  const prevTemplateRef = React62.useRef(void 0);
+  const prevTemplateRef = React57.useRef(void 0);
   if (resolvedTemplate && resolvedTemplate !== prevTemplateRef.current) {
     prevTemplateRef.current = resolvedTemplate;
     resetDocument(resolvedTemplate);
   }
-  React62.useEffect(() => {
+  React57.useEffect(() => {
     setPersistenceEnabled(persistenceEnabled);
   }, [persistenceEnabled]);
-  const imageCallbacks = React62.useMemo(
+  const imageCallbacks = React57.useMemo(
     () => ({ uploadImage, loadImages, deleteImage }),
     [uploadImage, loadImages, deleteImage]
   );
-  return /* @__PURE__ */ React62__default.default.createElement(material.ThemeProvider, { theme: theme || theme_default }, /* @__PURE__ */ React62__default.default.createElement(material.CssBaseline, null), /* @__PURE__ */ React62__default.default.createElement("div", { style: { height: "100%", overflow: "auto" } }, /* @__PURE__ */ React62__default.default.createElement(SnackbarProvider, null, /* @__PURE__ */ React62__default.default.createElement(ImageCallbacksProvider, { callbacks: imageCallbacks }, /* @__PURE__ */ React62__default.default.createElement(
+  return /* @__PURE__ */ React57__default.default.createElement(react.I18nProvider, { i18n: core.i18n }, /* @__PURE__ */ React57__default.default.createElement(material.ThemeProvider, { theme: theme || theme_default }, /* @__PURE__ */ React57__default.default.createElement(material.CssBaseline, null), /* @__PURE__ */ React57__default.default.createElement("div", { style: { height: "100%", overflow: "auto" } }, /* @__PURE__ */ React57__default.default.createElement(SnackbarProvider, null, /* @__PURE__ */ React57__default.default.createElement(ImageCallbacksProvider, { callbacks: imageCallbacks }, /* @__PURE__ */ React57__default.default.createElement(
     EmailEditorProvider,
     {
       initialTemplate: resolvedTemplate,
@@ -8925,7 +9125,7 @@ var EmailEditor = React62.forwardRef((props, ref) => {
       onSave,
       onChange
     },
-    /* @__PURE__ */ React62__default.default.createElement(
+    /* @__PURE__ */ React57__default.default.createElement(
       EmailEditorInternal,
       {
         ref,
@@ -8944,7 +9144,7 @@ var EmailEditor = React62.forwardRef((props, ref) => {
         onChange
       }
     )
-  )))));
+  ))))));
 });
 EmailEditor.displayName = "EmailEditor";
 EmailEditorInternal.displayName = "EmailEditorInternal";
@@ -8990,6 +9190,7 @@ exports.Reader = Reader;
 exports.ReaderBlock = ReaderBlock;
 exports.ReaderBlockSchema = ReaderBlockSchema;
 exports.ReaderDocumentSchema = ReaderDocumentSchema;
+exports.SUPPORTED_LOCALES = SUPPORTED_LOCALES;
 exports.Signature = signature_default;
 exports.SignatureProps = SignatureProps;
 exports.SignaturePropsDefaults = SignaturePropsDefaults;